개발/자바스크립트

JavaScript 배열(Array) 메서드 정리

피터JK 2025. 1. 20. 11:29
728x90
let arr = [1, 2, 3];

// length
console.log(arr.length); // 3

// push
arr.push(4);
console.log(arr); // [1, 2, 3, 4]

// unshift
arr.unshift(0);
console.log(arr); // [0, 1, 2, 3, 4]

// pop
arr.pop();
console.log(arr); // [0, 1, 2, 3]

// shift
arr.shift();
console.log(arr); // [1, 2, 3]

// at
console.log(arr.at(2)); // 2

// indexOf
console.log(arr.indexOf(3)); // 2

// includes
console.log(arr.includes(3)); // true

// map
let mappedArr = arr.map(num => Math.pow(num, 2));
console.log(mappedArr); // [1, 4, 9]

// filter
let filteredArr = arr.filter(num => num % 2);
console.log(filteredArr); // [1, 3]

// every
console.log(arr.every(num => num > 1)); // false

// some
console.log(arr.some(num => num === 3)); // true

// fill
arr.fill(10);
console.log(arr); // [10, 10, 10]

// reduce
let sum = arr.reduce((acc, num) => acc + num, 0);
console.log(sum); // 30

// concat
let newArr = arr.concat([4, 5]);
console.log(newArr); // [10, 10, 10, 4, 5]

// reverse
arr.reverse();
console.log(arr); // [10, 10, 10]

// sort
let sortedArr = [3, 1, 2];
sortedArr.sort();
console.log(sortedArr); // [1, 2, 3]

// join
console.log(arr.join('-')); // 10-10-10

// flat
let nestedArr = [1, [2, 3], 4];
console.log(nestedArr.flat()); // [1, 2, 3, 4]

// find
console.log(arr.find(num => num === 10)); // 10

// findIndex
console.log(arr.findIndex(num => num === 10)); // 0

// toString
console.log(arr.toString()); // 10,10,10

// slice
let slicedArr = arr.slice(1, 3);
console.log(slicedArr); // [10, 10]

// splice
let splicedArr = [1, 2, 3, 4];
splicedArr.splice(2, 1, 5);
console.log(splicedArr); // [1, 2, 5, 4]

// Array.isArray
console.log(Array.isArray(arr)); // true

// Array.from
console.log(Array.from("123")); // ['1', '2', '3']

JavaScript 배열 메서드들에 대한 설명

  1. length – 배열의 길이를 반환: 3
  2. push(4) – 배열의 끝에 요소를 추가: [1, 2, 3, 4]
  3. unshift(0) – 배열의 시작에 요소를 추가: [0, 1, 2, 3]
  4. pop() – 배열의 마지막 요소를 제거: [1, 2]
  5. shift() – 배열의 첫 번째 요소를 제거: [2, 3]
  6. at(2) – 인덱스 2에 있는 요소를 반환: 2
  7. indexOf(3) – 값 3이 배열에서 처음 나오는 인덱스를 반환: 2
  8. includes(3) – 값 3이 배열에 포함되어 있는지 여부를 확인: true
  9. map() – 배열의 각 요소에 함수 적용: [1, 4, 9] (각각의 요소를 제곱)
  10. filter() – 조건에 맞는 요소만 필터링: [1, 3] (홀수만)
  11. every() – 모든 요소가 조건을 만족하는지 확인: false
  12. some() – 일부 요소가 조건을 만족하는지 확인: true
  13. fill() – 배열의 모든 요소를 특정 값으로 채우기: [10, 10, 10]
  14. reduce() – 배열을 하나의 값으로 축소 (합산): 6
  15. concat() – 배열을 결합: [1, 2, 3, 4, 5]
  16. reverse() – 배열의 순서를 뒤집기: [3, 2, 1]
  17. sort() – 배열을 정렬: [1, 2, 3]
  18. join() – 배열의 요소들을 문자열로 결합: '1-2-3'
  19. flat() – 중첩된 배열을 평탄화: [1, 2, 3]
  20. find() – 조건을 만족하는 첫 번째 요소 찾기: 2
  21. findIndex() – 조건을 만족하는 첫 번째 요소의 인덱스 찾기: 1
  22. toString() – 배열을 문자열로 변환: '1,2,3'
  23. slice() – 배열의 일부를 반환 (인덱스 1부터 3까지): [2, 3]
  24. splice() – 배열의 요소를 추가/삭제하여 수정: [1, 2, 3, 4]
  25. Array.isArray() – 값이 배열인지 확인: false
  26. Array.from() – 문자열을 배열로 변환: ['1', '2', '3']
728x90