상세 컨텐츠

본문 제목

배열 메서드 순회와 탐색

Javascript

by loeybho 2024. 3. 24. 10:24

본문

5가지 요소 순회 및 탐색 메서드  👀

 

1. forEach

모든 요소를 순회하면서, 각각의 요소에 특정 동작을 수행시키는 메서드

새로운 배열을 반환하지 않고, 배열의 각 요소를 순회하면서 콜백함수를 실행하는데 사용

let arr1 = [1, 2, 3];

arr1.forEach((item, index) => {
  // console.log(index, item * 2);
});

let doubledArr = [];
arr1.forEach((item) => {
  doubledArr.push(item * 2);
});
console.log(doubledArr); // [2,4,6]

 

2. includes

배열의 특정 요소가 있는 지 확인하는 메서드

let arr2 = [1, 2, 3];
let isInclude = arr2.includes(3);

console.log(isInclude); // true

true와 false 값을 반환

 

3. indexOf

특정 요소의 인덱스(위치)를 찾아서 반환하는 메서드

let arr3 = [1, 2, 3];
let index = arr3.indexOf(2);
console.log(index); //1

→ indexOf는 기본적으로 얕은 비교로 동작하기 때문에 배열에 있는 객체는 찾을 수 없다. 그럴땐 findIndex를 사용한다.

 

4. findIndex

모든 요소를 순회하면서, 콜백함수를 만족하는 메서드

특정 요소의 인덱스(위치)를 반환하는 메서드

let arr4 = [1, 2, 3];
const findedIndex = arr4.findIndex((item) =>
item % 2 !== 0); // 0

console.log(findedIndex);

 

5. find

모든 요소를 순회하면서 콜백함수를 만족하는 요소를 찾는데, 요소를 그대로 반환

let arr5 = [{ name: "이정환" }, { name: "홍길동" }];

const finded = arr5.find((item) =>
item.name === "이정환");

console.log(finded);

'Javascript' 카테고리의 다른 글

DOM  (0) 2024.05.07
배열 메서드 변형  (0) 2024.03.24
배열 메서드 요소 조작  (0) 2024.03.24
async/await  (0) 2024.02.20
콜백 지옥(callback)  (0) 2024.02.20

관련글 더보기