배열의 메소드 2 (indexOf, lastIndexOf, includes, find, findIndex)

원하는 요소 찾기

 

1.  indexOf

인덱스 from부터 시작해 item(요소)을 찾고,

요소를 발견하면 가장 처음 발견한 요소의 인덱스를 반환하고, 발견하지 못했으면 -1을 반환.

arr.indexOf(item, from)

let arr = [1, 2, 3, 4, 3, 2, 1];

console.log(arr.indexOf(5)); // -1
console.log(arr.indexOf(3)); // 2
console.log(arr.indexOf(3, 3)); // 4
console.log(arr.indexOf(3, -2)); // -1
console.log(arr.indexOf(3, -3)); // 4

2.  lastIndexOf

indexOf와 동일하나 검색을 끝에서부터 시작.

arr.lastIndexOf(item, from)

let arr = [1, 2, 3, 4, 3, 2, 1];

console.log(arr.lastIndexOf(5)); // -1
console.log(arr.lastIndexOf(3)); // 4
console.log(arr.lastIndexOf(3, 1)); // -1
console.log(arr.lastIndexOf(3, 2)); // 2
console.log(arr.lastIndexOf(3, -1)); // 4
console.log(arr.lastIndexOf(3, -4)); // 2

3.  includes

인덱스 from부터 시작해 item이 있는지를 검색하는데, 해당하는 요소를 발견하면 true를 반환합니다.

arr.includes(item, from)

let arr = [NaN];
alert( arr.indexOf(NaN) ); // -1 (완전 항등 비교 === 는 NaN엔 동작하지 않으므로 0이 출력되지 않습니다.)
alert( arr.includes(NaN) );// true (NaN의 여부를 확인하였습니다.)

4.  find

기존의 indexOf가 배열내의 특정 값을 찾는데에 사용되었다면,

find, findIndex는 callback 함수를 통해서 좀 더 복잡한 조건의 검색이 가능.

let result = arr.find(function(item, index, array) {
  // true가 반환되면 반복이 멈추고 해당 요소를 반환합니다.
  // 조건에 해당하는 요소가 없으면 undefined를 반환합니다.
});

let objArr = [{name: 'Nm1', age: 10},{name: 'Nm2', age: 10}, {name: 'Nm3', age: 2}];
let under5 = objArr.find((item)=> item.age < 5);

console.log(under5) // {name: 'Nm3', age: 2}

5.  findIndex

주어진 함수를 통과한 첫 번째 요소의 인덱스 값을 반환.

let arr = [1,5,6,3,4,7];
let even = arr.find((item)=> item % 2 === 0 );
console.log(even); // 6

var evenIndex = arr.findIndex((item) => item % 2 === 0);
console.log(evenIndex); // 2 : '6'의 배열 내 index