배열.Method

push

배열 생성 후 배열에 새로운 원소를 마지막에 추가

const array = [];
for(let i=0; i < 10; i++) {
  array.push(i * 10);
}
array.push(100);

pop

배열의 마지막 원소를 반환하고 해당 원소를 배열에서 제거
실행될 때 마다 배열의 크기가 1씩 감소

const array = [1, 2, 3];
console.log(array.pop()); -> 3
console.log(array); -> [1, 2]

shift

배열에서 첫 번째 원소를 반환하고 해당 원소를 배열에서 제거

const array = [1, 2, 3];
console.log(array.shift()); -> 1
console.log(array); -> [2, 3]

unshift

하나 또는 그 이상 N개의 원소를 배열의 맨 앞에 추가하고 새로운 배열 반환

const array = [1];
array.unshift(2,3)
console.log(array); -> [2, 3, 1]
array.unshift('Hello World');
console.log(array); -> ['Hello World', 2, 3, 1]

slice

배열의 시작 위치부터 마지막 위치까지에 대한 새로운 배열을 생성하여 반환
마지막 위치의 원소는 새로 생성된 배열에 포함하지 않음
새롭게 만들어질 배열 대상이 없다면 빈 배열을 반환
원본 배열에 아무 변화 없음

const array = ['A', 'B', 'C', 'D', 'E', 'F'];
const newArray = array.slice(1, 4);
console.log(newArray); -> ['B', 'C', 'D']

splice

배열에 있는 원소를 삭제하거나 배열에 새 원소를 추가
.splice(index,length,index위치부터 추가할 원소)

const array = ['A', 'B', 'C', 'D', 'E', 'F'];
let newArray = array.splice(1, 4, 'Hello', 'World');
console.log(newArray); -> ['B', 'C', 'D', 'E']
console.log(array); -> ['A', 'Hello', 'World', 'F']

join

배열의 모든 원소를 연결해 하나의 문자열로 반환
인수로 원소와 원소 사이의 구분자로 사용될 문자열을 받으며 생략될 경우 기본 값은 콤마(,)
원본 배열에 아무 변화 없음

const array = ['A', 'B', 'C', 'D'];
const newArray = array.join(' next ');
console.log(newArray); -> A next B next C next D
console.log(array); -> ['A', 'B', 'C', 'D']

forEach

forEach의 인수로 지정한 함수는 호출될 때 마다 세 개의 인자를 받음
세 개의 인자는 각각 순서대로 배열 원소 값 원소의 위치 원본 배열

const array = [
              {id:'A', name:'a'},
              {id:'B', name:'b'},
              {id:'C', name:'c'},
              {id:'D', name:'d'}
            ];
array.forEach((name,idx) => console.log(idx+1+':'+name.name));
-> 1:a 2:b 3:c 4:d           

map

배열 내의 모든 원소 각각에 대하여 등록된 함수를 호출하고
등록된 함수가 반환한 결과를 모아서 새로운 배열로 반환

const array = [
              {id:'A', name:'a'},
              {id:'B', name:'b'},
              {id:'C', name:'c'},
              {id:'D', name:'d'}
            ];
const newArray = array
.map(a => ({...a, class:'member'}));

filter

등록된 함수가 반환한 값이 참인 원소를 모은 새로운 배열을 반환
filter 함수에 등록된 함수는 반드시 참 또는 거짓을 반환해야 하며
어떤 값을 반환해도 Boolean 으로 평가
값을 반환하지 않는다면 Javascript 함수 특성상 모두 undefined 를 반환하여 거짓으로 판정되므로 빈 배열을 반환

const array = [
              {id:'A', name:'a'},
              {id:'B', name:'b'},
              {id:'C', name:'c'},
              {id:'D', name:'d'}
            ];
const newArray = array
.filter(a => a.name === 'a' || a.name === 'd')
.map(a => a.id)
console.log(newArray);
-> [A, D]

sort

배열의 원소를 적절한 위치에 정렬한 배열을 반환
기본 정렬 순서는 문자열 유니 코드 코드 포인트에 따름

const array = [
              {id:'5', name:'a'},
              {id:'3', name:'b'},
              {id:'7', name:'c'},
              {id:'2', name:'d'}
            ];
const newArray = array.sort((a,b) => a['id'] - b['id']);
console.log(newArray);
           -> {id:'2', name:'a'},
              {id:'3', name:'b'},
              {id:'5', name:'c'},
              {id:'7', name:'d'}

reverse

배열의 순서를 반전하여 반환

const array = ["one", "two", "three"]
console.log(array.reverse())
->["three", "two", "one"]

concat

원본 배열에 추가된 새로운 배열을 반환
원본 배열에 아무 변화 없음

const num1 = [1, 2, 3];
const num2 = [4, 5, 6];
const num3 = [7, 8, 9];
const newArray = num1.concat(num2, num3)
console.log(newArray)
->[1, 2, 3, 4, 5, 6, 7, 8, 9]