React | Array method

다양한 Array method

리엑트를 공부하면서, 자주사용하게 되는 메서드가 있어서 정리합니다. 이글을 보시는 분들께, 아직까지는 정확한 정보를 드릴 수 있는 자신감이 없어서... 혹, 잘못된 부분이 있다면 회초리를 들어서 꾸짖어 주세요. 감사합니다.

1. map

리액트 관련책을 읽고, 강의를 보면, 항상 나오는 것이 map 메서드이다.
map 메서드는 쉽게 말해서 기존의 배열을 새로운 배열로 재가공하는 것이라고 생각하면 된다. 아래 코드를 보면, 기존의 배열에 추가해서 새로운 배열이 생겼다. 모든 요소에 접근을 해서 배열을 변경시키는데...아직 어떻게 써야할지는 몰라서... 일단 좀 써보고, 추가해보도록 하겠습니다.

let days = ["Mon", "Tue", "Wed"]
let today = days.map(day => `Today is ${day}day`)
    
    console.log(today)
    
    (4) ["Today is Monday", "Today is Tueday", "Today is Wedday"]

2. filter

filter 메서드는 map이랑 반대로 생각하면 됩니다. 기존의 배열에서 내가 빼고자하는 것을 빼서, 새로운 배열로 만드는 것입니다. 배열의 모든 요소들에 함수를 실행해서 true를 returen하는 요소로만 이루어진 배열을 만드는 것이라고 생각하면 된다.

let numbers = [2, 234234, 34563456345]
let biggerThan = nubers.filter(number => number > 15);
console.log(biggerThan)

[234234, 34563456345]

3. forEach

forEach도 배열안에 있는 각각의 요소를 변경할 때 사용을 합니다. for문을 생략할 좀 더 짧게 사용할 수 있다는 점에서 큰 메리트가 있습니다.

let numbers = [1, 3, 52345, 3432];
let copy = [];

//기존 방식 
for(let i = 0; i < numbers.length; i++) { copy.push(numbers[i])}

//forEach
numbers.forEach(function(number){copy.push{item};})

공부를 하고, 이 메서드를 리액트에서 사용 하게 되면, 추가적으로 코드들을 업로드 하도록 하겠습니다. 감사합니다.~~~