[JS] 콜백 함수

·2022년 10월 12일
0

JavaScript

목록 보기
15/25

콜백 함수

callback function
나중에 부르는 함수
부르지 않으면 그냥 남아있고 필요할 때 널 불러줄거야 근데 (고차)함수의 인자로 불러줄거야
고차함수의 인자는 콜백함수

function sum(x, y, 콜백함수){
    콜백함수(x + y);
    return x + y
}

sum(10, 20, console.log)
// 30 리턴값
// 30 콜백함수로 콘솔로그가 들어가서 찍힌 것

map

map() 메서드는 배열 내의 모든 요소 각각에 대하여 주어진 함수를 호출한 결과를 모아 새로운 배열을 반환
https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Array/map
arr.map(callback(currentValue[, index[, array]])[, thisArg])

  • 매개변수
    callback : 새로운 배열 요소를 생성하는 함수. 다음 세 가지 인수를 가집니다.
    currentValue (처리할 현재 요소)
    index Optional (처리할 현재 요소의 인덱스)
    array Optional (map()을 호출한 배열)
    thisArg (Optional callback을 실행할 때 this로 사용되는 값)
  • 반환 값 : 배열의 각 요소에 대해 실행한 callback의 결과를 모은 새로운 배열

Object는 사물을 설명하기 위해 있는 것
객체는 순서를 정할 수가 없다 iterable이 아니다 한마디로 순환할 수 없다
곤이라는 객체 안에 장기들을 순서대로 줄 세울 수 있나? 없다
map은 1:1로 자료를 맵핑해서 찾아주겠다
객체는 키값에 문자열,심볼만
맵은 키값에 이것저것 올수있음

function 제곱(x){
    return x ** 2
}
let arr = [10,20,30,40,50]
arr.map(제곱)
// (5) [100, 400, 900, 1600, 2500]

화살표함수로 만들기

function 제곱(x){
    return x ** 2
    // x => x ** 2 화살표함수로 만들면 이렇게
}
arr.map(x => x**2)

forEach

https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach
forEach() 메서드는 주어진 함수를 배열 요소 각각에 대해 실행
arr.forEach(callback(currentvalue[, index[, array]])[, thisArg])

map은 새로운 어레이 만들어주고 forEach는 순회

function 두배(x){
    console.log(x *2)
}

let arr = [10, 20, 30, 40, 50]
arr.forEach(두배)

노드리스트의 forEach는 IE 지원하지 않습니다

문제 : 화살표 함수 사용해서 아래 map과 동일한 기능하는 forEach문을 완성해주세요

let arr = [10, 20, 30, 40, 50]
arr.map(x => x**2)

let result = []
arr.forEach(e => {
    result.push(e ** 2)
})
console.log(result)
// (5) [100, 400, 900, 1600, 2500]
profile
주니어 프론트엔드 웹 개발자 🐛

0개의 댓글