[JavaScript] 07. Array methods

SSOYEONG·2022년 7월 27일
0

자바스크립트 기초

목록 보기
6/11
post-thumbnail

arr.splice(n, m)

  • index n부터 m개 삭제
let arr = [1, 2, 3, 4, 5];
arr.splice(1, 2);	// index 1부터 2개 지워라
console.log(arr);	// [1, 4, 5]

let arr = [1, 2, 3, 4, 5];
arr.splice(1, 3, 100, 200);		// 100, 200을 채워 넣어라
console.log(arr);	// [1, 100, 200, 5]

let arr = ["나는", "학생", "입니다"];
arr.splice(1, 0, "대");
console.log(arr);	// ["나는", "대", "학생", "입니다"];

// 삭제된 요소 반환
let arr = [1, 2, 3];
let result = arr.splice(1, 1);
console.log(result);	// [2]

arr.slice(n, m)

  • index n부터 m-1까지 반환
let arr = [1, 2, 3, 4, 5];
arr.slice(1, 4);	// [2, 3, 4]

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

arr.concat()

  • 합쳐서 새 배열 반환

arr.forEach(fn)

  • 배열 반복
let arr7 = ["Mike", "Tom", "Jane"];

arr7.forEach((name, index) => {
    console.log(name);
    console.log(`${index + 1}. ${name}`);
});

arr.indexOf / arr.lastIndexOf

let arr = [1, 2, 3, 4, 5, 1, 2, 3];
arr.indexOf(3);		// 2
arr.indexOf(3, 3);	// index 3부터 3을 탐색하므로 7
arr.lastIndexOf(3);	// 마지막 index부터 탐색하므로 7

arr.incldues()

  • 포함 여부 확인

arr.find(fn) / arr.findIndex(fn)

  • 함수를 인자로 전달
  • 첫번째 true 값만 반환하고 끝
  • 없으면 undefined 반환
let arr7_1 = [1, 2, 3, 4, 5];
const result = arr7_1.find((item) => {
    return item % 2 == 0;       // item을 순회하면서 짝수를 찾는다. 2
});

console.log(result);

    let userList = [    
        {name: "Mike", age: 30},
        {name: "Jane", age: 15},
        {name: "Tom", age: 10},
    ];
    
    const result7 = userList.find((user) => {
        if(user.age < 19) {
            return true;
        }
        return false;
    });

    console.log(result7);	// [name: "Jane", age: 15]

arr.filter(fn)

  • find와 사용법은 동일
  • 단, 조건을 만족하는 모든 요소를 배열로 반환

arr.reverse()

  • 역순으로 재정렬

arr.map(fn)

  • 함수를 받아 특정 기능을 시행하고 새로운 배열을 반환
let newUserList = userList.map((user, index) => {
    return Object.assign({}, user, {
        id: index + 1,
        isAdult: user.age > 19,
    });
});
console.log(newUserList);
/*
[
  { name: 'Mike', age: 30, id: 1, isAdult: true },
  { name: 'Jane', age: 15, id: 2, isAdult: false },
  { name: 'Tom', age: 10, id: 3, isAdult: false }
]
*/
profile
Übermensch

0개의 댓글