[JavaScript] 자바스크립트 find 함수 사용법

안녕하세요. gaki 입니다.

오늘은 배열에서 특정 값을 찾아주는 find 함수에 대해서 이야기 해보려 합니다.

find 함수는 자바스크립트 Array 객체의 프로토타입 매서드입니다.

 

<목차>

1. find 함수 설명

2. find 함수 예제

 

1. 자바스크립트 find 함수 설명

---

find 함수는 Array 객체의 프로토타입 매서드로 존재하는 함수입니다.

즉 따로 임포트 하지않고서, 배열에 바로 사용할 수 있습니다.

Array.prototype.find()

시간복잡도: O(N)

함수는 아래와 같이 구성되어 있습니다.

 

arr.find(callback[, thisArg])

 

find 매서드는 인자로 callback 함수를 받습니다. 

callback 함수가 참을 반환할때 까지 배열의 각 요소에 대해 callback 함수를 실행합니다.

만약 참을 반환하는 어느 요소를 찾았다면 find 매서드는 해당 요소의 값을 즉시 반환하고,

callback 이 참을 반환하는 요소를 하나도 찾지 못했다면 undefined 를 반환합니다.

 

callback 함수는 최대 3개의 인자를 가지고 호출됩니다.

첫번째 인자는 요소의 값

두번째는 요소의 인덱스

세번째는 배열 전체 

 

통상적으로 find 매서드를 쓸때는 첫번째 인자인 요소의 값만 callback 함수에 넣고 사용합니다.

 

 

 

2. 자바스크립트 find 함수 예제

---

let arr = ["a","b","c"];


let match = arr.find((elem, idx, arr) => {
	console.log(elem);
    console.log(idx);
    console.log(arr);
    console.log("----");
    
    return elem === "c";
    })
    
 console.log(match);
 
/* 출력값
 a
0
[ 'a', 'b', 'c' ]
----
b
1
[ 'a', 'b', 'c' ]
----
c
2
[ 'a', 'b', 'c' ]
----
c
*/

["a", "b", "c"] 라는 배열에서 각 요소 하나하나를 순회할때 elem 이 "c" 와 같은 걸 찾을 때 까지 배열을 순회해서 찾는다.

arr.find((elem) => elem === "b");

위의 식은 arr 를 순회하면서 elem 이 "b" 와 같은 것을 리턴한다. 라는 의미이다.