배열 요소를 추가하고 삭제하는 메소드

.push () mutable

베열의 젤 끝에 () 에 넣은 요소를 추가 할 수 있으며, 추가된 배열의 길이의 값을 리턴한다. (원본배열 수정)

// myNumber이라는 배열 끝에 96이라는 값을 추가하려면?
let myNumber = [73, 98, 86, 61];  

console.iog(myNumber.push(96)) // 5 
console.log(mynumber) // [73, 98, 86, 61,96]

.pop() mutable

배열의 맨 끝에 요소를 삭제 할 수 있으며, 값은 제거된 요소를 반환한다. (원본배열 수정)

// myNumber이라는 배열의 마지막 요소를 삭제한다면?
let myNumber = [73, 98, 86, 61, 96];  

console.iog(myNumber.pop()) // 96 // 삭제된 리턴값
console.log(mynumber) // [73, 98, 86, 61]

.unshift() mutable

베열의 맨앞에 ()넣은 요소를 추가 할 수 있으며, 추가된 배열의 길이 값을 반환한다. (원본배열 수정)

// arr이라는 배열 끝에 22이라는 값을 추가하려면?
let arr = ['code', 'states'];  

console.iog(arr.unshift('pull')) // 3 
console.log(arr) // [pull', 'code', 'states']

.shift () mutable

배열의 맨 앞의 요소를 삭제 할 수 있으며, 값은 제거된 요소를 반환한다. (원본배열 수정)

// arr이라는 배열 끝에 22이라는 값을 추가하려면?
let arr = ['pull', 'code', 'states'];  

console.iog(arr.shift('pull')) // 'pull'
console.log(arr) // ['code', 'states']

splice() mutable

array.splice (start, 삭제할 요소 수 , 삽입할 요소 item1 , item2, itemN.... )

기존요소를 제거하거나 새 요소를 추가하는 메소드이다. 제거된 요소를 반환하며, 요소가 제거되지 않으면 빈 배열이 반환된다. (원본배열이 수정된다.)

• (필수요소) start: 배열의 변경을 시작하는 인덱스, start만 사용시 start 인덱스를 포함한 이후의 모든요소 제거한다.
• (선택요소) deleteCount: 배열에서 제거를 할 요소의 수를 정한다.
• (선택요소)i temN: 배열에 삽입될 요소를 설정한다.
• 삭제된 요소의 배열을 반환한다.

//start 만! 사용한다면?  2번째 인덱스를 포함한 이후의 모든요소 제거 

const color = ['pink', 'yellow', 'blue', 'brown']
const removed = color.splice(2)
console.log(removed) // ["blue", "brown"] // 제거된 요소 리턴
console.log(color) // ["pink", "yellow"]

// start,deleteCount 만 사용 : 3번째 인덱스에서 요소 1개 제거 

const color = ['pink', 'yellow', 'blue', 'brown']
const removed = color.splice(3, 1) 

console.log(removed) // ['brown'] // 제거된 요소 리턴
console.log(color) // ['pink', 'yellow', 'blue']

// start, deleteCount , item1 옵션을 사용한다.
// 0번째 인덱스에서 요소 2개 제거하고 그 자리에 'black' 를 삽입한다.

const color = ['pink', 'yellow', 'blue', 'brown']
const removed = color.splice(0, 2, 'black')

console.log(removed) // ["pink", "yellow"] // 제거된 요소
console.log(color) // ['black', "blue", "brown"]

// start, deleteCount , item1 사용, 요소를 제거하지 않는다면?
// 2번째 인덱스에 drum 를 삽입한다. 이때 인덱스 앞쪽으로 추가한다.

const color = ['pink', 'yellow', 'blue', 'brown']
const removed = color.splice(2, 0, 'drum')

console.log(removed) // [] 빈 배열이 리턴된다! 제거된 요소가 없기 떄문에.
console.log(color) // ['pink', 'yellow', drum, 'blue', 'brown']