Javascript에서 ForEach, 매핑, 필터링 및 축소

ForEach, Map, reduce 및 filter는 모두 JavaScript의 배열 메서드입니다. Map, Reduce 및 Filter는 배열을 반복하고 변환 또는 계산을 수행하고 일부 값을 반환하는 반면 ForEach는 배열을 반복하는 데 사용됩니다.

ForEach: ForEach 메서드는 각 배열 요소에 대해 제공된 함수를 한 번씩 실행합니다.

ex: 
let arrA = [1,2,3,4]
arrA.forEach(element => console.log(element));
// [1,2,3,4]



Map: 배열의 각 요소에 대해 실행하고 동일한 길이의 새 배열을 반환합니다.

let arrA = [1,2,3,4]
let arrB = arrA.map(_i => i*2)
console.log(arrB)

// [1,4,6,8]


필터: 필터는 기본적으로 조건을 만족하는 요소가 있는 새 배열을 반환하거나 조건을 충족하지 않는 요소를 필터링합니다.

let arrA = [1,2,3,4]
let arrB = arrA.filter(_i => i%2)
console.log(arrB)

// [2,4]


감소: 감소는 기본적으로 단일 값을 반환합니다. 그것을 사용하는 동안 우리는 accumulator의 초기 값을 정의했고 각 반복에서 우리는 몇 가지 작업을 수행해야 하며 이는 accumulator에 추가됩니다.

let arrA = [1,2,3,4]
let initialVal=0
let result = arrA.reduce((accu, val) => val + accu , initialVal);
console.log(result)

// 10


ForEach, Map, Filter 및 Reduce를 위한 Polyfill

폴리필은 기본적으로 지원하지 않는 이전 브라우저에서 최신 기능을 제공하는 데 사용되는 코드(일반적으로 웹의 JavaScript)입니다.


Array.prototype.customForEach = function(callback) {
    for (var i = 0; i < this.length; i++)
        callback(this[i], i, this);
};

Array.prototype.customMap = function(callback) {
    arr = [];
    for (var i = 0; i < this.length; i++)
        arr.push(callback(this[i], i, this));
    return arr;
};

Array.prototype.customFilter = function(callback, context) {
    arr = [];
    for (var i = 0; i < this.length; i++) {
        if (callback.call(context, this[i], i, this))
            arr.push(this[i]);
    }
    return arr;
};

Array.prototype.customReduce = function(callback, initialVal) {
    var accum = (initialVal === undefined) ? undefined : initialVal;
    for (var i = 0; i < this.length; i++) {
        if (accum !== undefined){
            accum = callback.call(undefined, accum, this[i], 
                   i, this);
        } else{
            accum = this[i];
        }
    }
    return accum;
};


좋은 웹페이지 즐겨찾기