如何使用数组变量更新对象值？ （JavaScript）

Question

我有一个存储条形图值的对象变量和一个用于更新这些值的按钮：

 var config = {
       type: 'bar',
       data: {
       datasets: [{
       type: 'bar', label: 'Dataset 1',
       data: [0, 0, 0, 0, 0, 0, 0,       
              0, 0, 0, 0, 0, 0,
              0, 0, 0, 0, 0, 0]}]}};
                                        
document.getElementById('add5').addEventListener('click', function() {
 tnow = moment().format('HH');
 switch (tnow) {
    case'8':  config.data.datasets[0].data[0]  += 5; break;
    case'9':  config.data.datasets[0].data[1]  += 5; break;
    // ...
    case'23': config.data.datasets[0].data[15] += 5; break;
    case'24': config.data.datasets[0].data[16] += 5; break;
    default: alert('doot');}
 window.myLine.update()});

   <button id="add5">+5</button>

我试图将值指针存储为变量以缩短代码。试过了

var h = [];
var h = config.data.datasets[0].data.slice();

但是

case '23': h[15] += 5; break;

不更新条形图值。 alert(h[15])确实会返回准确的图表值。

如何使用数组变量更新图表值？

---

完整上下文：

使用moment.js和chart.js生成条形图，该条形图根据实时时钟更新值。例如：如果是晚上7:30，则单击“ +5”会将5添加到位于晚上7点的栏中。 case '8' = 8AM，case '23' = 11PM，依此类推。我打算添加第二个数据集，当值超过60时显示该数据集，使用if修改第二个数据集的值（涉及{{ 1}}多两次-使代码很冗长。

Answer 1

使用slice()时：

var h = config.data.datasets[0].data.slice();

您正在制作config.data.datasets[0].data的副本。然后，您可以在代码中更改该副本，但这对条形图没有影响，因为它不会更改原始数据：

let datasets = [{
    data: [1, 2, 3, 4, 5, 6]
}]
let h = datasets[0].data.slice()

h[0] ="What?"
console.log(h)                      // h has changed
console.log(datasets[0].data)       // original data is unchanged

console.log(h === datasets[0].data) // because they are not the same array

如果要缩短代码，只需引用不带slice()的数组即可：

var h = config.data.datasets[0].data

let datasets = [{
    data: [1, 2, 3, 4, 5, 6]
}]
let h = datasets[0].data

h[0] ="What?"
console.log(h)                      // h has changed
console.log(datasets[0].data)       // original data is also chaged

console.log(h === datasets[0].data) // because they ARE the same array