자바스크립트 배열에서 찾기

citron03·2022년 7월 24일
0

html, css, js

목록 보기
33/43
  • 배열에서 데이터를 찾는 방법으로 여러 방법이 있다.
  • find 메서드, findIndex 메서드, indexOf 메서드, includes 메서드를 정리한다.

find


const arr = [10, 20, 30, 40, 50];
const finding = arr.find(el => el > 30);

console.log("찾은 데이터: ", finding);
// 찾은 데이터:  40
  • 위와 같이 조건에 부합하는 가장 첫 번째 원소인 40이 반환되었다.

  • 찾으려는 데이터가 없다면, undefined이 반환된다.

  • 조건에 부합하는 모든 원소를 찾고싶다면, filter 메서드를 사용한다.

findIndex


const arr = [10, 20, 30, 40, 50];
const findingIndex = arr.findIndex(el => el > 35);

console.log("찾은 데이터: ", findingIndex);
// 찾은 데이터:  3
  • findIndex 메서드는 find 메서드와는 다르게 원소의 값이 아니라 인덱스가 반환된다.

  • 조건에 부합하는 첫 요소의 인덱스가 반환된다.

  • 찾으려는 데이터가 없다면, -1이 반환된다.

indexOf


const arr = [10, 20, 30, 40, 50];
const findingindexOf = arr.indexOf(40);

console.log("찾은 데이터: ", findingindexOf);
// 찾은 데이터:  3
  • indexOf 메서드의 인자로는 값이 필요하다.

  • 해당 값이 있으면 해당 원소의 인덱스가 반환되고, 값이 없다면 -1이 반환된다.

includes


const arr = [10, 20, 30, 40, 50];
const findingIncludes = arr.includes(40);

console.log("찾았나요?", findingIncludes);
// 찾았나요? true
  • 해당 데이터가 존재하면 true, 없다면 false가 반환된다.
  • 배열 요소의 위치를 찾고자 하는 경우에는 indexOf()를 사용한다.
  • 배열 요소가 해당 배열에 존재하는지 확인하고자 하는 경우에는 indexOf() 또는 includes()를 사용할 수 있다.

참고 자료 출처 : https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Array/find

profile
🙌🙌🙌🙌

0개의 댓글