[JS] forEach / map / filter / find

또띠·2023년 7월 25일
0

JavaScript

목록 보기
6/23
post-thumbnail
post-custom-banner

javascript에서 자주 쓰인다는 forEach / map / filter / find 에 대해 알아보자 😀
이 매소드들은 배열 에서 사용된다는 것!

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

위와 같은 배열이 있다고 하자.

1. forEach

num.forEach(function(item){
    console.log(item); // 1 2 3 4 5
});

주로 배열 안에 내용을 반복하고 싶을때 쓰는데 forEach는 for문과 유사하다고 볼 수 있다.
하지만 forEach와 for문은 다르다. 어떻게 다르냐면...

for문 : 값을 차례대로 하나하나 불러온다
forEach문 : 일단 값을 다 던져놓고 하나하나 주워 담는다

따라서 상황에 맞게 사용하는 것이 좋을 것 같다.

2. map

let numbers = num.map(function(item){
    return item * 2;
})
console.log(numbers); // [ 2, 4, 6, 8, 10 ]

map의 경우 return할 내용이 필요하다!
왜냐하면 새로운 배열이 생성되기 때문...! (항상 원본 배열 길이만큼 return 된다)
여기서는 item 이란 인자를 받아서 곱하기 2를 하게 해서 출력해 보았다.

3. filter

let filterNumbers = num.filter(function(item){
    return item === 5;
})
console.log(filterNumbers); // [5]

filter는 말 그대로 필터링을 해 준다.

만약 5를 꺼내고 싶다면 item === 5를 작성하여 특정 숫자만 꺼내준다.
map처럼 새로운 배열을 생성 후 담아준다.

4. find

let findNum = num.find(function(item){
    return item > 3;
});
console.log(findNum); // 4

find는 좀 신기하게도 조건식에서 여러가지가 해당된다고 해도 가장 먼저 오는 요소만 가져다 준다.

profile
✨ 𝑬𝒗𝒆𝒓𝒚𝒕𝒉𝒊𝒏𝒈 𝒄𝒐𝒎𝒆𝒔 𝒕𝒐 𝒉𝒊𝒎 𝒘𝒉𝒐 𝒉𝒖𝒔𝒕𝒍𝒆𝒔 𝒘𝒉𝒊𝒍𝒆 𝒉𝒆 𝒘𝒂𝒊𝒕𝒔. ✨
post-custom-banner

0개의 댓글