キーをマージしてその値をJavascriptで追加する方法はありますか

Question

私は戻って、私はこれを取得、データベースから自分のデータを取得するとそう：

{ 
"times": [ 
    { 
     "userName": "jon", 
     "gameName": "halo", 
     "time": "00.00.06" 
    }, 
    { 
     "userName": "jon", 
     "gameName": "call of duty", 
     "time": "00.00.05" 
    }, 
    { 
     "userName": "cody", 
     "gameName": "thing1", 
     "time": "00.00.07" 
    }, 
    { 
     "userName": "jon", 
     "gameName": "war game", 
     "time": "00.00.08" 
    }, 
    { 
     "userName": "jon", 
     "gameName": "a game 22", 
     "time": "00.00.08" 
    }, 
    { 
     "userName": "jon", 
     "gameName": "monster", 
     "time": "00.00.05" 
    }, 
    { 
     "userName": "jon", 
     "gameName": "call of duty", 
     "time": "00.00.06" 
    }, 
    { 
     "userName": "jon", 
     "gameName": "war game", 
     "time": "00.00.03" 
    }, 
    { 
     "userName": "guy", 
     "gameName": "game1", 
     "time": "00.00.03" 
    }, 
    { 
     "userName": "fun", 
     "gameName": "My Game", 
     "time": "00.00.05" 
    }, 
    { 
     "userName": "jon", 
     "gameName": "Horizon: Zero Dawn", 
     "time": "00.00.10" 
    }, 
    { 
     "userName": "jon", 
     "gameName": "Horizon: Zero Dawn", 
     "time": "00.02.10" 
    }, 
    { 
     "userName": "jon", 
     "gameName": "Paragon", 
     "time": "00.00.07" 
    }, 
    { 
     "userName": "jon", 
     "gameName": "Paragon", 
     "time": "00.00.11" 
    }, 
    { 
     "userName": "jon", 
     "gameName": "halo", 
     "time": "00.00.05" 
    } 
] 

}

私は、各ゲームのためのすべての「時間」を合計し、そのように表示できるようにしたい： "GameName"： "すべての時間が特定のゲームのために集計されました"

これを実行する方法はありますか？

Answer 1

あなたの配列をループし、各項目のtimeプロパティにアクセスし、それぞれの量を追加します。この

var total; 
for (var i = 0; i < times.length; i++) { 
    var itemTime = times[i].time; 
    //parse time into int or date before adding otherwise it'll concatenate the string 
    total += itemTime; 

}

に似

何かが、あなたは時間を表示すると役立ちますまたは少なくとも値

var element = document.getElementById("idOfElementToDisplayTotalTime"); 
    element.innerHTML = "All times summed: " + total; 

希望を集合sれている要素を取得しますあなたを正しい方向に向ける。私は私の携帯電話でこれを入力したとして、どんなタイプミスや怠け者も申し訳ありません。

Answer 2

これは、リデューサ機能にとって完璧な状況です。私は下に実行可能なスニペットを追加しましたが、関連するコードは次のとおりです。

const parseSeconds = timeStr => { 
    const regex = /(\d\d)\.(\d\d)\.(\d\d)/; 
    const [original, hours, mins, secs] = regex.exec(timeStr); 
    return (3600 * hours) + (60 * mins) + Number(secs); 
} 

const r = data.times 
.map(({ gameName, time }) => ({ 
    gameName, 
    time: parseSeconds(time) 
})) 
.reduce((results, { gameName, time }) => { 
    if (!results.hasOwnProperty(gameName)) { 
     results[gameName] = 0; 
    } 
    results[gameName] += time; 
    return results; 
}, {}); 

const data = { 
 
\t "times": [ 
 
{ 
 
    "userName": "jon", 
 
    "gameName": "halo", 
 
    "time": "00.00.06" 
 
}, 
 
{ 
 
    "userName": "jon", 
 
    "gameName": "call of duty", 
 
    "time": "00.00.05" 
 
}, 
 
{ 
 
    "userName": "cody", 
 
    "gameName": "thing1", 
 
    "time": "00.00.07" 
 
}, 
 
{ 
 
    "userName": "jon", 
 
    "gameName": "war game", 
 
    "time": "00.00.08" 
 
}, 
 
{ 
 
    "userName": "jon", 
 
    "gameName": "a game 22", 
 
    "time": "00.00.08" 
 
}, 
 
{ 
 
    "userName": "jon", 
 
    "gameName": "monster", 
 
    "time": "00.00.05" 
 
}, 
 
{ 
 
    "userName": "jon", 
 
    "gameName": "call of duty", 
 
    "time": "00.00.06" 
 
}, 
 
{ 
 
    "userName": "jon", 
 
    "gameName": "war game", 
 
    "time": "00.00.03" 
 
}, 
 
{ 
 
    "userName": "guy", 
 
    "gameName": "game1", 
 
    "time": "00.00.03" 
 
}, 
 
{ 
 
    "userName": "fun", 
 
    "gameName": "My Game", 
 
    "time": "00.00.05" 
 
}, 
 
{ 
 
    "userName": "jon", 
 
    "gameName": "Horizon: Zero Dawn", 
 
    "time": "00.00.10" 
 
}, 
 
{ 
 
    "userName": "jon", 
 
    "gameName": "Horizon: Zero Dawn", 
 
    "time": "00.02.10" 
 
}, 
 
{ 
 
    "userName": "jon", 
 
    "gameName": "Paragon", 
 
    "time": "00.00.07" 
 
}, 
 
{ 
 
    "userName": "jon", 
 
    "gameName": "Paragon", 
 
    "time": "00.00.11" 
 
}, 
 
{ 
 
    "userName": "jon", 
 
    "gameName": "halo", 
 
    "time": "00.00.05" 
 
} 
 
] 
 
}; 
 

 
const parseSeconds = timeStr => { 
 
\t const regex = /(\d\d)\.(\d\d)\.(\d\d)/; 
 
\t const [original, hours, mins, secs] = regex.exec(timeStr); 
 
\t return (3600 * hours) + (60 * mins) + Number(secs); 
 
} 
 

 
const r = data.times 
 
