배열 Method

잔잔바리한접시·2022년 2월 20일
1

javascript

목록 보기
4/10
post-thumbnail

특정 요소 지우기 splice(n,m)

n부터 시작해서 m개를 지운다.

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

console.log(arr); // [1, 4, 5]

특정 요소 지우고 추가하기 splice(n,m,x)

n부터 시작해서 m개 지우고 x를 추가한다.

let arr = [1, 2, 3, 4, 5];
arr.splice(1,2,100,200);

console.log(arr); // [1, 100, 200, 4, 5]

그냥 추가하고 싶다면?

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

console.log(arr); // [1, 100, 200, 2, 3, 4, 5]

splice()메서드 자체는 삭제된 요소를 반환한다

let arr = [1, 2, 3, 4, 5];
let result = arr.splice(1,2);

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

특정 구간만 반환 slice(n,m)

n부터 m까지 반환한다.

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

console.log(arr); [2, 3, 4]

배열 합치기 concat(arr, 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]
arr.concat([3,4], 5, 6); // [1, 2, 3, 4, 5, 6]

배열 반복 forEach(fn)

let arr = ["kim", "jeong", "hoon"];
// arr.forEach((요소, 인덱스, 배열) => {});

arr.forEach((name) => {
	console.log(name); // "kim", "jeong", "hoon"
})

arr.forEach((name, index) => {
	console.log(`${index}. ${name}`); // "0. kim", "1. jeong", "2. hoon"
})

배열에서 값 찾기 indexOf(), lastIndexOf()

let arr = [1, 2, 3, 4, 5, 1, 2, 3];

arr.indexOf(3); // 2
arr.indexOf(3,3) // 7 2번째 인수 m은 m번째부터 찾으라는 뜻
arr.lastIndexOf(3); // 7 배열의 마지막부터 검색

포함 관계만 확인하고 싶을 때 includes()

let arr = [1, 2, 3];

arr.includes(1); // true
arr.includes(6); // false

복잡한 값 찾기 find(fn)

let arr = [1,2,3];
const result = arr.find((item) => {
	return item % 2 === 0;
})
console.log(result) // 2 맨 처음 true인 값만 반환됨

또는

let userList = [
	{ name: "hoon", age: 25 },
  	{ name: "jun", age: 27 },
    { name: "nam", age: 21 },
]

const result = userList.find((user) => {
	if(user.age > 22){
    	return true;
    }
	else{
    	return false;
    }
});
console.log(result); // { name: "hoon", age: 25 }

인덱스로 찾으려면?

let userList = [
	{ name: "hoon", age: 25 },
  	{ name: "jun", age: 27 },
    { name: "nam", age: 21 },
]

const result = userList.findIndex((user) => {
	if(user.age > 22){
    	return true;
    }
	else{
    	return false;
    }
});
console.log(result); // 0

만족하는 모든 요소를 배열로 반환 filter(fn)

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

배열 역순 정렬 reverse()

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

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

let userList = [
	{ name: "hoon", age: 25 },
  	{ name: "jun", age: 27 },
    { name: "nam", age: 21 },
]

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

console.log(newUserList); // { name: "hoon", age: 25, isAdult: true }, { name: "jun", age: 27, isAdult: true }, { name: "nam", age: 21, isAdult: true },

배열 합쳐서 문자열로 만들기 join()

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

console.log(arr); // 안녕-하세-요

문자열 잘라서 배열 만들기 split()

const brands = "Nike,Adidas,Puma";
const result = brands.split(",");

console.log(result); // ["Nike", "Adidas", "Puma"]

모두 잘라버리려면?

const nike = "nike";
nike.split("");

console.log(nike); // ["n", "i", "k", "e"]

0개의 댓글