본문 바로가기
코-딩/Javascript

Array.prototype.splice()

by ㅋㅂㅋ 2022. 1. 12.

splice() 함수를 이용하면 배열의 특정 위치 값을 제거할 수 있고 추가도 할 수 있다.

* splice( 첫번째인자, 두번째인자, 세번째인자 )의 첫번째 인자는 시작 위치(index. 0부터 시작한다.), 두번째 인자는 갯수,

  세번째 인자는 추가할 요소를 의미하며 세번째 인자는 생략이 가능하다.

 

= ex ] ========================================================================

 

let first = ['I', ' ', 'M', 'Y', 'M', 'E', 'M', 'I', 'N', 'E'];

 

first.splice(1, 2);

 

console.log(first);

 

결과 : ["I", "Y", "M", "E", "M", "I", "N", "E"]

 

============================================================================

 

splice를 통하여 인자를 넣어줄 때, 시작점은 배열이 완성 된 후의 위치라고 생각하면 된다.

* ["How", "you", "?"]에 "are"을 "How" 다음에 넣어서 완성하면 ["How", "are", "you", "?"] 이므로 index는 1이다.

* splice 함수의 세번째 인자부터는 추가되는 내용이다. 한번에 여러개를 추가할 수 있다.

 

= ex ] ========================================================================

 

let second = ["How", "you", "?"];

 

second.splice(1, 0, "are");

 

console.log(second);

 

결과 : ["How", "are", "you", "?"]

 

 

let second = ["How", "you", "?"];

second.splice(3, 0, "1", "2", "3", "4");

console.log(second);

 

결과 : ["How", "are", "you", "?"]

 

============================================================================

 

splice함수가 반환하는 값은, splice를 이용해서 제거된 값이다.

 

= ex ] ========================================================================

let second = ["How", "you", "?"];

 

let res = second.splice(1, 1);

 

console.log(res);

 

결과 : ["you"]

============================================================================

 

출처 && 테스트 :

 

Array.prototype.splice() - JavaScript | MDN

splice() 메서드는 배열의 기존 요소를 삭제 또는 교체하거나 새 요소를 추가하여 배열의 내용을 변경합니다.

developer.mozilla.org

 

+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

findIndex()

 

배열의 특정 요소(?)의 값을 찾고 싶을 때 사용

 

ex) let sample = [

    {

        time : 'morning',

        food: 'sandwitch'

    },

    {

        time: 'lunch',

        food: 'hamburger'    

    },

    {

        time: 'dinner',

        food: 'toast'    

    }

]

 

food가 hamburger인 것을 골라내고 싶다면?

 

let index = sample.findIndex( ind => ind.food === 'hamburger' );

index에 1이 들어갈 것이다.

 

++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

'코-딩 > Javascript' 카테고리의 다른 글

Javascript - blob & UTF-8  (0) 2022.04.14
JavaScript - image src  (0) 2022.03.31
Javascript - DOMParser, fetch  (0) 2022.03.29
getElementsByTagName() / querySelectorAll()  (0) 2022.01.19
Array.prototype.find()  (0) 2022.01.12