循环数组赋值给对象并push到数组中

3,977 阅读2分钟
var a = {b:[]};
var c = {
    name:'',
    age:'7'
};
var d = ['bj','sh','sz','gz']
for(var i in d){
    c.name = d[i];
    a.b.push(c)
}

如上图所示:

循环遍历数组d 并把每一项赋值给c.name 然后在push到a.b中

代码感觉没有问题但是经打印得出结果:

0:{name: "gz", age: "7"}

1:{name: "gz", age: "7"}

2:{name: "gz", age: "7"}

3:{name: "gz", age: "7"}

正确写法为:

var a = {b:[]};
var d = ['bj','sh','sz','gz']
for(var i in d){
    var c = {
        name:d[i],
        age:'7'
    };
    a.b.push(c)
}

得出正确结论:

0:{name: "bj", age: "7"}

1:{name: "sh", age: "7"}

2:{name: "sz", age: "7"}

3:{name: "gz", age: "7"}

解析:

object为引用数据类型,以上错误代码中只是操作了同一个地址中的name,c.name的值是一直在改变,a.b.push()的值为最后所得数据'gz'。

扩展 js基本数据类型和引用数据类型

基本数据类型:

Number、String 、Boolean、Null和Undefined。基本数据类型是按值访问的,因为可以直接操作保存在变量中的实际值。示例:

  var a = 10;

  var b = a;

  b = 20;

  console.log(a); // 10值

  上面,b获取的是a值得一份拷贝,虽然,两个变量的值相等,但是两个变量保存了两个不同的基本数据类型值。

  b只是保存了a复制的一个副本。所以,b的改变,对a没有影响。

  下图演示了这种基本数据类型赋值的过程:

引用数据类型:

也就是对象类型Object type,比如:Object 、Array 、Function 、Data等。

  javascript的引用数据类型是保存在堆内存中的对象。

  与其他语言的不同是,你不可以直接访问堆内存空间中的位置和操作堆内存空间。只能操作对象在栈内存中的引用地址。

  所以,引用类型数据在栈内存中保存的实际上是对象在堆内存中的引用地址。通过这个引用地址可以快速查找到保存中堆内存中的对象。

  var obj1 = new Object();

  var obj2 = obj1;

  obj2.name = "我有名字了";

  console.log(obj1.name); // 我有名字了

  说明这两个引用数据类型指向了同一个堆内存对象。obj1赋值给onj2,实际上这个堆内存对象在栈内存的引用地址复制了一份给了obj2,

  但是实际上他们共同指向了同一个堆内存对象。实际上改变的是堆内存对象。

  下面我们来演示这个引用数据类型赋值过程: