Array 메소드 정리 (2)

Jiwon Yoo·2023년 2월 16일
0

프론트엔드

목록 보기
3/38

Array.prototype.concat();

concat() 메서드는 인자로 주어진 배열이나 값들을 기존 배열에 합쳐서 새 배열을 반환한다.
*기존 배열을 변경하지 않고 추가된 새로운 배열을 반환하는 것

array.concat([value1[, value2[, ...[, valueN]]]])

// 1)
const countries = ["Ghana", "Nigeria", "Rwanda"];

let newCountries = [].concat("Mali", countries, "Kenya");
console.log(newCountries); // ["Mali","Ghana","Nigeria","Rwanda","Kenya"]

// 2)
const africanCountries = ["Ghana", "Nigeria", "Rwanda"];
const europeanCountries = ["Germany", "France", "spain"];

let countries = [].concat(africanCountries, europeanCountries);
console.log(countries); // ["Ghana","Nigeria","Rwanda","Germany","France","spain"]

Array.prototype.slice();

slice() 메서드는 어떤 배열의 begin 부터 end 까지(end 미포함)에 대한 얕은 복사본을 새로운 배열 객체로 반환한다.
*마찬가지로 기존 배열은 바뀌지 않는다.

arr.slice([begin[, end]])
👉 begin: 시작점에 대한 인덱스. 음수 인덱스는 배열의 끝부터의 길이. undefined라면 0번부터 slice. 배열의 길이보다 길경우 빈 배열의 반환.
👉 end: 추출을 종료 할 0 기준 인덱스. slice 는 end 인덱스를 제외하고 추출. 음수 인덱스는 배열의 끝에서부터의 길이. end가 생략되면 slice()는 배열의 끝까지(arr.length) 추출. end 값이 배열의 길이보다 크다면, slice()는 배열의 끝까지(arr.length) 추출

반환 값은 추출한 요소를 포함한 새로운 배열이다.

const animals = ['ant', 'bison', 'camel', 'duck', 'elephant'];

console.log(animals.slice(2)); // ["camel", "duck", "elephant"]
console.log(animals.slice(2, 4)); // ["camel", "duck"]
console.log(animals.slice(1, 5)); // ["bison", "camel", "duck", "elephant"]
console.log(animals.slice(-2)); // ["duck", "elephant"]
console.log(animals.slice(2, -1)); // ["camel", "duck"]
console.log(animals.slice()); // ["ant", "bison", "camel", "duck", "elephant"]

Array.prototype.splice();

splice() 메서드는 배열의 기존 요소를 삭제 또는 교체하거나 새 요소를 추가하여 배열의 내용을 변경한다.

array.splice(start[, deleteCount[, item1[, item2[, ...]]]])
👉 start: 배열의 변경을 시작할 인덱스. 배열의 길이보다 큰 값이라면 실제 시작 인덱스는 배열의 길이로 설정. 음수인 경우 배열의 끝에서부터 요소를 세어나감 (원점 -1, 즉 -n이면 요소 끝의 n번째 요소를 가리키며 array.length - n번째 인덱스와 같음). 값의 절대값이 배열의 길이 보다 큰 경우 0으로 설정.
👉 deleteCount: 배열에서 제거할 요소의 수. deleteCount를 생략하거나 값이 array.length - start보다 크면 start부터의 모든 요소를 제거. deleteCount가 0 이하라면 어떤 요소도 제거하지 않음. 이 때는 최소한 하나의 새로운 요소를 지정해야 함.
👉 item1, item2, ...: 배열에 추가할 요소. 아무 요소도 지정하지 않으면 splice()는 요소를 제거하기만 함.

반환 값은 "제거한 요소"를 담은 배열로 하나의 요소만 제거한 경우 length가 1인 배열을 반환한다. 아무것도 제거하지 않을 시 빈배열을 반환한다.

const countries = ["Ghana", "Nigeria", "Rwanda"];

countries.splice(1, 0, 'Kenya', 'Mali');
console.log(countries); // ["Ghana","Kenya","Mali","Nigeria","Rwanda"]

Array.prototype.join();

join() 메서드는 배열의 모든 요소를 연결해 하나의 문자열로 만든다.

arr.join([separator])
👉 seperator: 배열의 각 요소를 구분할 문자열을 지정. 이 구분자는 필요한 경우 문자열로 변환. 생략하면 배열의 요소들이 쉼표로 구분. separator가 빈 문자열이면 모든 요소들이 사이에 아무 문자도 없이 연결.

배열의 모든 요소들을 연결한 하나의 문자열을 반환한다. 만약 arr.length 가 0이라면, 빈 문자열을 반환한다.
*요소가 undefined 또는 null이면 빈 문자열로 변환한다.

const elements = ['1', '2', '3'];

console.log(elements.join()); // "1,2,3"
console.log(elements.join('')); // "123"
console.log(elements.join('-'));// "1-2-3"
profile
새싹 개발자 🌱

0개의 댓글