본문 바로가기

JS

#자바스크립트 스터디 5 - 배열메소드1

 

arr.splice(n, m) : 특정 요소를 지움 (n부터 m개 지워) 
arr.splice(n, m, x) : n부터 m개 지우고 x 추가해
let arr = [1,2,3,4,5];
arr.splice(1,3,100,200);
//1부터 3까지 지우고 100, 200 넣어
console.log(arr);

ㄴ 배열 내에 값을 추가할 때 순서를 넣을 수 있다. 

let arr = ["나는", "철수", "입니다."];
arr.splice(1,0,"대한민국", "소방관");
console.log(arr);

//나는 대한민국 소방관 철수 입니다. 순서로 삽입 가능

ㄴ삭제된 요소들을 반환한다. 

 

 

arr.slice(n.m) : n부터 m까지 반환한다. *m은 포함하지 않고 바로 앞자리까지 반환한다. 
let arr = [1,2,3,4,5];
arr.slice(1,4); //[2,3,4]

 

arr.concat(arr2, arr3) : 합쳐서 새배열 반환
let arr = [1,2,3,4,5];
console.log(arr.concat([6,7]));

 

arr.forEach(fn) : 배열 반복!!

arr.forEach(item, index, arr) => {

}

1인수 : 해당인수

2인수 : 인덱스

3인수 : 해당 배열 자체

 

//forEach(fn)
//함수를 인수로 받는다. 


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

arr.forEach((name, index)=>{
    console.log(name);
});
//forEach() 안에 들어가는 전체가 함수

 

 

arr.indexOf / arr.lasIndexOf : 문자열의 IndexOf와 같이 동작 한다. 값이 있는지 찾는다.

ㄴ 찾으면 해당 값의 인덱스를 반환한다. 

arr.indexOf(4,3) -> 4인덱스부터 3인덱스가 있는지 탐색한다. 

arr.lastIndexOf(3) -> 끝에서부터 3 있는지 탐색

 

 

arr.includes() : 포함하는지 확인
arr.find(fn) / arr.findIndex(fn) : 첫번째 true 값만 반환하고 긑, 만약 없으면 undefined 반환
let arr = [1,2,3,4,5];

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

console.log(result);

find 메소드는 해당되는 조건을 찾자마자 멈춘다. 

 

 

실습1. 객체가 들어있는 배열에서 미성년자 찾기

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

userList.find((user) =>{
    if(user.age<=19){console.log(`${user.name} 은 미성년자입니다. `);}
});

 

 

arr.filter() : 만족하는 모든 요소를 가져온다. 
let userList =[
    {name: "Mike", age: 30},
    {name: "Jane", age: 26},
    {name: "Tom", age: 10},
]

userList.filter((user) =>{
    if(user.age>19){console.log(`${user.name} 은 성인입니다. `);}
});

ㄴ 위 실습 예제 역으로 성인 추출하기!

 

arr.reverse() : 역순으로 재정렬

 

 

arr.map(fn) : 함수를 받아 특정 기능을 시행하고 새로운 배열을 반환
let userList =[
    {name: "Mike", age: 30},
    {name: "Jane", age: 26},
    {name: "Tom", age: 10},
]

let newUserList = userList.map((user,index) => {
    return Object.assign({}, user, {
        isAudlt : user.age > 19, // 객체의 프로퍼티 하나 추가해줌! (조건 추가 가능)
    });
});

console.log(newUserList);

 

join, split

Join -> 배열을 문자열로 저장해준다. 

//join, split
//배열을 합쳐서 문자열을 만들 때! join

let arr = ["안녕", "나는", "철수야"];

let result = arr.join(" "); //공백으로 출력한다.

console.log(result); // 문자열로 출력

 

split -> 문자열을 배열로 반환해준다. 

//join, split
//배열을 합쳐서 문자열을 만들 때! join

let str = "hello my name is chae";
const result = str.split(" "); //공백으로 나눔

console.log(result); //배열로 출력

 

Array.isArray() : 배열인지 확인하는 메소드