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 |