[Javascript] 특정 요소 찾기 find, findIndex, filter

find

callback함수가 참을 반환할때까지 실행하고, 참을 만나면 첫번째 요소를 반환한다.
조건에 만족하는 요소를 찾지 못하면 undefined를 반환한다.
원본 배열을 변경시키지 않는다.

array.find((item, index, array) => 조건)

  const originArray = [{
    name:'rumi',
    phone:'android',
    state:true
  },{
    name:'ray',
    phone:'ios',
  },{
    name:'pink',
    phone:'LG',
    state:true
  }]

  const result = originArray.find(item => item.state); // 요소에 state값이 있는 것 찾기

  console.table(originArray) // 원본 배열을 mutate(변경)하지 않음
  console.log("result::",result) // {name:'rumi', phone:'android', state:true}

 

findIndex

조건을 만족하는 요소를 만나는 즉시 해당 요소의 인덱스를 반환한다.
length - 1 까지 callback을 실행하고, 조건을 만족하는 요소를 찾지 못하면 -1을 반환한다.

array.findIndex((item, index, array) => 조건)

  const originArray = [1,2,3,4,7,8,9,{name:'rumi'}];

  const result = originArray.findIndex(item => typeof item === 'string');
  
  console.table(originArray) // 원본 유지
  console.log("result::", result) // -1

 

filter

조건을 만족하는 모든 요소를 모아 새로운 배열로 반환한다.
조건을 만족하는 요소가 하나도 없다면 빈 배열을 반환한다.

 const originArray = [
    { name: "react", nounce: 12942 },
    { name: "vue", nounce: 5209 },
    { name: "ang",  nounce: 591 },
    { name: "RN", nounce: 1591, desc:"mobile" },
    { name: "flutter", nounce: 2552, desc:"mobile" },
  ];

  const filteringArray = originArray.filter((item, i) => item.nounce > 1000 && item.name.length >= 4);
  console.table(originArray);
  console.log("filterArray::", filteringArray); // name이 react,flutter인 오브젝트를 포함한배열