함수

※ 함수

함수 - JavaScript | MDN

 

다른 정리된 블로그보다 위의 공식문서 정독하는 게 제일 좋더라(사실 잠와서 읽다가 말긴 했는데 나중에 다 읽을..걸..?)

 

 

 

 

함수의 기본

 

 

▷ 함수 선언 및 호출

 <script>
        function two() {                                         // two()라는 이름의 함수 선언. 내용은 <li>디용</li>, <li>띠용</li>
        document.write('<li>디용</li>');
        document.write('<li>띠용</li>');
        }
        document.write('<li>오잉?</li>');
        two();                                                        // two() 함수 호출
        document.write('<li>오옹~</li>');
        two();                                                        // two() 함수 호출
</script>

 

 

 

▷ Parameter(매개변수)와 Argument(인수)

 

매개변수  : 인수를 받아서 함수 안으로 매개하는 변수. 

인수 : 입력값. (내 식대로 말하면 함수 정의역의 원소)

<script>
        function sum(left, right) {                          // left 와 right는 매개변수. 아래에서 인수를 받아온다.
        document.write(left + right + '<br>');
        } 
        sum(2, 3); // 5                                          // 2, 3 : 인수
        sum(3, 4); // 7                                          // 3, 4 : 인수
 </script>

 

 

 

▷ return

 

> 1+1 
< 2

> 1 === 1
< true

이 때 1+1를 2의 표현식, 1 === 1을 true의 표현식이라고 함. 

function sum2(left, right) {               // 매개변수 left, right로 들어간 값에 대해
            return left + right;                // return을 통해 함숫값 출력
        }
        document.write(sum2(2, 3) + '<br>');
        document.write('<div style="color:red">' + sum2(2, 3) + '</div>');
        document.write('<div style="font-size:3rem;">' + sum2(2, 3) + '</div>');

 

 

 

함수 활용

 

최종적으로, 다음과 같이 코드를 수정했다.

 

input에 딸려있던 조건문을 포함한 자바스크립트 코드를 head로 빼서 nightdayft라는 함수로 정의하고, 

input에는 nightdayft 함수를 호출하여 인수로 this를 지정했다.

따라서 nightdayft에서 self 매개변수를 통해 자기자신(this)을 받아서 코드가 실행되게 하였다.

 

See the Pen Untitled by j1n00000 (@j1n00000) on CodePen.