find

find()는 함수(callback)를 만족하는 배열의 첫번째 요소의 값을 반환한다.

고차함수로 콜백함수를 실행한다.

callback(element, index, array)

1. element - 배열에서 처리중인 요소
2. index - 처리중인 요소의 인덱스
3. array - 함수가 호출된 배열

예시

const colors = [
  {
    id: 1,
    name: "red"
  },
  {
    id: 2,
    name: "blue"
  },
  {
    id: 3,
    name: "black"
  }
]

const result = colors.find((color, index, arr) => {
  console.log(color)
  console.log(index)
  console.log(arr)
  console.log('==================')
  return color.id === 2
})

console.log(result)

// 결과
{ id: 1, name: 'red' }
0
[
  { id: 1, name: 'red' },
  { id: 2, name: 'blue' },
  { id: 3, name: 'black' }
]
==================
{ id: 2, name: 'blue' }
1
[
  { id: 1, name: 'red' },
  { id: 2, name: 'blue' },
  { id: 3, name: 'black' }
]
==================
{ id: 2, name: 'blue' }

결과와 같이 현재요소, 현재 인덱스, 검사하는 배열을 호출한다.
또한 id가 2인 것을 발견을 하고 바로 객체를 리턴해준다.
그래서 id가 3인 객체는 console로 보여주지 않다.

만약 찾는 요소의 값이 아닌 인덱스 번호를 알고 싶으면 findIndex함수를 이용하여 된다.

실패값

찾는 요소가 없는 경우 undefined를 반환해준다.