[JavaScript] splice, slice, split

간단하게 자바스크립트에서 많이 사용하는 

splice, slice, split 에 대하여 알아보겠습니다.

 

splice

- 기존 배열을 변형하고 새로운 배열을 반환합니다.

- splice(start, deleteCount, items...)

- 배열의 start 부터 deleteCount 만큼 요소를 제거한 다음 그 자리에 items 를 삽입한다.

const array = [1, 2, 3, 4, 5, 6];
array.splice(0, 4); // [1, 2, 3, 4]
array //[5, 6]

const array = [1, 2, 3, 4, 5, 6];
array.splice(4, 1) // [5]
array // [1, 2, 3, 4, 6]

const array = [1, 2, 3, 4, 5, 6];
array.splice(2, 4, 'a', 'b') // [3, 4, 5, 6]
array //[1, 2, "a", "b"]

 

slice

- 기존 배열을 변형하지 않고 기존 요소를 참조하는 새로운 배열을 만들어 리턴합니다.

- slice (begin, end)

- 배열 begin 부터 end 까지 잘라낸다 

const array = [1, 2, 3, 4, 5, 6];
array.slice(0, 4) // [1, 2, 3, 4]
array // [1, 2, 3, 4, 5, 6]

const array = [1, 2, 3, 4, 5, 6];
array.slice(4, 5) // [5]
array // [1, 2, 3, 4, 5, 6]

 

마지막으로 split 은 배열이 아닌 문자열에 사용됩니다.

 

split

- 문자열을 delimeter 기준으로 잘라서 배열로 만든 후 배열을 리턴합니다.

- split(delimeter)

const a = '1, 2, 3, 4, 5'
a.split(','); // ["1", " 2", " 3", " 4", " 5"]

delimeter 를 regex 로도 사용할 수 있습니다.

const a = '1, 2, 3, 4, 5'
a.split(/\,/g); // ["1", " 2", " 3", " 4", " 5"]

 

소괄호를 사용하면 delimeter 를 포함하여 split 할 수 있습니다.

const a = '1, 2, 3, 4, 5'
a.split(/(\,)/g) // ["1", ",", " 2", ",", " 3", ",", " 4", ",", " 5"]