JS/Javascript

[javascript] 배열 5 / 배열 탐색, 조건 검색, 검증 (indexOf(), lastIndexOf(), includes(), find(), findIndex(), every(), some()..)

ui-o 2025. 9. 11. 17:47
반응형

배열 탐색

1. indexOf()

  • 배열에서 특정 값이 나타나는 위치(인덱스)를 반환
  • 값이 존재하지 않으면 -1을 반환
  • 배열 에서부터 검색
  • 첫 번째로 등장하는 요소만 반환
  • 문자열에도 사용 가능 (문자열 내 위치(인덱스) 반환)
// [문법]
배열 또는 문자열.indexOf(찾고 싶은 값, 검색을 시작할 인덱스(기본값은 0))
// ex) 배열 검색
const fruits = ['apple', 'banana', 'cherry', 'apple'];

fruits.indexOf('apple'); // 0
fruits.indexOf('apple', 1); // 3
fruits.indexOf('mango'); // -1

// ex) 문자열 검색
const 문자열 = 'hello world';
문자열.indexOf('o');   // 4
문자열.indexOf('o', 5); // 7

2. lastIndexOf()

  • 배열에서 특정 값이 마지막으로 나타나는 위치(인덱스)를 반환
  • 값이 존재하지 않으면 -1을 반환
  • 배열 에서부터 검색
  • 첫 번째로 등장하는 요소만 반환
  • 문자열에도 사용 가능 (문자열 내 위치(인덱스) 반환)
// [문법]
배열 또는 문자열.lastIndexOf(찾고 싶은 값, 검색을 시작할 인덱스(기본값은 0))
// ex) 배열 검색
const fruits = ['apple', 'banana', 'cherry', 'apple'];

fruits.lastIndexOf('apple'); // 3
fruits.lastIndexOf('apple', 2); // 0
fruits.lastIndexOf('mango'); // -1

// ex) 문자열 검색
const 문자열 = 'hello world';
문자열.lastIndexOf('l'); // 9

3. includes()

  • 배열에 특정 값이 존재하는지 여부true 또는 false로 반환
  • 값이 있는지만 확인
  • 인덱스 정보는 반환하지 않음
  • NaN도 정상적으로 체크 가능 (단 indexOf는 NaN 체크 불가)
  • ES7(ES2016)부터 배열문자열 모두 지원
// [문법]
배열 또는 문자열.includes(찾고 싶은 값, 검색 시작 위치(기본값 0))
// ex) 배열
const 과일 = ['사과', '바나나', '체리'];

과일.includes('바나나');     // true
과일.includes('망고');       // false
과일.includes('사과', 1);    // false (1번 인덱스 이후로만 검색)

// ex) 문자열
const 문자열 = 'hello world';
문자열.includes('world'); // true

배열 조건 검색

  • 배열 조건을 만족하는 첫번째를 반환하는 메서드

1. find()

  • 배열에서 주어진 조건을 만족하는 "첫 번째 요소"를 반환
  • 조건을 만족하는 요소가 없으면 undefined를 반환
  • 함수는 조건이 true일 때 요소를 반환

기본 문법

// [문법]
배열.find(함수(요소, 인덱스, 배열) { ... })

 

구분 설명
요소 배열의 현재 요소, 조건 비교 시 사용
인덱스 배열에서 현재 요소의 위치 (선택 사항)
배열 원본 배열 전체에 접근 가능 (선택 사항)
반환값 조건을 만족하는 첫 번째 요소 반환, 없으면 undefined
const num = [1, 3, 7, 10, 15];

const result = num.find((val) => val > 5);
console.log(result); // 7 함수는 조건이 true일 때 요소를 반환

2. findIndex()

  • 배열에서 주어진 조건을 만족하는 “첫 번째 요소의 인덱스를 반환
  • 조건을 만족하는 요소가 없으면 -1을 반환

기본 문법

// [문법]
배열.findIndex(함수(요소, 인덱스, 배열) { ... })

 

구분 설명
요소 배열의 현재 요소, 조건 비교 시 사용
인덱스 배열에서 현재 요소의 위치 (선택 사항)
배열 원본 배열 전체에 접근 가능 (선택 사항)
반환값 조건을 만족하는 첫 번째 요소의 인덱스 반환, 없으면 -1

배열 검증

  • 모든/일부 요소 조건 만족 여부

1. every()

  • 배열의 모든 요소가 주어진 조건을 만족하는지 검사할 때 사용
  • 조건을 만족하면 true, 하나라도 만족하지 않으면 false 반환

기본 문법

// [문법]
배열. every(콜백함수(요소, 인덱스, 배열) [, thisArg])
매개변수 타입 설명 선택 여부
콜백함수(요소 (element)) any 현재 검사 중인 배열 요소 필수
콜백함수(인덱스 (index)) number 현재 요소의 인덱스 선택
콜백함수(배열 (array)) array 호출한 배열 자체 선택
thisArg any 콜백 내부에서 this로 사용할 값 선택

동작 방식

  1. 배열의 첫 번째 요소부터 콜백 함수 실행
  2. 콜백 함수가 true / false 반환
  3. 모든 요소가 true → every()는 true 반환
  4. 하나라도 false → 즉시 false 반환
const scores = [90, 85, 70, 100];

// 모든 점수가 60 이상인지 확인
const allPassed = scores.every(score => score >= 60);
console.log(allPassed); // true

// 모든 점수가 80 이상인지 확인
const allAbove80 = scores.every(score => score >= 80);
console.log(allAbove80); // false

2. some()

  • 배열의 일부 요소라도 주어진 조건을 만족하는지 검사할 때 사용
  • 조건을 만족하면 true, 하나도 만족하지 않으면 false 반환

기본 문법

// [문법]
배열. some(콜백함수(요소, 인덱스, 배열) [, thisArg])
매개변수 타입 설명 선택 여부
콜백함수(요소 (element)) any 현재 검사 중인 배열 요소 필수
콜백함수(인덱스 (index)) number 현재 요소의 인덱스 선택
콜백함수(배열 (array)) array 호출한 배열 자체 선택
thisArg any 콜백 내부에서 this로 사용할 값 선택

동작 방식

  1. 배열의 첫 번째 요소부터 콜백 함수 실행
  2. 콜백 함수가 true / false 반환
  3. 하나라도 true → 즉시 true 반환
  4. 모두 false → false 반환

 

const scores = [90, 85, 70, 50];

// 한 명이라도 60 미만이면 true
const hasFailed = scores.some(score => score < 60);
console.log(hasFailed); // true

// 한 명이라도 100점이면 true
const hasPerfect = scores.some(score => score === 100);
console.log(hasPerfect); // true
반응형