본문 바로가기
programming/javascript

자바스크립트 배열 find 메서드 사용 배열의 검색된 첫번째 값 찾기

by 개코 - 개발과 코딩 2022. 1. 29.

자바스크립트에서 배열 탐색시 find 메서드를 사용할 수 있다. find 메서드는 배열을 탐색하면서 조건에 맞는 값을 리턴해 준다. 자바스크립트 배열을 탐색하는 메서드는 많이 있다. 다른 것과 비교하여 비슷한 기능을 하는 메서드들은 이미 많이 있다.

자바스크립트 배열 find 메서드 사용
배열의 검색된 첫번째 값 찾기

find 메서드는 자바스크립트 배열에서 지정한 값을 찾는 역할을 한다.

중복된 값이 있을 경우 첫번째로 검색된 자료를 리턴하여 보여준다.

자바스크립트에서 배열의 값을 찾는 메서드는 많이 있다.

find 메서드는 그 중 하나이다.

find 배열 탐색하기

다른 자바스크립트 배열 메서드를 사용하는 것과 마찬가지로 find 메서드 또한 사용법은 같다.

조건에 맞는 값이 있다면 값을 리턴하고 탐색을 중단한다.

즉, 조건에 맞는 값이 있다면 같은 값들이 여러개 있다고 해도 최초로 발견된 값을 리턴한다.

Array.find(fnCallback);
function fnCallback(value, index, array) {
	return 조건;
}

코드샘플

위의 find 사용법을 가지고 자바스크립트 예제를 만들어 본다.

코드는 크게 변하지 않았다.

기존에 사용하던 메서드와 동일하기 때문이다.

<!DOCTYPE html>
<html>
    <body>

        <script>

            let vArray;
            let vFind;

            console.log('----------');

            vArray = [1, 10, 100, 1000, 10000];
            
            console.log(vArray);

            console.log('----------');

            vFind = vArray.find(fnCallbackNumber);

            function fnCallbackNumber(value, index, array) {
                return value > 10;
            }
            
            console.log(vFind);

            console.log('----------');

        </script>

    </body>
</html>

배열을 하나 만들고 find 메서드를 사용하였다.

find 의 리턴값은 콜백함수의 조건에 맞는 값이 리턴된다.

코드에는 10 이상의 수를 탐색하는 조건을 주었다.

만약 10 이상의 수가 발견되면 화면에 표시하고 배열 탐색은 중단된다.

결과 화면을 보자.

제대로 동작된 것을 확인할 수 있다.

반응형

댓글