[JS 빌트인 메서드] Array.prototype.indexOf() - 배열 요소 검색하기

자바스크립트는 많은 유용한 빌트인 메서드들을 제공한다.
MDN 사이트에 들어가서 검색하면 어렵지 않게 메서드에 대한 정보를 찾을 수 있지만,
자주 쓰는 메서드들은 되도록이면 외우는게 좋다.

 

Array.prototype.indexOf 메서드는 Array.prototype의 메서드로,
배열 객체가 상속받아 자신의 메서드처럼 사용할 수 있다.
(참고로 프로토타입은 자바스크립트에서 중요한 개념이므로 다음 포스팅에서 따로 다룰 예정이다...)

 

Description

원본 배열에서 인수로 전달된 요소를 검색하여 첫번째 인덱스 반환, 없으면 -1 반환

const array = [2, 2, 9, 9];
array.indexOf(2); // 0
array.indexOf(7); // -1

 

Parameters

indexOf(searchElement) // 요소
indexOf(searchElement, fromIndex) // 요소, 검색을 시작할 인덱스

 

Return value

• searchElement 의 인덱스
• 여러 개일 경우 첫번째 인덱스
• 존재 안할 경우 -1

 

Examples

1. 특정 요소의 개수 확인하기

const indices = \[\];  
const array = \["a", "b", "a", "c", "a", "d"\];  
const element = "a";  
let idx = array.indexOf(element);  

while (idx !== -1) {  
  indices.push(idx);  
  idx = array.indexOf(element, idx + 1);  
}  

console.log(indices); // \[0, 2, 4\]  
console.log(indices.length) // 3  

 

2. 요소가 있는지 확인하고, 없을 경우 요소 업데이트하기

function updateVegetablesCollection(veggies, veggie) {  
  if (veggies.indexOf(veggie) === -1) {  
    veggies.push(veggie);  
    console.log(\`New veggies collection is: ${veggies}\`);  
  } else {  
    console.log(\`${veggie} already exists in the veggies collection.\`);  
  }  
}  

const veggies = \["potato", "tomato", "chillies", "green-pepper"\];  

updateVegetablesCollection(veggies, "spinach");  
// New veggies collection is: potato,tomato,chillies,green-pepper,spinach  
updateVegetablesCollection(veggies, "spinach");  
// spinach already exists in the veggies collection.  

 

Also see

• Array.prototype.include()

// 아래 코드는   
if (veggies.indexOf(veggie) === -1)   

// Array.prototype.include 메서드를 사용하여  
// 아래와 같이 쓸 수 있다.  
if (!veggies.includes(veggie))  

 

 

 

 

자세한 내용은 아래 링크에서 확인할 수 있다.

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/indexOf

Array.prototype.indexOf() - JavaScript | MDN