JavaScript 검색 배열 방법

string에 사용된 includes indexOf lastIndexOf와 같은 메서드는 항목을 검색하기 위해 배열에서도 사용됩니다.

indexOf, lastIndexOf 및 include 메소드

indexOf 메서드

indexOf 메서드의 구문은 다음과 같습니다.

통사론

array.indexOf(item[, from])

검색은 왼쪽에서 오른쪽입니다.
item => item는 배열의 요소입니다.
from => from는 계산을 시작할 위치를 지정합니다. 이전에 일치하는 항목을 무시합니다.

아래 예를 참조하십시오.

const numbs = [ 5, 0, 2, 4, 2, 1, 4, 6, 0, 10 ];

console.log( numbs.indexOf(0) ); // 1
console.log( numbs.indexOf(0, 2) ); // 8

lastIndexOf 메서드

lastIndexOf 메서드의 구문은 다음과 같습니다.

통사론

array.lastIndexOf(item[, from])

검색은 오른쪽에서 왼쪽입니다.
item => item는 배열의 요소입니다.
from => from는 계산을 시작할 위치를 지정합니다. 이전에 일치하는 항목을 무시합니다.

아래 예를 참조하십시오.

const numbs = [ 5, 0, 2, 4, 2, 1, 4, 6, 0, 10 ];

console.log( numbs.indexOf(0) ); // 9
console.log( numbs.indexOf(0, 2) ); // 1

indexOf 및 lastIndexOf 항목이 모두 있는 경우 -1 를 반환합니다.

const numbs = [ 5, 0, 2, 4, 2, 1, 4, 6, 0, 0 ];

console.log( numbs.indexOf(9) ); // -1
console.log( numbs.lastIndexOf(9) ); // -1

포함 방법

includes 메서드의 구문은 다음과 같습니다.

통사론

array.includes(item)

item => item가 있으면 true를 반환하고 그렇지 않으면 false를 반환합니다.

아래 예를 참조하십시오.

const numbs = [ 5, 0, 2, 4, 2, 1, 4, 6, 0, 10 ];

console.log( numbs.includes(4) ); // true
console.log( numbs.includes(3) ); // false

includes method can also check if NaN but indexOf/lastIndexOf can't.

아래 예를 참조하십시오.

const numbs = [ 5, 0, 2, 4, NaN, 1, 4, 6, 0, NaN ];

console.log( numbs.indexOf(NaN, 2) ); // -1
console.log( numbs.lastIndexOf(NaN, 2) ); // -1
console.log( numbs.includes(NaN) ); // true

-1 is returned for both indexof and lastIndexOf because equality === doesn't work for NaN.

find 및 findIndex 메소드

find 메소드는 특정 조건을 가진 객체를 찾습니다.

find 메서드의 구문은 다음과 같습니다.

통사론

array.find(func)

func => func는 콜백 함수입니다.

배열에서 첫 번째로 일치하는 항목을 반환합니다.

아래 예를 참조하십시오.

const numbs = [ 5, 0, 2, 4, 2, 1, 4, 6, 0, 10 ];

const greaterThan3 = num => {
    return num > 3;
};

numbs.find(greaterThan3); // 5 => 5 is greater than 3

인덱스 찾기

findIndex 메서드의 구문은 다음과 같습니다.

array.findIndex(function)

배열에서 일치하는 첫 번째 항목의 인덱스를 반환합니다.

아래 예를 참조하십시오.

const numbs = [ 5, 0, 2, 4, 2, 1, 4, 6, 0, 10 ];

const greaterThan3 = num => {
    return num > 3;
};

numbs.findIndex(greaterThan3); // 0 => 5 is at index 0

함수는 일류 객체이므로 콜백 함수func 대신 객체를 가질 수 있습니다.

아래 구문을 참조하십시오.

array.find(obj)

아래 예를 참조하십시오.

const names = [ 
    { id: 1, name: "Bello" },
    { id: 2, name: "John" },
    { id: 3, name: "Sarah" }
  ];

const id2 = item => {
    return item.id === 2;
};

const findName = names.find(id2);
findName.name;

findIndex 메서드를 사용하는 다른 예를 참조하십시오.

const names = [ 
    { id: 1, name: "Bello" },
    { id: 2, name: "John" },
    { id: 3, name: "Sarah" }
  ];

const id2 = item => {
    return item.id === 2;
};

const findName = names.findIndex(id2);
findName; // 2 =>  returns index of item.id

find 및 findIndex 메소드의 일반 구문

일반적인 구문은 다음과 같습니다.

arr.find(func(item[, index[, array]]))

필터 방식

구문은 find 와 유사하지만 filter 는 일치하는 모든 요소의 배열을 반환합니다.
find 메서드의 구문은 다음과 같습니다.

통사론

array.filter(func)

func => func는 콜백 함수입니다.

아래 예를 참조하십시오.

const numbs = [ 5, 0, 2, 4, 2, 1, 4, 6, 0, 10 ];

const greaterThan3 = num => {
    return num > 3;
};

numbs.filter(greaterThan3); // [ 5, 4, 4, 6, 10 ]

const names = [ 
    { id: 1, name: "Bello" },
    { id: 2, name: "John" },
    { id: 3, name: "Sarah" }
  ];

const id2 = item => {
    return item.id > 2;
};

const findNames = names.filter(id2);
findNames; // [ { id: 2, name: 'John' }, { id: 3, name: 'Sarah' } ]

일반적인 구문은 다음과 같습니다.

array.filter(func(item[, index[, array]]))

행복한 코딩!!!