24.04.28 콜백함수

자바스크립트에서 함수도 하나의 자료형이므로 매개변수로 전달할 수 있는데, 함수를 매개변수로 전달하는 함수를 콜백함수라 합니다.

function callThreeTimes (callback) {
	for (let i =0; i<3; i++) {
    	callback(i)
    }
}

function print (i) {
	console.log(`${i}번째 함수 호출`)
}

callThreeTimes(print)

//0번째 함수 호출
//1번째 함수 호출
//2번째 함수 호출

 

callThreeTimes(function (i) {
	console.log(`${i}번째 함수 호출`)
})

이렇게 익명함수 형태로 작성할 수도 있다.

 

콜백함수는 forEach(), map(), filter()에 주로 사용된다.

let numbers = [273, 52, 103, 32, 57]
numbers.forEach(function (value, index, array) {
	console.log(`${index}번째 요소 : ${value}`)
})
//0번째 요소: 273
//1번째 요소: 52
//2번째 요소: 103
//3번째 요소: 32
//4번째 요소: 57

let numbers = [273, 52, 103, 32, 57]
numbers = numbers.map(function (value, index, array) {
	return value*value
})
numbers.forEach(console.log)
//74529 0 Array(5)
//2704 1 Array(5) 
//10609 2 Array(5) 
//1024 3 Array(5) 
//3249 4 Array(5) 

const numbers = [0, 1, 2, 3, 4, 5]
const evenNumbers = numbers.filter(function (value) {
	return value%2 === 0
})
console.log(`원래배열: ${numbers}`)
console.log(`짝수만 추출: ${evenNumbers}`)
//원래배열: 0,1,2,3,4,5
//짝수만 추출: 0,2,4