[javascript] 배열 메소드 (Array Methods) 완벽 정리

Array Methods

splice() : 삭제된 특정 요소 반환 / 특정 요소 지우고 반환
splice(n, m) : index 가 n 부터 m 개의 요소를 지운 배열 반환
splice(n, m, x) : index가 n 부터 m개의 요소 지우고 x 요소 추가한 배열 반환

var arr = [1, 2, 3, 4, 5];
let result = arr.splice(1,3); // result : [1, 2, 3]
arr.splice(1,3); // [1, 5]
arr.splice(1, 3, 100); // [1, 100, 5]
arr.splice(1, 0, 200); // [1, 200, 2, 3, 4, 5]

 

slice() : 배열의 일부 요소를 제거한 새로운 배열 반환

slice(n, m) : index 가 n 부터 m-1 까지의 배열 반환

let arr = [1, 2, 3, 4, 5];
arr.slice(); // [1, 2, 3, 4, 5]
arr.slice(1, 4); // [2, 3, 4]

 

concat() : 배열을 합쳐서 새배열 반환

concat(arr1, arr2, ...) : arr1, arr2 배열을 합친 배열 반환

let arr = [1, 2];
arr.concat([3, 4]); // [1, 2, 3, 4]
arr.concat([3, 4], [5, 6]); // [1, 2, 3, 4, 5, 6]

 

forEach(fn) : 배열 반복

forEach((item, index, arr) => { }) : item(요소), index(인덱스), arr(배열)

let uers = ['Mike', 'Tom', 'Jane'];
users.forEach((item, index, arr) => {
    console.log(item) // Mike, Tom, Jane
    console.log(index) // 0, 1, 2
    console.log(arr) // users
}

 

indexOf() : 요소와 일치하는 배열의 인덱스 반환 (앞에서부터 검사)

indexOf(n) : 요소가 n 인 배열의 인덱스 반환

indexOf(n, m) : 요소가 n 인 m 번째 배열의 인덱스 반환

let arr = [1, 2, 3, 4, 5, 3];
arr.indexOf(3); // 2
arr.indexOf(3, 2); // 5

 

lastIndexOf() : 요소와 일치하는 배열의 인덱스 반환 (뒤에서부터 검사)

lastIndexOf(n) : 요소가 n 인 배열의 인덱스 반환

lastIndexOf(n, m) : 요소가 n 인 m 번째 배열의 인덱스 반환

let arr = [1, 2, 3, 4, 5, 3];
arr.indexOf(3); // 5
arr.indexOf(3, 2); // 2

 

includes() : 요소를 포함하고 있는지 확인 (boolean)

includes(n) : n 을 포함하는 배열인지 확인

let arr = [1, 2, 3];
arr.includes(2); // true
arr.includes(4); // false

 

find(fn) : 요소와 일치하는 배열의 요소 하나 반환 (앞에서 부터 검사)

let arr = [1, 2, 3, 4, 5];
const result = arr.find((item) => {
	return item % 2 === 0;
});

console.log(result); // 2

 

filter(fn) : 요소와 일치하는 배열의 모든 요소 반환 (앞에서 부터 검사)

let arr = [1, 2, 3, 4, 5];
const result = arr.filter((item) => {
	return item % 2 === 0;
});

console.log(result); // [2, 4]

 

reverse() : 배열을 역순으로 재정렬

let arr = [1, 2, 3, 4, 5];
arr.reverse(); // [5, 4, 3, 2, 1]

 

map(fn) : 함수를 받아 특정 기능을 시행하고 새로운 배열 반환

let userList = {
    {name: "Mike", age: 30},
    {name: "Jane", age: 27},
    {name: "Tom", age: 10},
}

let newUserList = userList.map((user, index) => {
	return Object.assign({}, user, {
    	isAdult: user.age > 19,
    });
});

 

join() : 배열을 합쳐서 문자열로 반환

join(n) : 배열 중간에 n 을 넣어서 문자열로 반환 (공백일 땐 ',')

let arr = ["안녕", "하세요"];
let result = arr.join(); // "안녕,하세요"
let result2 = arr.join(" "); // "안녕 하세요".
let result3 = arr.join("-"); // "안녕-하세요"

 

split() : 문자열을 나눠서 배열로 반환

split(n) : n 을 기준으로 문자열을 배열로 나눠서 반환

let str = "Hello My name is Espania";
const result = str.split(" "); // ['Hello', 'My', 'name', 'is', 'Espania']

 

Array.isArraay(array) : array 가 배열인지 아닌지 확인하는 메소드

let arr = [1, 2, 3];
let arr2 = {
    name : 'Mike',
}

Array.isArray(arr); // true
Array.isArray(arr2); // false