map(), filter()

map()

내가 가진 배열을 새롭게 조작을해서 새로운 배열로 반환을 할 때 사용

const langs = ['JS', 'HTML', 'CSS'];

const newLangs = langs.map(function(lang) {
    return lang + ' 언어';
});

console.log(newLangs);

langs가 한번 실행되면서 JS에 function이 실행되고 HTML에 function이 실행되고 CSS에 function이 실행된다.

그리고 return된 것들이 매 요소마다 새로운 배열로 들어간다.

---

filter()

filter() 메서드는 주어진 함수의 테스트를 통과하는 모든 요소를 모아 새로운 배열로 반환합니다.

const langs = ['JS', 'HTML', 'CSS', 0, 1, 2, 3];

const numbers = langs.filter(function(el) {
    if(typeof el == 'number') {
        return el;
    }
});

console.log(numbers);

const strings = langs.filter(function(el) {
    if(typeof el == 'string') {
        return el;
    }
});

console.log(strings);

화살표 함수를 이용하여 간단하게 만들기

const langs = ['JS', 'HTML', 'CSS', 0, 1, 2, 3];

const isNumber = function (el) {
    if(typeof el == 'number') {
        return true;
    };
};

const isString = (el) => typeof el == 'string';

const numbers = langs.filter(isNumber);
const strings = langs.filter(isString);