[배열] 내장함수②

TASON·2021년 7월 7일

Pop push shift slice splice unshift 내장함수 배열

자바스크립트

목록 보기

10/11

배열 내장함수

자바스크립트에서는 배열을 다룰 때 알고 있으면 유용한 다양한 내장 함수가 있다.

forEach map indexof findIndex find filter
splice slice shift unshift pop push includes

이번 <내장함수②> 포스팅에서는 <내장함수①>에 이어서 splice slice shift unshift pop push includes 함수들을 다뤄보도록 하겠다.

splice

const numbers = [1, 2, 3, 4, 5];

const numberIndex = numbers.indexOf(3);
numbers.splice(index, 2);
console.log(numbers); // [1, 2, 5] 출력됨

splice 함수는 배열에서 특정 항목부터 시작하여 몇개의 연속된 원소까지 제거할 때 사용한다.
위 배열에서 3의 인덱스를 찾고, splice의 파라미터로 3의 인덱스와 지울 인덱스의 갯수를 입력한다.
결과는 3, 4 두 개를 제외한 나머지가 배열로 출력된다.

slice

const numbers = [1, 2, 3, 4, 5];

const result = numbers.slice(0, 3);
console.log(result); // [1, 2, 3] 출력됨
console.log(numbers); // [1, 2, 3, 4, 5] 출력됨

slice 함수는 splice 함수와 비슷하다.
다만, splice 함수와 달리 기존의 배열을 건드리지 않는다.
새로운 배열에는 첫번째 파라미터 인덱스 값부터 두번째 파라미터 인덱스 직전 인덱스 값까지 저장된다.

shift

const numbers = [1, 2, 3, 4, 5];

const leftNumber = numbers.shift();
console.log(leftNumber); // 1 출력됨
console.log(numbers); // [2, 3, 4, 5] 출력됨

shift 함수는 기존 배열의 가장 첫번째 원소를 추출한다.
즉, 배열의 가장 왼쪽에 위치한 원소를 추출한다.
이 때, 변수를 만들어 반환된 원소를 저장할 수 있다.
기존 배열에서 해당 원소는 사라진다.

unshift

const numbers = [1, 2, 3, 4, 5];

numbers.unshift(0);
console.log(numbers); // [0, 1, 2, 3, 4, 5] 출력됨

unshift 함수는 shift 함수의 반대이다.
배열의 맨 앞, 즉 가장 왼쪽에 새로운 원소를 추가한다.

pop

const numbers = [1, 2, 3, 4, 5];

const rightNumber = numbers.pop();
console.log(rightNumber); // 5 출력됨
console.log(numbers); // [1, 2, 3, 4] 출력됨

pop 함수는 shift 함수와 매우 유사하다.
다만, shift 함수와 반대로 마지막 원소, 즉 배열의 가장 오른쪽 원소를 추출한다.

push

const numbers = [1, 2, 3, 4, 5];

numbers.push(6);
console.log(numbers); // [1, 2, 3, 4, 5, 6] 출력됨

push 함수는 unshift 함수와 유사하다.
다만, unshift 함수와 반대로 배열의 맨 뒤, 즉 가장 오른쪽에 새로운 원소를 추가한다.

includes

const foods = ['김치', '막걸리', '파전', '동동주'];

const isTrue = foods.includes('막걸리');
const isTrue2 = foods.includes('삼겹살');
console.log(isTrue); // true 출력됨
console.log(isTrue2); // false 출력됨