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]