programing

오브젝트의 Javascript reduce()

luckcodes 2022. 10. 29. 16:08

오브젝트의 Javascript reduce()

어레이에서 1개의 값을 취득할 수 있는 어레이 방법이 있습니다.예:

[0,1,2,3,4].reduce(function(previousValue, currentValue, index, array){
  return previousValue + currentValue;
});

사물에 대해서도 같은 것을 실현하는 가장 좋은 방법은 무엇입니까?다음을 수행합니다.

{ 
    a: {value:1}, 
    b: {value:2}, 
    c: {value:3} 
}.reduce(function(previous, current, index, array){
  return previous.value + current.value;
});

오브젝트에는 , 브, 브 however any any any however any any any any가 없는 것 .reduce()구현된 방식입니다.

은 " " " 입니다.reduce다음 중 하나를 선택합니다.

var o = { 
    a: {value:1}, 
    b: {value:2}, 
    c: {value:3} 
};

Object.keys(o).reduce(function (previous, key) {
    return previous + o[key].value;
}, 0);

하거나, 첫 라운드는 '아까부터'가 될 예요.'a' + 2.

( 「」 「」 「」 「」).{ value: ... }

Object.keys(o).reduce(function (previous, key) {
    previous.value += o[key].value;
    return previous;
}, { value: 0 });

이 경우 실제로 필요한 것은 입니다.이를 염두에 둔 ES6의 간결한 실장을 다음에 나타냅니다.

const add = {
  a: {value:1},
  b: {value:2},
  c: {value:3}
}

const total = Object.values(add).reduce((t, {value}) => t + value, 0)

console.log(total) // 6

또는 단순하게:

const add = {
  a: 1,
  b: 2,
  c: 3
}

const total = Object.values(add).reduce((t, n) => t + n)

console.log(total) // 6

ES6 구현: Object.entries()

const o = {
  a: {value: 1},
  b: {value: 2},
  c: {value: 3}
};

const total = Object.entries(o).reduce(function (total, pair) {
  const [key, value] = pair;
  return total + value.value;
}, 0);

우선, 감소의 이전 가치를 제대로 파악하지 못합니다.

에는 「」라고 하는 코드가 있습니다.return previous.value + current.value에, 「」는,previous는 value가 시 .

번째, ㅇㅇㅇ,reduce는 객체의 방식이 아닌 배열 방식이며 객체의 속성을 반복할 때 순서를 신뢰할 수 없습니다( 참조: https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Statements/for... 참조). 이는 객체에 적용됩니다.도);그래서 적용할지는 잘 모르겠습니다.reduce★★★★★★★★★★★★★★★★★★★★★★★★★★★

다만, 순서가 중요하지 않은 경우는, 다음의 순서를 실행할 수 있습니다.

Object.keys(obj).reduce(function(sum, key) {
    return sum + obj[key].value;
}, 0);

또는 오브젝트 값을 매핑할 수도 있습니다.

Object.keys(obj).map(function(key) { return this[key].value }, obj).reduce(function (previous, current) {
    return previous + current;
});

추신: ES6에서는 fat arrow 함수의 구문(이미 Firefox Nightly에서)을 사용하여 조금 축소할 수 있습니다.

Object.keys(obj).map(key => obj[key].value).reduce((previous, current) => previous + current);

1:

[{value:5}, {value:10}].reduce((previousValue, currentValue) => { return {value: previousValue.value + currentValue.value}})

>> Object {value: 15}

2:

[{value:5}, {value:10}].map(item => item.value).reduce((previousValue, currentValue) => {return previousValue + currentValue })

>> 15

3:

[{value:5}, {value:10}].reduce(function (previousValue, currentValue) {
      return {value: previousValue.value + currentValue.value};
})

>> Object {value: 15}

오브젝트는 Object.entries(), Object.keys(), Object.values()를 사용하여 배열로 변환한 후 배열로 축소할 수 있습니다.그러나 중간 배열을 만들지 않고도 개체를 줄일 수도 있습니다.

오브젝트 작업을 위한 도우미 라이브러리 악취를 만들었습니다.

npm install --save odict

말말 it it it it 가 있다.reduceArray.protype.reduce()와 매우 유사한 기능:

export const reduce = (dict, reducer, accumulator) => {
  for (const key in dict)
    accumulator = reducer(accumulator, dict[key], key, dict);
  return accumulator;
};

다음 사용자에게 할당할 수도 있습니다.

Object.reduce = reduce;

이 방법은 매우 유용하기 때문에!

그래서 당신의 질문에 대한 답은 다음과 같습니다.

const result = Object.reduce(
  {
    a: {value:1},
    b: {value:2},
    c: {value:3},
  },
  (accumulator, current) => (accumulator.value += current.value, accumulator), // reducer function must return accumulator
  {value: 0} // initial accumulator value
);

가능성을 요약해 보겠습니다.목적은 항상 물체로 배열하는 것입니다.여기에는 다양한 Javascript 객체 기능이 있습니다.각 개별 함수에 대해 다른 해석 방법이 있습니다.그래서 그것은 항상 우리의 사물이 어떻게 생겼고 우리가 무엇을 하고 싶은지에 달려있다.

위의 예에서는 3개의 오브젝트를 가진 오브젝트입니다.

const obj = { 
    a: {value: 1}, 
    b: {value: 2}, 
    c: {value:3} 
};

오브젝트 포함.열쇠들.

Object.keys는 개체의 키만 제공합니다.

const arr = Object.keys(obj);
// output arr: 
[a, b, c]

const result = arr.reduce((total, key) => {
    return sum + obj[key].value;
}, 0);
// output result
// 6

Object.value 포함

Object.value()는 배열 내의 모든 값을 반환합니다.

