Step01_dataType7,8 (function, return, sources)

함수 만드는 3가지 방법을 소개한다.

 

 

방식에 차이가 있다.  첫번재와 세번째 방식인 f1과 f3 함수는 let을 이용하여 함수를 준비해놓고 호출시키지는 않은 상태라고 볼 수 있고 두번째 방식인 f2 함수는 준비도 되어있지만 업로드시 호출된다. 

 

 

 

함수를 호출하는 목적은 크게 두가지가 있다.

 

1. 어떤 동작을 하기 위해

2. 어떤 값을 받아오기 위해

 

예제의 pushMonkey는 동작은 하지만 값은 undefined가 나오듯이 결과값이 나오지는 않는다. 반면에 getFortune은 let과 return을 활용하여 결과값이 나오게 설정하였다. 위의 html을 실행시키면 위 사진과 같은 console창이 실행된다.

 

 

sources 창을 키고 breakpoints를 만든 다음에 javascript를 한칸씩 넘겨가며 진행되는 과정을 확인해볼 수 있다.

 

번호(줄)를 누르고 새로고침하면 할 수 있다.

step over next function call->  script에 적힌 순서대로 javascript가 동작하는 것을 체크할 수 있다. 

step into next function call->  javascript가 어떤 순서대로 읽고 동작하는지 체크할 수 있다.

 

창을 두개로 sources와 console을 보며 확인 가능하고 만약 하단에 console창이 뜨지 않는다면 esc 버튼을 누르면 된다.