.map(({ gameName, time }) => ({ 
 
gameName, 
 
time: parseSeconds(time) 
 
})) 
 
.reduce((results, { gameName, time }) => { 
 
if (!results.hasOwnProperty(gameName)) { 
 
\t results[gameName] = 0; 
 
} 
 
results[gameName] += time; 
 
return results; 
 
}, {}); 
 

 
console.log(r);

Answer 3

そうようにあなたはJavascriptのArray.prototoype.reduceメソッドを使用することができます。

const gameTimes = data.times.reduce(function(totalTimes, item) { 
    if (!totalTimes.hasOwnProperty(item.gameName)) { 
     totalTimes[item.gameName] = 0; 
    } 
    totalTimes[item.gameName] += item.time; 
    // you'll notice that I just directly added the time above, but your time 
    // is formatted as e.g. "00.00.10". You'll have to come up with a way to 
    // add times that are formatted in that way. The previous line just shows 
    // where you should update the total time. :) 
    return totalTimes; 
}, {}); 

/* 
gameTimes => { 
    "Call of Duty": "00.00.10", 
    "Horizon: Zero Dawn": "00.10.00", 
    ... 
} 
*/ 

これは、になりますキーはゲームの名前であり、値は合計時間です。コードスニペットのコメントに記載されているように、00.00.10のような時間形式に基づいて時刻を追加する方法を見つける必要があります。 :)

Answer 4

希望の出力を得るためにlodashを使うことができます。

const obj = { 
 
"times": [ 
 
    { 
 
     "userName": "jon", 
 
     "gameName": "halo", 
 
     "time": "00.00.06" 
 
    }, 
 
    { 
 
     "userName": "jon", 
 
     "gameName": "call of duty", 
 
     "time": "00.00.05" 
 
    }, 
 
    { 
 
     "userName": "cody", 
 
     "gameName": "thing1", 
 
     "time": "00.00.07" 
 
    }, 
 
    { 
 
     "userName": "jon", 
 
     "gameName": "war game", 
 
     "time": "00.00.08" 
 
    }, 
 
    { 
 
     "userName": "jon", 
 
     "gameName": "a game 22", 
 
     "time": "00.00.08" 
 
    }, 
 
    { 
 
     "userName": "jon", 
 
     "gameName": "monster", 
 
     "time": "00.00.05" 
 
    }, 
 
    { 
 
     "userName": "jon", 
 
     "gameName": "call of duty", 
 
     "time": "00.00.06" 
 
    }, 
 
    { 
 
     "userName": "jon", 
 
     "gameName": "war game", 
 
     "time": "00.00.03" 
 
    }, 
 
    { 
 
     "userName": "guy", 
 
     "gameName": "game1", 
 
     "time": "00.00.03" 
 
    }, 
 
    { 
 
     "userName": "fun", 
 
     "gameName": "My Game", 
 
     "time": "00.00.05" 
 
    }, 
 
    { 
 
     "userName": "jon", 
 
     "gameName": "Horizon: Zero Dawn", 
 
     "time": "00.00.10" 
 
    }, 
 
    { 
 
     "userName": "jon", 
 
     "gameName": "Horizon: Zero Dawn", 
 
     "time": "00.02.10" 
 
    }, 
 
    { 
 
     "userName": "jon", 
 
     "gameName": "Paragon", 
 
     "time": "00.00.07" 
 
    }, 
 
    { 
 
     "userName": "jon", 
 
     "gameName": "Paragon", 
 
     "time": "00.00.11" 
 
    }, 
 
    { 
 
     "userName": "jon", 
 
     "gameName": "halo", 
 
     "time": "00.00.05" 
 
    } 
 
]}; 
 
const times = _.groupBy(obj.times, "gameName"); 
 
let game_times = {}; 
 
for(key in times){ 
 
    game_times[key] = _.reduce(times[key], (sum, time)=> { 
 
    time = time.time.split("."); 
 
    sum = sum.split("."); 
 
    let total = ""; 
 
    let ss = parseInt(sum[2]) + parseInt(time[2]); 
 
    let mm = parseInt(sum[1]) + parseInt(time[1]); 
 
    let hh = parseInt(sum[0]) + parseInt(time[0]); 
 
    mm += parseInt(ss/60); 
 
    hh += parseInt(mm/60); 
 
    ss = ss % 60; 
 
    return hh + "." + mm + "." + ss; 
 
    },"00.00.00"); 
 
} 
 
console.log(game_times);

<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.4/lodash.min.js"></script>