Javascript : 배열 메서드 (요소 조작)

kimsnmyng·2024년 12월 8일

Vanilla Javascript

목록 보기
16/23
// 배열 메서드 : 요소 조작

// 6가지의 요소 조작 메서드

// 1. push
// 배열의 맨 뒤에 새로운 요소를 추가하는 메서드

let arr1 = [1, 2, 3];
const newLength = arr1.push(4, 5, 6, 7, 8);

console.log(arr1) // 1, 2, 3, 4, 5, 6, 7, 8
console.log(newLength) // 8

// 2. pop
// 배열의 맨 뒤에 있는 요소를 제거하고, 반환
let arr2 = [1, 2, 3];
const popppedItem = arr2.pop();

console.log(popppedItem); // 3
console.log(arr2); // [1, 2]

// 3. shift
// 배열의 맨 앞에 있는 요소를 제거, 반환
let arr3 = [1, 2, 3];
const shiftedItem = arr3.shift();
console.log(shiftedItem, arr3) // 1, [2,3]

// 4. unshift
// 배열의 맨 앞에 있는 요소를 추가
let arr4 = [1, 2, 3];
const newLength2 = arr4.unshift(0);
console.log(arr4); // [0, 1, 2, 3]
console.log(newLength2) // 4

// shift와 unshift는 push와 pop보다 느리게 동작한다.
// 인덱스의 위치를 조정해줘야 하기 때문에 비효율적임.
// 되도록이면 push pop을 사용할 것

// 5. slice
// 가위처럼 배열의 특정 배열을 잘라내서 새로운 배열로 반환함.

let arr5 = [1, 2, 3, 4, 5];
const sliced = arr5.slice(2, 5); // 5를 하면 -1을 해서 4까지 잘라낸다. 마지막 지점은 꼭 +1을 해주어야한다.
const sliced2 = arr5.slice(2); // 이래도 끝까지 다 자른다.
const sliced3 = arr5.slice(-1); // 음수는 뒤에서부터 자른다.
console.log(sliced); // [3, 4, 5], 원본 배열은 유지된다. 수정되지 않는다.

// 6. concat
// 두 개의 서로 다른 배열을 이어 붙여서 새로운 배열을 반환

let arr6 = [1, 2];
let arr7 = [3, 4];

let concatedArr = arr6.concat(arr7);
console.log(concatedArr); // [1, 2, 3, 4]
profile
안녕하세요 김선명입니다.

0개의 댓글