
알고있으면 좋은 Javascript Tip✨
find()
- 자바스크립트에서 for문의 남용을 막기 위해 만들어낸 배열함수 이다.
- 배열 요소 중, 어떠한 조건에 맞는 첫번째 요소만 골라내고 싶다면 가장 알맞은 함수이다.
- 만약 조건에 만족하는 요소가 없다면 undefined 를 return 한다.
- 배열을 순환하면서 조건에 맞는 요소를 찾는 순간 순환을 멈추고 즉시 값을 반환한다.
// 화살표 함수 표기법)
array.find((element, index, array) => { ... });
// 콜백함수로 호출하는 법)
array.find(callbackFn, thisArg);
// 익명함수로 표기법)
array.find(function(element, index, array) {
}, thisArg);
- callback 함수 : 배열의 모든 요소가 거쳐갈 함수
- element : (순환 중) 현재 처리중인 요소 그 자체
- index : (순환 중) 현재 처리중인 요소의 index
- array : find()가 실행되고 있는 원본 배열
- thisArg : callback 함수가 실행중일 때 this로 사용될 값
let friends = [
{name: 'Son', age: 30},
{name: 'Kane', age: 29},
{name: 'Lucas', age: 30}
];
// 예시)
let result = friends.find( ({ name }) => name == 'Kane');
// 결과)
result = {name: 'Kane', age: 29}
- find() 메서드는 배열 friends를 순회하면서 name 속성이 'Kane'인 요소를 찾고, 해당 요소를 result 변수에 할당한다.
- 따라서 result는 { name: 'Kane', age: 29 } 객체가 된다.
- 만약 찾는 요소가 없다면 undefined를 반환한다.
'Study > JavaScript' 카테고리의 다른 글
| [JS] event.target (0) | 2023.07.26 |
|---|---|
| [JS] clientWidth & clientHeight (0) | 2023.07.26 |
| [JS] sort (0) | 2023.07.21 |
| [JS] append & prepend & after & before (0) | 2023.07.21 |
| [JS] createElement (0) | 2023.07.21 |