const arr = Object.value(obj);
// output arr
[
   {value: 1},
   {value: 2},
   {value: 3},
]

const result = arr.reduce((total, singleValue) => {
   return total + singleValue.value;
}, 0);

// output result
// 6

// Or the short variant
const resultShort = Object.values(obj).reduce((t, n) => t + n.value, 0)

// output resultShort
// 6

Object.entries 포함

Object.entries는 각 개체 값을 배열로 분할합니다.

const arr = Object.entries(obj)
// output arr
[
  ["a", {visitors: 1}],
  ["b", {visitors: 2}],
  ["c", {visitors: 4}]
]

const result = arr.reduce((total, singleArr) => {
  return total + singleArr[1].value;
}, 0);

// output result
// 6

reduce를 사용할지 어레이 함수 map()을 사용할지는 사용자와 원하는 작업에 따라 달라집니다.

Object.protype을 확장합니다.

Object.prototype.reduce = function( reduceCallback, initialValue ) {
    var obj = this, keys = Object.keys( obj );

    return keys.reduce( function( prevVal, item, idx, arr ) {
        return reduceCallback( prevVal, item, obj[item], obj );
    }, initialValue );
};

사용 예

var dataset = {
    key1 : 'value1',
    key2 : 'value2',
    key3 : 'value3'
};

function reduceFn( prevVal, key, val, obj ) {
    return prevVal + key + ' : ' + val + '; ';
}

console.log( dataset.reduce( reduceFn, 'initialValue' ) );
'Output' == 'initialValue; key1 : value1; key2 : value2; key3 : value3; '.

즐거운 시간 되세요!;-)

제너레이터 표현식(현재 몇 년 동안 모든 브라우저 및 노드에서 지원됨)을 사용하여 목록에서 키와 값의 쌍을 가져올 수 있습니다.

>>> a = {"b": 3}
Object { b=3}

>>> [[i, a[i]] for (i in a) if (a.hasOwnProperty(i))]
[["b", 3]]

어레이를 사용할 수 있는 경우 어레이의 길이와 순서는 절반입니다.

function reducer(obj, fun, temp){
    if(typeof fun=== 'function'){
        if(temp== undefined) temp= '';
        for(var p in obj){
            if(obj.hasOwnProperty(p)){
                temp= fun(obj[p], temp, p, obj);
            }
        }
    }
    return temp;
}
var O={a:{value:1},b:{value:2},c:{value:3}}

reducer(O, function(a, b){return a.value+b;},0);

/* 반환된 값: (숫자) 6 * /

이것은, 자신을 실장하는 것은 그다지 어려운 일이 아닙니다.

function reduceObj(obj, callback, initial) {
    "use strict";
    var key, lastvalue, firstIteration = true;
    if (typeof callback !== 'function') {
        throw new TypeError(callback + 'is not a function');
    }   
    if (arguments.length > 2) {
        // initial value set
        firstIteration = false;
        lastvalue = initial;
    }
    for (key in obj) {
        if (!obj.hasOwnProperty(key)) continue;
        if (firstIteration)
            firstIteration = false;
            lastvalue = obj[key];
            continue;
        }
        lastvalue = callback(lastvalue, obj[key], key, obj);
    }
    if (firstIteration) {
        throw new TypeError('Reduce of empty object with no initial value');
    }
    return lastvalue;
}

동작 중:

var o = {a: {value:1}, b: {value:2}, c: {value:3}};
reduceObj(o, function(prev, curr) { prev.value += cur.value; return prev;}, {value:0});
reduceObj(o, function(prev, curr) { return {value: prev.value + curr.value};});
// both == { value: 6 };

reduceObj(o, function(prev, curr) { return prev + curr.value; }, 0);
// == 6

오브젝트 프로토타입에 추가할 수도 있습니다.

if (typeof Object.prototype.reduce !== 'function') {
    Object.prototype.reduce = function(callback, initial) {
        "use strict";
        var args = Array.prototype.slice(arguments);
        args.unshift(this);
        return reduceObj.apply(null, args);
    }
}

이거 드셔보세요.다른 변수에서 숫자를 정렬합니다.

const obj = {
   a: 1,
   b: 2,
   c: 3
};
const result = Object.keys(obj)
.reduce((acc, rec) => typeof obj[rec] === "number" ? acc.concat([obj[rec]]) : acc, [])
.reduce((acc, rec) => acc + rec)

어레이로 취급하는 것이 훨씬 간단함

과일의 총량을 반환합니다.

let fruits = [{ name: 'banana', id: 0, quantity: 9 }, { name: 'strawberry', id: 1, quantity: 1 }, { name: 'kiwi', id: 2, quantity: 2 }, { name: 'apple', id: 3, quantity: 4 }]

let total = fruits.reduce((sum, f) => sum + f.quantity, 0);

아직 답변이 확정되지 않았기 때문에 언더스코어의reduce이 경우에도 효과가 있습니다.

_.reduce({ 
    a: {value:1}, 
    b: {value:2}, 
    c: {value:3} 
}, function(prev, current){
    //prev is either first object or total value
    var total = prev.value || prev

    return total + current.value
})

메모,_.reduce목록 객체에 항목이 1개만 있는 경우 반복 함수를 호출하지 않고 유일한 값(개체 또는 기타)을 반환합니다.

_.reduce({ 
    a: {value:1} 
}, function(prev, current){
    //not called
})

//returns {value: 1} instead of 1

이 단일 라이너 화살표 기능을 사용해 보십시오.

Object.values(o).map(a => a.value, o).reduce((ac, key, index, arr) => ac+=key)

언급URL : https://stackoverflow.com/questions/15748656/javascript-reduce-on-object