[JavaScript] 자바스크립트 배열 메서드 | 민민의 하드디스크 - 티스토리

 

자바스크립트 배열 관련 메서드 정리

 

1. splice: 배열의 특정 위치에서 요소를 추가하거나 제거합니다.

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

// 요소 추가
fruits.splice(1, 0, 'grape', 'kiwi');
console.log(fruits);  // ['apple', 'grape', 'kiwi', 'banana', 'orange']

// 요소 제거
fruits.splice(2, 2);
console.log(fruits);  // ['apple', 'grape', 'orange']

 

2. slice: 배열의 특정 부분을 추출하여 새로운 배열을 반환합니다.

const fruits = ['apple', 'banana', 'orange', 'grape', 'kiwi'];

const slicedFruits = fruits.slice(1, 4);
console.log(slicedFruits);  // ['banana', 'orange', 'grape']

728x90

3. concat: 배열과 다른 배열 또는 값들을 결합하여 새로운 배열을 생성합니다.

const fruits = ['apple', 'banana'];
const colors = ['red', 'blue'];

const combinedArray = fruits.concat(colors, 'yellow');
console.log(combinedArray);  // ['apple', 'banana', 'red', 'blue', 'yellow']

 

4. forEach: 배열의 각 요소에 대해 주어진 함수를 실행합니다.

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

fruits.forEach((fruit, index) => {
  console.log(`Fruit at index ${index}: ${fruit}`);
});

 

5. indexOf: 배열에서 특정 요소의 첫 번째 인덱스를 반환하고, 존재하지 않으면 -1을 반환합니다.

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

const bananaIndex = fruits.indexOf('banana');
console.log(bananaIndex);  // 1

 

6. includes: 배열에 특정 요소가 포함되어 있는지 여부를 확인합니다.

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

const includesBanana = fruits.includes('banana');
console.log(includesBanana);  // true

 

7. find, findIndex: 배열에서 주어진 조건을 만족하는 첫 번째 요소 또는 해당 요소의 인덱스를 반환합니다.

const numbers = [1, 2, 3, 4, 5];

const evenNumber = numbers.find(number => number % 2 === 0);
console.log(evenNumber);  // 2

const evenNumberIndex = numbers.findIndex(number => number % 2 === 0);
console.log(evenNumberIndex);  // 1

 

8. filter: 주어진 조건을 만족하는 요소들로 이루어진 새로운 배열을 반환합니다.

const numbers = [1, 2, 3, 4, 5];

const evenNumbers = numbers.filter(number => number % 2 === 0);
console.log(evenNumbers);  // [2, 4]

 

9. reverse: 배열의 요소 순서를 역순으로 변경합니다.

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

fruits.reverse();
console.log(fruits);  // ['orange', 'banana', 'apple']

 

10. map: 배열의 모든 요소에 대해 주어진 함수를 호출하고, 반환된 값으로 이루어진 새로운 배열을 반환합니다.

const numbers = [1, 2, 3, 4, 5];

const doubledNumbers = numbers.map(number => number * 2);
console.log(doubledNumbers);  // [2, 4, 6, 8, 10]

 

11. join: 배열의 모든 요소를 문자열로 결합하여 반환합니다.

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

const joinedString = fruits.join(', ');
console.log(joinedString);  // 'apple, banana, orange'

 

12. reduce: 배열의 각 요소에 대해 주어진 콜백 함수를 실행하여 하나의 결과값을 반환합니다.

const numbers = [1, 2, 3, 4, 5];

const sum = numbers.reduce((accumulator, currentValue) => accumulator + currentValue, 0);
console.log(sum);  // 15

 

이 외에 some, push, sort, shift 등등 많은 메서드가 있기에

상황에 맞게 잘 활용할 수 있다.