js - find()

hazel's·2022년 5월 8일
0

javascript

목록 보기
8/12
post-thumbnail

find 메서드는 ES6에 도입되었다.
자신을 호출한 배열의 요소를 순회하며 인수로 전달된 콜백 함수를 호출하여 반환값이 true인 첫 번째 요소를 반환한다. 반환값에 true인 요소가 존재하지 않다면 undefined 반환한다.

find 메서드의 콜백 함수는 find 메서드를 호출한 요소값과 인덱스, find 메서드를 호출한 배열 자체, 즉 this를 순차적으로 전달받을 수 있다.

const students =[
	{id :1, name:"james"},
    {id :2, name:"kyile"},
    {id :3, name:"debie"},
    {id :4, name:"kim"}
]

// id가 4인 첫 번째 요소 반환. find메서드는 배열이 아니라 요소를 반환.
students.find(students => students.id === 4);
// {id :4, name:"kim"}

find 메서드는 filter 메서드와 다르게 콜백 함수의 반환값이 true인 첫 번째 요소를 반환하므로 find의 결과값은 배열이 아니라 해당 요소 값이다.
(* filter 메서드는 콜백 함수의 호출 결과가 true이 요소만 추출한 새로운 배열을 반환한다. 그래서 반환값은 언제나 배열이다.)

//filter는 배열 반환
[5,4,3,2,1].filter(i =>i ===3); //[ 3 ]

//find는 요소 반환
[5,4,3,2,1].find(i =>i ===3);   //3
profile
좋아하는 것을 하나하나 채워가면 행복해질꺼야

0개의 댓글