자바스크립트에서 배열에 요소를 추가하는 방법

추가 - push() / unshift() / splice() / 배열이름[n]

push()

문법 : arr.push(element1[, ...[, elementN]])

const array = ['A', 'B', 'C']

const add = array.push('D');
console.log(array) // ["A","B","C","D"]

//여러개 추가할 경우
const array = ['A', 'B', 'C']

const add = array.push('D', 'E', 'F');
console.log(array) // ["A","B","C","D","E","F"]

unshift()

문법 : arr.unshift([...elementN]);

const array = ['A', 'B', 'C']

const add = array.unshift('D');
console.log(array) // ["D","A","B","C"]

splice()

문법 : array.splice(start[, deleteCount[, item1[, item2[, ...]]]]) (Optional는 deleteCount, items1, item2)

start : 배열의 변경을 시작할 인덱스

deleteCount : 0 이하라면 어떤 요소도 제거하지 않는다. ( 추가하고 싶을 때 0 기입 )

그래서 제거하지 않고 원하는 위치에 요소를 추가 할 수 있다.

const array = ['A', 'B', 'C']

const add = array.splice(2, 0, 'D');
console.log(array) 
// ["A","B","D","C"] index 2 ('C')위치에 'D' 추가 ["A","B","D","C"]

배열이름[n]

const array = ['A', 'B', 'C', 'D', 'E']

array[6] = 'H'
console.log(array)
// ["A","B","C","D","E", undefined,"H"]

삭제 - pop() / 배열이름.length -1 / shift() / splice() / delete

pop()

문법 : arr.pop();

const array = ['A', 'B', 'C']

const out = array.pop();
console.log(array) // ["A","B"]

배열이름.length -1

const array = ['A', 'B', 'C', 'D', 'E']

array.length = array.length -1;
console.log(array)
// ["A","B","C","D"]

shift()

문법 : arr.shift();

const array = ['A', 'B', 'C']

const out = array.shift();
console.log(array) // ["B","C"]

splice()

const array = ['A', 'B', 'C', 'D', 'E']

const out = array.splice(2, 1); 
// ["A","B","D","E"] index 2 부터 1개의 요소('C')를 제거

const out = array.splice(2, 2); 
// ["A","B","E"] index 2 부터 2개의 요소('C', 'D')를 제거

delete

const array = ['A', 'B', 'C', 'D', 'E']

delete array[1];
console.log(array)
// ["A",undefined,"C","D","E"]

참고