본문 바로가기
JavaScript

20210405#(27)JavaScript(함수고급)

by zho 2021. 4. 5.

자바스크립트는 함수도 하나의 자료형이기 때문에 매개변수로 전달할 수 있다. 

이렇게 매개변수로 전달하는 함수를 callback 콜백 함수라고한다.

 

(선언적 함수 사용)

1.callThreeTimes() 함수는 함수를 매개변수로 받았다.

2.callThreeTimes() 함수의 callback 매개변수에 print() 함수를 전달했다.

3.callThreeTimes() 함수 내부에선 callback(i) 형태로 함수를 호출함.

4. 매개변수로 전달된 print() 함수가 차례로 호출.

 

(익명 함수 사용)

1.callThreeTimes() 함수는 함수를 매개변수로 받았다.

2.callThreeTimes() 함수 내 익명 함수를 통해 즉시 실행.

 

#callback함수를  활용하는 함수 - forEach()

function(value, index, array){}

 

 

#callback함수를 활용하는 함수 - map()

-map()메서드는 콜백함수에서 리턴한 값들을 기반으로 새로운 배열을 만드는 함수.

 

#callback함수를 활용하는 함수 - filter()

-filter 메소드는 콜백 함수에서 리턴하는 값이 참(true)인 것들만 모아 새로운 배열을 만드는 함수.

 

#화살표 함수

function 키워트 대신 =>를 사용한다.

(매개변수) => 리턴 값

 

위와 같이 어떤 메서드가 리턴하는 값을 기반으로 해 함수를 줄줄이 사용하는 것을 메소드 체이닝 method chaning이라고 한다. 

 

#엄격 모드

자바스크립트 코드를 보면 블록 가장 위에 'use strict'라는 문자열이 있는 걸 볼 수 있다. 이는 엄격 모드라는 기능이다.

일반 자바스크립트에서는 선언 없이 변수를 사용할 수 있지만, 엄격 모드에서는 data is not defined라는 오류가 뜬다.

 

#익명 함수 vs 선언적 함수

익명 함수는 순차적인 코드 실행순으로 생성된다. 즉 차례대로 코드가 실행되며 함수가 생성된다는 것이다.

그와 달리 선언적 함수는 순차적인 코드실행 전 생성된다. 즉 어디서 함수를 호출해도 상관이 없다.

 

fuc = function(){

console.log('익명 함수')

}

 

function fuc(){

console.log('선언적 함수')

}

 

fuc()

 

위 코드는 어떤 실행 결과가 나올까?

 

답은 익명 함수가 출력된다. 그 이유는 선언적 함수가 먼저 생성 되고 이후 순차적으로 익명함수가 생성 되기때문에 익명함수가 출력된다.

 

익명 함수와 선언적 함수를 같이 쓰게 되면 혼란스럽기 때문에 최근 자바스크립트에서는 익명 함수로 통일하여 코드를 작성하는 것이 안전하고 편리한 선택이 될 것이다.

 

#forEach 메서드 활용

 

참고자료 : 한빛미디어 - 혼자공부하는자바스크립트 (윤인성) 

728x90