자바스크립트 splice() 특정 인덱스 부터 인덱스까지 값 추가 삭제 변경 Java script

splice()

- 특정 시작 인덱스부터 인덱스까지 값을 추가하거나 그 자리에 있는 값을 삭제할 수 있는 메서드

 

- 배열. splice(시작 인덱스, 삭제할 요소의 개수, 추가될 요소들)

 

• 첫번째 인자인 시작인데스는 배열 요소가 변경될 시작 지점입니다. splice는 특정 위치의 요소를 지정하는 것이 필수라 반드시 첫 번째 인자 값은 배열 길이보다 작아야 유효합니다
• 두 번째 인자인 삭제할 요소의 개수는 시작 인덱스의 위치부터 삭제하고자 하는 개수만큼 요소를 제거합니다. 이때 해당 요소가 제거됨과 동시에 메서드 호출 결과로 값을 반환합니다
• 세 번째 인자에 추가될 요소들을 지정하면, 시작 인덱스부터 해당 요소들이 추가됩니다.

 

const fruits = ['melon', 'lemon', 'source', 'apple', 'juice']

fruits.splice(4, 1) // ['melon', 'lemon', 'source', 'apple']

fruits.splice(4, 0, 'grape') // ['melon', 'lemon', 'source', 'apple', 'grape']

fruits.splice(2, 1, 'mandarin', 'strawberry', 'watermelon') 
	// ['melon', 'lemon', 'mandarin', 'strawberry', 'watermelon', 'apple', 'grape']

//결과
// ['melon', 'lemon', 'mandarin', 'strawberry', 'watermelon', 'apple', 'grape']

 

- splice(4, 1)를 실행하면 과일이 아닌 juice 문자열이 추출됩니다.

- splice(4, 0, 'grape')는 삭제할 개수를 지정하지 않아 추출되는 요소가 없습니다. 그러나 세번재인자로 인해 시작 인덱스에 grape 문자열이 추가됩니다.

 

 

배열. indexOf("A")의 활용

- indexOf()는 배열에 해당하는 문자를 찾아서 인덱스 값을 반환한다

- splice와 응용하여 시작인덱스 값을 구할 수 있다

var arr = ["A", "C", "D", "A", "E", "F", "A"];

var arr_splice = arr.splice(1, 3) // 1번부터 3개의 요소 ["C", "D", "A"] 꺼낸다

console.log(arr); // ["A", "E", "F", "A"] console.log(arr_splice) - ["C","D","A"]

arr.splice(arr.indexOf("A"), 1, "a"); // "A"를 찾아서 "a"로 변경한다.