본문 바로가기
programming/javascript

자바스크립트 indexOf 메서드 사용 배열의 요소 값 찾기

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

자바스크립트의 indexOf 메서드는 배열의 검색된 값의 인덱스 위치를 알 수 있도록 해 준다. 단순히 값이 있고 없고를 떠나 인덱스 위치를 찾을 수 있다. 검색된 값이 있다면 인덱스 위치를 리턴하여 보여주고 검색된 값이 없다면 -1 을 리턴하여 보여준다.

자바스크립트 indexOf 메서드 사용
배열의 요소 값 찾기

indexOf 메서드를 사용하면 자바스크립트 배열의 요소를 찾을 수 있다.

배열에 검색된 요소 값 있다면 해당 요소 값의 위치 인덱스 번호를 반환한다.

의외로 많이 사용되는 메서드로써 알고 있으면 요긴하다.

검색된 값이 없다면 -1 을 리턴한다.

indexOf 검색된 값의 위치 찾기

자바스크립트 배열을 다루는 메서드는 정말 많다.

그 중 탐색에 관한 메서드가 많을 정도 indexOf 는 자바스크립트 배열의 값을 찾을 때 사용된다.

값이 있다면 인덱스 위치 번호를 숫자로 나타낸다.

값이 없다면 인덱스 위치가 아닌 -1 을 나타낸다.

indexOf 의 두번째 인자값은 옵션값으로 탐색을 시작할 시작위치를 지정한다.

Array.indexOf(찾을 값, [시작위치])

샘플코드

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

실제로 배열에 아무거나 값을 넣어보고 indexOf 메서드를 다양하게 사용해 보는 것이 좋다.

indexOf 메서드를 사용하면서 시작위치를 지정한 방법까지 사용해 본다.

<!DOCTYPE html>
<html>
    <body>

        <script>

            console.log('----------');
            
            const vArray = ["현대자동차", "기아자동차", "쌍용자동차", "쉐보레"];
            
            console.log(vArray);
            
            console.log('----------');
            
            let vPosition;
            
            vPosition = vArray.indexOf("기아자동차");
            
            console.log("기아자동차 : ", vPosition);

            vPosition = vArray.indexOf("끼야자동차");

            console.log("끼야자동차 : ", vPosition);

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

            vPosition = vArray.indexOf("기아자동차", 1);

            console.log("기아자동차 : ", vPosition);

            vPosition = vArray.indexOf("기아자동차", 2);

            console.log("기아자동차 : ", vPosition);

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

        </script>

    </body>
</html>

여러를 하나 만들었다.

검색되는 단어는 2종류로 하나는 검색이 되도록 하였고 하나는 검색이 되지 않도록 하였다.

또한 옵션값인 탐색 시작위치를 지정함으로써 결과가 어떻게 나오는지 확인해 본다.

결과 화면을 보자.

자바스크립트 배열에 검색된 값이 있다면 인덱스위치를 보여준다.

하지만 검색된 값이 없다면 -1 을 나타낸다.

시작위치에 따라서도 검색된 위치에 대한 결과는 같다.

반응형

댓글