프론트엔드 센트럴파크 (☞゚ヮ゚)☞

배열조작 - push, pop, splice, slice, concat, for 본문

Javascript

배열조작 - push, pop, splice, slice, concat, for

자라나라나무나무나 2022. 5. 23. 03:05

push()

: 배열 맨 뒤로 추가

let fruits = ["apple", "orange", "melon"];

fruits.push("watermelon");
console.log(fruits);
console.log(fruits.length);

let fruits = ["apple", "orange", "melon"];
let ret;

ret = fruits.push("watermelon");
console.log(fruits);
console.log(fruits.length);
console.log(ret);

push를 함과 동시에  ret의 length 값을 리턴해준다.

 


pop()

: 배열의 맨 뒷부분 삭제

let fruits = ["apple", "orange", "melon"];
let ret;

ret = fruits.push("watermelon");

fruits.pop();
console.log(fruits);
console.log(fruits.length);

let fruits = ["apple", "orange", "melon"];
let ret;

ret = fruits.push("watermelon");

ret = fruits.pop();
console.log(fruits);
console.log(fruits.length);
console.log(ret);

pop을 통해 삭제된 데이터 뿐만 아니라 삭제된 데이터도 반환이 된다.

 


splice()

: 매개변수로 받은 index 이후로의 값이 삭제

let fruits = ["apple", "orange", "melon"];
let ret;

ret = fruits.splice(1);
console.log(ret);
console.log(fruits);

splice 함수가 호출되고 나서 fruits에 업데이트를 해주고 그거에 대한 리턴값을 반환
 

* 특정한 한개만 삭제하고 싶을 때

fruits = ["apple", "orange", "melon", "strawberry"];
ret = fruits.splice(1, 1);
console.log(ret);
console.log(fruits);

ret = fruits.splice(1, 1) 에서 뒤쪽 1은 delete count로 몇 개를 삭제할 것이냐의 뜻

 

* 삭제와 동시에 추가하고 싶을 때 

fruits = ["apple", "orange", "melon", "strawberry"];
ret = fruits.splice(1, 1);
console.log(ret);
console.log(fruits); // [ 'apple', 'melon', 'strawberry' ]

ret = fruits.splice(1, 1, "mango", "kiwi");
console.log(ret);
console.log(fruits);

 

참고

https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Array/splice


slice()

: splice와 같이 데이터를 삭제 하지만 실제배열의 데이터는 바뀌지 않음

 

let fruits = ["apple", "orange", "melon"];

console.log(fruits.slice(1));
console.log(fruits);

* 특정한 부분만 자르고 싶을 때

let fruits = ["apple", "orange", "melon"];

console.log(fruits.slice(1));
console.log(fruits);

console.log(fruits.slice(1, 2));
console.log(fruits.slice(-2));

음수도 사용가능하다. 

음수는 뒤에서 부터 -1은 melon, -2는 orange이다.

 


contact()

: 또 다른 배열 추가 하지만 실제배열의 데이터는 바뀌지 않음

 

let fruits = ["apple", "orange", "melon"];
let fruits_add = ["cherry", "dragonfruit"];

console.log(fruits.concat(fruits_add));
console.log(fruits);

concat 으로 추가된 데이터를 다른 변수에 넣어 저장한 후 사용가능

 


배열 반복문

 

let fruits = ["apple", "orange", "melon"];

for(i=0; i < fruits.length; i++) {
    console.log(fruits[i]);
}

for(let fruit of fruits){
    console.log(fruit);
} // fruit에 fruits의 데이터가 하나하나 들어가게됨

for(let key in fruits) {
    console.log(key);
    console.log(fruits[key]);
} // for문은 key값을 반환하기 때문

'Javascript' 카테고리의 다른 글

배열 변형 - sort, reverse  (0) 2022.05.24
배열탐색 - indexOf, lastIndexOf, includes  (0) 2022.05.24
String 관련 method  (0) 2022.05.12
Number 관련 method  (0) 2022.05.11
다이나믹 파라미터  (0) 2022.05.10
Comments