본문 바로가기

js

indexOf, lastIndexOf, includes 배열이나 문자열에서 특정 값 찾기

🔎 indexOf() 개념

✅ 배열 버전

array.indexOf(searchElement[, fromIndex])

 

  • searchElement: 찾고 싶은 값
  • fromIndex (선택): 검색을 시작할 위치 (기본은 0)
  • 결과값: 찾은 값의 인덱스(위치) 반환
    못 찾으면 -1 반환

 

✅ 문자열 버전

 

string.indexOf(searchValue[, fromIndex])

 

 

📦 배열 예시

 

const fruits = ['apple', 'banana', 'cherry'];

console.log(fruits.indexOf('banana')); // 1
console.log(fruits.indexOf('grape'));  // -1

 

📦 문자열 예시

 

const message = "hello world";

console.log(message.indexOf('o'));    // 4 (첫 번째 'o' 위치)
console.log(message.indexOf('world')); // 6
console.log(message.indexOf('z'));     // -1

 

🔁 응용: 포함 여부 확인

const colors = ['red', 'blue', 'green'];

if (colors.indexOf('blue') !== -1) {
  console.log('blue가 있어요!');
}
 
요즘은 좀 더 직관적인 includes()도 많이 써:
colors.includes('blue'); // true
 

📌 주의사항

  • 처음 발견된 위치만 반환해.
  • 대소문자 구분해.

'Hello'.indexOf('h'); // -1 (대소문자 다름)

 

🔁 lastIndexOf() — 뒤에서부터 찾기

📌 개념:

indexOf()는 앞에서부터 찾지만,
lastIndexOf()는 뒤에서부터 특정 값을 찾아서 가장 마지막 위치를 알려줘.

📌 문법:

array.lastIndexOf(searchElement[, fromIndex])
string.lastIndexOf(searchValue[, fromIndex])

 

  • fromIndex는 어디부터 거꾸로 찾을지 지정 가능 (생략하면 끝에서부터)
  • 결과값은 마지막으로 일치하는 인덱스 (없으면 -1)

 

✅ 배열 예시:

 

const nums = [1, 2, 3, 2, 1];

console.log(nums.indexOf(2));       // 1
console.log(nums.lastIndexOf(2));   // 3
 
✅ 문자열 예시:
 
const msg = "hello hello";

console.log(msg.indexOf("lo"));        // 3
console.log(msg.lastIndexOf("lo"));    // 9
 
 

✅ includes() — 포함 여부 확인 (true/false)

📌 개념:

값이 있는지 없는지 간단하게 true/false로 확인할 수 있어.
indexOf()를 쓸 때 !== -1 비교 안 해도 돼서 간결해!

📌 문법:

array.includes(valueToFind[, fromIndex])
string.includes(searchString[, position])

 

✅ 배열 예시:

 

const animals = ['cat', 'dog', 'bird'];

console.log(animals.includes('dog'));   // true
console.log(animals.includes('tiger')); // false

 

✅ 문자열 예시:

 

const sentence = "I love JavaScript";

console.log(sentence.includes("love"));    // true
console.log(sentence.includes("python"));  // false

 

✅ 차이 정리 요약

함수                                     반환값                                               찾는 방향                      용도

 

indexOf() 위치 (숫자) 또는 -1 앞에서부터 첫 번째 위치 찾기
lastIndexOf() 위치 (숫자) 또는 -1 뒤에서부터 마지막 위치 찾기
includes() true 또는 false 앞에서부터 포함 여부만 확인