콜백함수

AnSuebin·2022년 7월 4일
0
  1. 콜백함수란?
  • 파라미터로 함수를 전달받아, 함수의 내부에서 실행하는 함수
    자바스크립트에서는 함수도 하나의 자료형! 그래서 함수도 다른 함수의 매개변수로 전달할 수 있다. 매개변수로 전달하는 함수 = 콜백함수
  • CallBack 함수란 이름 그대로 나중에 호출되는 함수를 말함.
    콜백함수라고 해서 그 자체로 특별한 선언이나 문법적 특징을 가지고 있지는 않음. 콜백함수도 일반적인 자바스크립트 함수일 뿐.
    콜백 함수는 코드를 통해 명시적으로 호출하는 함수가 아니라, 개발자는 단지 함수를 동록하기만 하고, 어떤 이벤트가 발생했거나 특정 시점에 도달했을 때 시스템에서 호출하는 함수를 말함.
    즉 콜백함수는 콜백함수라는 유니크한 문법적 특징을 가지고 있는 것이 아니라, 호출방식에 의한 구분.
  • 매개변수(parameter)란 함수의 정의에서 전달받은 인수를 함수 내부로 전달하기 위해 사용하는 변수 / 인수(argument)란 함수가 호출될 때 함수로 값을 전달해주는 값
  1. 콜백 함수 예시

1) forEach
Array.forEach에 실행할 '콜백함수'는 현재 값, 인덱스, forEach를 호출한 배열을 매개변수로 받는다.
그리고 함수 내에서 따로 return을 할 필요가 없다.

let a = [0,1,2,3,4,5]
for (let i = 0; i < array.length; i++) {
  let item = a[i]
  console.log(item)
}
****const nums = [0,1,2,3,4,5]
nums.forEach((item) => {
  console.log(item)
})****

2) map
forEach와 다른점은 콜백함수 내에서 리턴해준다.
map은 리턴된 값들을 모아서 새로운 배열을 만들어준다.

let nums = [0, 1, 2, 3, 4, 5]
let newNums = []
for (let i = 0; i < array.length; i++) {
    const item = array[i];
    newNums.push(item * 2)
}
****const nums = [0,1,2,3,4,5]
const newNums = nums.map((item) => {
    return item * 2
})****

3) filter
배열의 요소를 하나씩 꺼내고, 함수를 실행하여 특정 조건을 통과하는 요소를 모아 새로운 배열로 반환한다.
필터에 실행할 콜백함수는 현재 값, 인덱스, 맵을 호출한 배열을 매개변수로 받는다.

let nums = [0,1,2,3,4,5]
let newNums = []
for (let i = 0; i < nums.length; i++) {
    let item = nums[i];
    if(item > 3) {
        numNums.push(item)
    }
} 
let nums = [0,1,2,3,4,5]
const newNums = nums.filter((item) => {
    return item > 3
})
profile
고객에게 명료한 의미를 전달하고, 명료한 코드를 통해 생산성 향상에 기여하고자 노력합니다.

0개의 댓글