JS

JS, .find() .filter()

Hyeon_E 2023. 2. 22. 00:35

.find()

arr.find(callback(element[, index[, array]])[, thisArg])

.find() 함수는 배열에서 특정 값을 찾는 조건을 callback 함수를 통해 전달되어, 첫 번째 요소를 반환

테스트 기능을 만족하는 값이 없으면 undefined 반환됨

파라미터

callback(element, index, array) 함수

 

callback 함수에서 사용자가 테스트할 조건을 정의, 만약 배열의 값이 조건에 부합하여 true를 리턴하면,

해당 배열의 값이 find() 함수의 리턴 값이 됨

조건에 부합하는 값을 찾으면, 그 이후의 배열값은 테스트되지 않음

  • element : 현재 처리중인 배열의 element입니다.
  • index : 현재 처리중인 배열의 index입니다. (optional)
  • array : find() 가 호출된 배열입니다. (optional)

thisArg(optional)

callback을 실행할 때 this로 사용할 객체

리턴값

  • callback 함수에 정의한 조건에 부합하는 배열의 첫 번째 값을 리턴
  • 조건에 부합하는 배열 값이 없을 경우 undefined를 리턴
const array = [5, 12, 8, 130, 44];
const found = array.find(element => element > 10);
console.log(found);	//12
const arr = [
  {name: 'apple', price : 1000},
  {name: 'apple', price: 2000},
  {name: 'banana', price : 2500},
];

let isApple = arr.find((x) => x.name == 'apple');
console.log(isApple) //{name: 'apple', price: 1000}

 

.filter()

arr.filter(callback(element[, index[, array]])[, thisArg])

.find()가 특정 조건에 부합하는 배열의 첫번째 값만을 리턴하면

.filter()는 특정 조건에 부합하는 배열의 모든 값을 배열 형태로 리턴

파라미터

.find()와 동일

리턴값

  • callback 함수에 정의한 조건에 부합하는 배열의 모든 값을 새로운 배열로 리턴
  • 조건에 부합하는 배열 값이 없을 경우 빈 배열을 리턴
const arr = [
  {name: 'apple', price : 1000},
  {name: 'apple', price: 2000},
  {name: 'banana', price : 2500},
];

let isApple = arr.filter((x) => x.name == 'apple');
console.log(isApple) //[{name: 'apple', price: 1000},{name: 'apple', price: 2000}]