카테고리 없음

Javascript 공부하기) 배열메소드

DevOhwa 2022. 10. 6. 15:48
반응형

Array

 

arr.splice(n, m) : 특정 요소 지움

arr.splice(n, m, x) : 특정 요소 지우고 추가

arr.splice() : 삭제된 요소를 반환한다. 

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

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

arr.slice(n, m) : n부터 m까지 반환. m은 포함하지 않고 바로 앞자리를 의미한다. 만일 숫자를 쓰지 않는다면 배열 끝까지를 의미한다. 

 

arr.concat(arr2, arr3 ..) : 합쳐서 새배열 반환

arr.forEach(fn) : 배열반복. 함수를 인수로 받는다. 보통 첫번째와 두번째까지만 사용한다. 

 let users = ['Mike', 'Tom', 'Jane'];
 users.forEach((item, index, arr) => {
 });

 

arr.indexOf / arr.lastIndexOf

arr.indexOf(3,3) : 이처럼 인수가 두개인경우 두번째인수는 시작위치를 의미한다. 

let arr = [1,2,3,4,5,1,2,3];
arr.indexOf(3); //2
arr.indexOf(3,3) //7. 앞의3 뒤에있는 3의 인덱스값인 7이 나온다. 
arr.lastIndexOf(3); //7. 끝에서 3이있는곳의 인덱스값인 7이 반환된다.

 

 

arr.includes(): 포함하는지 확인. 굳이 인덱스를 확인하고 싶지않고 포함하는것만 확인할때 사용한다. 

let arr = [2,3];

arr.includes(2); //true
arr.includes(8); //false

 

arr.find(fn) / arr.findIndex(fn) : indexOf 처럼 찾는다는 의미는 동일. 보다 복잡한 연산이 가능하도록 함수를 인자로 넣는다. 

주의, 첫번째 true값만 반환하고 끝이다. 만일 없다면 undefined를 반환한다. 

findIndex는 해당 인덱스를 반환한다. 없으면 -1을 반환한다. 

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

const result = arr.find((item) => {
	return item % 2 === 0;
});

console.log(result);

위의 코드는 결과값으로 2를 반환한다. return 값이 true일때 멈추고 값을 알려준다. 

(참고로 item % 2 ===0 은 2로 나눴을때 나머지가 0인 친구들을 뽑아내는것.)

 

인자가 객체일때

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

const result = userList.find((user) => {
 if(user.age <19) {
 	return true;
}
 return false;
 });
 
 console.log(result); //{name: "Tom", age: 10}

find가 아니라 findIndex를 사용하면 조건에 맞는 인덱스를 찾아낸다 따라서 2가 나온다. 

 

arr.filter(fn) : 만족하는 모든 요소를 배열로 반환한다. find와 사용법은 동일하다. 위의 예제에서 find를 filter로만 바꿔주면 된다. 

 

arr.reverse() : 역순으로 재정렬해준다. 게시판에서 최근 등록한 순으로 작성한것을 보여줄때 자주사용한다. 

arr.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, {
 	id: index +1,
    isAdult: user.age >19
	});
});

console.log(newUserList);
//  0: {name : "Mike", age: 30, id: 1, isAdult: true},
//  1: {name : "Jane", age: 27, id: 2, isAdult: true},
//  2: {name : "Tom", age: 10, id: 3, isAdult: false}

 

arr.join() : 인자들을 합쳐준다. 아무것도 넣지않고 합치면 ','를 넣어서 출력된다. " "안에 어떻게 합치고 싶은지 추가해주면된다. 

arr.split() : 문자열을 나눠준다. ","를 넣으면 쉼표기준으로 배열을 나눠준다. 만일아무것도 안넣고 " "로 split하면 글자하나하나, 띄어쓰기도 쪼개준다.

 

Array, isArray()

let user = {
	name:"Mike",
    age: 30
};

let userLsit = ["Mike","Tom", "Jane"];

console.log(typeof user); //object
console.log(typeof userList); //object

console.log(Array.isArray(user)); //false
console.log(Array.isArray(userList)); //true