Question

JavaScript的：

var songs = {};
var song = {};
var row = 0;
$('button').on('click', function(){
  row++
  song['name'] = 'hey' + row;
  songs['row' + row] = song;
  console.log(songs);
});

每当我点击按钮时，它应该创建一个新的['name']并将其推送到对象'songs'。点击5次后，我希望对象看起来像这样：

{   "row1": {
        "name": "hey1"
    },
    "row2": {
        "name": "hey2"
    },
    "row3": {
        "name": "hey3"
    },
    "row4": {
        "name": "hey4"
    }
    "row5": {
        "name": "hey5"
    }
}

但它看起来像这样

{   "row1": {
        "name": "hey5"
    },
    "row2": {
        "name": "hey5"
    },
    "row3": {
        "name": "hey5"
    },
    "row4": {
        "name": "hey5"
    }
    "row5": {
        "name": "hey5"
    }
}

我认为它与

有关

songs['row' + row] = song;

https://jsfiddle.net/yhk81zbu/3/

为什么这不起作用，我该如何解决？

Answer 1

您只有一个歌曲对象的实例在第1行，第2行，第3行等中共享。每当您撰写song['name'] = 'hey' + row;时，您都需要修改＆＃39;名称＆＃39 ;一个歌曲对象的字段，记住由所有行共享。你必须确保每次都创建一个新的歌曲对象，而不是song['name'] = 'hey' + row;你可以写var song = {'name' : 'hey' + row };，这样每一行都有自己的歌曲对象而不是共享一个。

var songs = {}
var row = 0;
$('button').on('click', function(){
  row++
  var song = {'name' : 'hey' + row };
  songs['row' + row] = song;
  console.log(songs);
});

Answer 2

您正在将具有一个属性的对象存储到歌曲对象中的连续命名属性中。但是，在循环中，您正在更新同一个全局歌曲对象的相同属性，因此歌曲对象属性的所有实例/副本都是名称＆＃39;反映了循环中的最新变化。而是写一些像：

var songs = {};
//don't define your object here
var song;
var row = 0;
var songtext;
$('#button').on('click', function(){
  row++;
  songText = 'hey' + row;
  //create a new object each time instead of trying to update the same 'name' property
  //of the global song object
  song = {name: songText};
  songs['row' + row] = song;
  console.log(songs);
});

在JavaScript中推送对象无法正常工作

2 个答案: