티스토리 뷰

이번 시간에 볼 예제에 앞서 매개변수(파라미터)에 대해 조금 생소하다 싶으면 이전 글을 참고하세요.

>> [[JQUERY]자바스크립트] - jQuery 009. 함수 function


아래는 예제 입니다.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
<!DOCTYPE html>
<html lang="ko">
<head>
    <title>Title</title>
    <script src="js/jquery-3.3.1.min.js"></script>
    
    <script>
        $(function(){       // jquery 시작
        
            //함수호출
            fn99dan(2);
            
        });
        
        //함수
        function fn99dan(dan){
            var index = 2;
 
            document.write(dan, "단 입니다.","</br>");
            document.write(dan, " * ", index, " = ", dan*index++ ,"</br>");
            document.write(dan, " * ", index, " = ", dan*index++ ,"</br>");
            document.write(dan, " * ", index, " = ", dan*index++ ,"</br>");
            document.write(dan, " * ", index, " = ", dan*index++ ,"</br>");
            document.write(dan, " * ", index, " = ", dan*index++ ,"</br>");
            document.write(dan, " * ", index, " = ", dan*index++ ,"</br>");
            document.write(dan, " * ", index, " = ", dan*index++ ,"</br>");
            document.write(dan, " * ", index, " = ", dan*index++ ,"</br>");
        }
        
    </script>
</head>
    <body>
    </body>
</html>
cs


이전글과 예제가 비슷합니다. 3줄 빼고는 같다고 봐야합니다. 다른부분을 살펴보면,

11
            fn99dan(2);
cs
먼저 11번 라인을 보면 ()안에 값이 들어간 것을 볼 수있습니다.

16
        function fn99dan(dan){
cs

16번 라인을 보면 fn99dan() 에서 fn99dan(dan) 으로 바뀌었는데, 11번 라인에서 ()안에 넣은 2를 

fn99dan()함수 안에서 dan이라는 변수에 담아 사용하겠다 쯤으로 이해하심 됩니다.



이전글을 보지 않고 보시는 분들을 위해 조금 설명을 붙이겠습니다.

먼저 함수부터 보겠습니다.

16
17
18
19
20
21
22
23
24
25
26
27
28
        function fn99dan(dan){
            var index = 2;
 
            document.write(dan, "단 입니다.","</br>");
            document.write(dan, " * ", index, " = ", dan*index++ ,"</br>");
            document.write(dan, " * ", index, " = ", dan*index++ ,"</br>");
            document.write(dan, " * ", index, " = ", dan*index++ ,"</br>");
            document.write(dan, " * ", index, " = ", dan*index++ ,"</br>");
            document.write(dan, " * ", index, " = ", dan*index++ ,"</br>");
            document.write(dan, " * ", index, " = ", dan*index++ ,"</br>");
            document.write(dan, " * ", index, " = ", dan*index++ ,"</br>");
            document.write(dan, " * ", index, " = ", dan*index++ ,"</br>");
        }
cs


fn99dan(dan)을 생성하고, index 라는 변수에 2를 대입합니다. index는 dan*index 에 사용합니다.


document.wirte 에 대한 설명은 이전글로 대체합니다.

>> [[JQUERY]자바스크립트] - jQuery 003. 출력기능 document.write()


dan에 대한 결과 값을 dan * index 를 출력뒤에 index의 값을 ++ 시켜줍니다. ++(증감연산자)에 대한 설명도 이전글로 대체합니다.

>> [[JQUERY]자바스크립트] - jQuery 008. 증감연산자 ++,--


아직 반복문에 대해선 설명은 안드렸기때문에 같은 라인을 8번 복사해서 *2 ~ *9 까지 출력합니다.


아래는 실행 화면입니다.


아래 링크는 필자가 사용한 어도비 브라켓 사용방법입니다.

>> [[JQUERY]자바스크립트] - 어도비 브라켓(ADOBE Brackets) 설치하기

>> [[JQUERY]자바스크립트] - 어도비 브라켓(ADOBE Brackets) 설정하기

>> [[JQUERY]자바스크립트] - 어도비 브라켓(ADOBE Brackets) 제이쿼리(jquery) 연결하기






댓글