[JavaScript] Array method

push

배열 뒷부분의 값을 삭제

var arr = [ 1, 2, 3, 4 ];
arr.pop();
console.log( arr ); // [ 1, 2, 3 ]

pop

배열 뒷부분의 값을 삽입

var arr = [ 1, 2, 3, 4 ];
arr.push( 5 );
console.log( arr ); // [ 1, 2, 3, 4, 5 ]

unshift

배열 앞부분에 값을 삽입

var arr = [ 1, 2, 3, 4 ];
arr.unshift( 0 );
console.log( arr ); // [ 0, 1, 2, 3, 4 ]

shift

배열 앞부분의 값을 삭제

var arr = [ 1, 2, 3, 4 ];
arr.shift();
console.log( arr ); // [ 2, 3, 4 ]

splice

배열의 특정위치에 요소를 추가하거나 삭제
원래 배열을 수정

splice( index, 제거할 요소 개수, 배열에 추가될 요소 )
var arr = [ 1, 2, 3, 4, 5, 6, 7 ];
arr.splice( 3, 2 );
console.log( arr ); // [ 1, 2, 3, 6, 7 ]   3번째 인덱스에서부터 2개 제거
var arr = [ 1, 2, 3, 4, 5, 6, 7 ];
arr.splice( 2, 1, "a", "b");
console.log( arr ); // [ 1, 2, "a", "b", 4, 5, 6, 7 ] 2번째 인덱스에서 1개 제거 후 "a"와 "b"를 추가

slice

배열의 첫번째부터 마지막Index 까지 대한 shallow copy를
새로운 배열로 반환
원래 배열은 변화 없음

var arr = [ 1, 2, 3, 4, 5, 6, 7 ];
var newArr = arr.slice( 3, 6 );
console.log( 'slice',  newArr ); // [ 4, 5, 6 ]

concat

다수의 배열을 합치고 병합된 배열의 사본을 반환

var arr1 = [ 1, 2, 3 ];
var arr2 = [ 4, 5, 6 ];
var arr3 = arr2.concat( arr1 );
console.log( arr3 ); // [ 4, 5, 6, 1, 2, 3 ]

forEach

파라미터로 주어진 함수를 배열 요소 각각에 대해 실행하는 메서드이다.
map()과 비슷하지만, 차이점은 따로 return값이 없다는 것이다.

const myArr = [1, 2, 3, 4, 5];
myArr.forEach((currentElement, index, array) => {
    console.log(`요소: ${currentElement}`);
    console.log(`인덱스: ${index}`);
    console.log(array);
});
// 요소:1, 인덱스:0, array:[1,2,3,4,5]
// 요소:2, 인덱스:1, array:[1,2,3,4,5]
// 요소:3, 인덱스:2, array:[1,2,3,4,5]
// 요소:4, 인덱스:3, array:[1,2,3,4,5]
// 요소:5, 인덱스:4, array:[1,2,3,4,5]

for반복문을 forEach()를 사용하면
쉽게 원소들을 순서대로 실행할 수 있다.

const items = ['item1', 'item2', 'item3'];
const copy = [];
// 이전
for (let i=0; i<items.length; i++) {
  copy.push(items[i]);
}
// 이후
items.forEach(function(item){
  copy.push(item);
});

map

배열 내의 모든 요소에 각각에 대하여 주어진 함수를 호출한 결과를 모아
새로운 배열을 반환

const array1 = [1, 4, 9, 16]; // pass a function to map
const map1 = array1.map(x => x * 2);
console.log(map1); //  [2, 8, 18, 32]

filter

함수의 결과값이 true인 원소들로만 구성된
새로운 배열을 반환

var arr =[ 1, 2, 3, 4, 5, 6, 7, 8, 9, 10 ];
var isEven = function( value ) {
  return value % 2 === 0;
};
var newArr = arr.filter( isEven );
console.log( newArr ); // [ 2, 4, 6, 8, 10 ]

toString

배열을 문자열로 바꾸어 반환

var arr =[ 1, 2, 3, 4 ];
console.log( arr.toString() ); // 1, 2, 3, 4

join

배열 원소 전부를 합해 하나의 문자열로 반환

var arr =[ 1, 2, 3, 4 ];
console.log( arr.join() );      // 1,2,3,4
console.log( arr.join( '-' ) ); // 1-2-3-4

split

문자열을 배열로 반환

const fruits = '🍎, 🥝, 🍌, 🍒';
const arr = fruits.split(',');
console.log(arr); //  ["🍎", " 🥝", " 🍌", " 🍒"]

sort

배열을 오름차순/내림차순으로 정렬

const arr = [5, 3, 2, 4, 6, 1];
const res;
res = arr.sort(); // sort((a, b) => a - b)과 동일
console.log(res); // [1, 2, 3, 4, 5, 6]
res = arr.sort((a, b) => b - a);
console.log(res); // [6, 5, 4, 3, 2, 1]