今天遇到一个坑,具体的不多说,直接上代码

var a = [ [],[],[1,2,3] ]

var b = ['颜色','大小','尺寸']

var arr = []
for(let i = 0; i < a.length; i ++){
let obj = {}
for(let j = 0; j < a[i].length; j ++){
obj[b[i]] = a[i][j]
arr.push(obj)
console.log(arr)
console.log(obj)
} }
console.log(arr)

我预期的 arr 的结果应该是

[ { '尺寸': 1 }, { '尺寸': 2 }, { '尺寸': 3 } ]

最后arr的结果居然是这样的

[ { '尺寸': 3 }, { '尺寸': 3 }, { '尺寸': 3 } ]

在一个基友群里问,最后终于自己得出结论了——这是因为值类型和引用类型不同的原因。

在JavaScript里的值大概分为两种,一种是值类型,一种是引用类型。

值类型:数值、布尔值、null、undefined

引用类型:对象、数组、函数

我们例子中的obj虽然每次打印出来都是不同的,但是因为是引用类型,arr也是引用类型,即使obj  push到arr里面了,也只是push进去了一个内存地址而已,所以最后obj变成3了,arr里面引用的obj也会全部变成3。很神奇吧,最后解决的办法也很简单

var a = [ [],[],[1,2,3] ]

var b = ['颜色','大小','尺寸']

var arr = []
for(let i = 0; i < a.length; i ++){
for(let j = 0; j < a[i].length; j ++){
let obj = {}
obj[b[i]] = a[i][j]
arr.push(obj)
} }
console.log(arr)

只要把obj的声明放在最内层的循环里面,每次循环都会是单独的一个内存地址,这样最后的obj即使变成了3,前面的obj也不会被影响到,因为他们的内存地址根部不同。

JavaScript 值类型和引用类型的初次研究的更多相关文章

  1. JavaScript值类型和引用类型有哪些

    JavaScript值类型和引用类型有哪些 (1)值类型:数值.布尔值.null.undefined. (2)引用类型:对象.数组.函数.

  2. javascript 值类型与引用类型

    写的比较简单哈,只是用来记忆下 (1)值类型:undefined.null.Boolean.Number和String (2)引用类型:对象.数组.函数

  3. javascript 值类型和引用类型

    值类型 1. 值类型:string/number/boolean/undefined: 2. 存储:值类型的数据,存储的是数据本身的变量: 3. 赋值:直接将存储的数据复制一份进行赋值,两份数据在内存 ...

  4. js值类型与引用类型

    JavaScript值类型和引用类型有哪些 (1)值类型:数值.布尔值.null.undefined. (2)引用类型:对象.数组.函数. 三.如何理解值类型和引用类型及举例 我们可以用“连锁店”和“ ...

  5. JavaScript中值类型和引用类型的区别

    JavaScript的数据类型分为两类:原始类型和对象类型.其中,原始类型包括:数字.字符串和布尔值.此外,JavaScript中还有两个特殊的原始值:null和undefined,它们既不是数字也不 ...

  6. JavaScript中值类型与引用类型

    JavaScript中的变量类型有哪些? 值类型:字符串(string).数值(number).布尔值(boolean).null.undefined 引用类型:对象(Object).数组(Array ...

  7. [No0000B9]C# 类型基础 值类型和引用类型 及其 对象复制 浅度复制vs深度复制 深入研究2

    接上[No0000B5]C# 类型基础 值类型和引用类型 及其 对象判等 深入研究1 对象复制 有的时候,创建一个对象可能会非常耗时,比如对象需要从远程数据库中获取数据来填充,又或者创建对象需要读取硬 ...

  8. [No0000B5]C# 类型基础 值类型和引用类型 及其 对象判等 深入研究1

    引言 本文之初的目的是讲述设计模式中的 Prototype(原型)模式,但是如果想较清楚地弄明白这个模式,需要了解对象克隆(Object Clone),Clone其实也就是对象复制.复制又分为了浅度复 ...

  9. String为值类型还是引用类型

    关于String为值类型还是引用类型的讨论一直没有平息,最近一直在研究性能方面的问题,今天再次将此问题进行一次明确.希望能给大家带来点帮助. 如果有错误请指出. 来看下面例子: //值类型 int a ...

随机推荐

  1. poj2976(01分数规划)

    poj2976 题意 给出 a b 数组,一共 n 对数,其中最多可以去掉 k 对,问怎样使剩下比率(原始比率是 $ \frac{\sum_{i=1}^{n} a}{\sum_{i=1}^{n} b} ...

  2. linux中的重要目录

    1./boot 引导程序,内核的存放的目录. 此目录,包含了在引导过程中所必须的文件,引导程序的相关文件(如:grub,lilo以及相应的配置文件及linux操作系统内核相关文件). 2./sbin/ ...

  3. 《孵化twitter》读书笔记

    寒假在家看完了第一本书——<孵化twitter:从蛮荒到IPO的狂野旅程>.在2014上半年,尝试看了该书的英文原版,奈何自己英语太菜,实在看不懂.这次有了中文版,就决定要看看.该书对于我 ...

  4. Top 10 JavaScript编辑器,你在用哪个?

    对于JavaScript程序员来说,目前有很多很棒的工具可供选择.文本将会讨论10个优秀的支持JavaScript,HTML5和CSS开发,并且可以使用Markdown进行文档编写的文本编辑器.为什么 ...

  5. .NET链接Oracle 参数绑定问题

    在.NET项目中链接Oracle使用的驱动是 Oracle.ManagedDataAccess.dll ,这里下载 所遇到的问题 使用存储过程一个参数没有问题,发现两个或两个以上会有参数没传过来的现象 ...

  6. 用PHP和Ajax进行前后台数据交互——以用户登录为例

    很多网站中都有用户登录系统,要完成用户的注册和登陆,就一定要用到前后台的数据交互.在这里以简单的用户注册和登陆为例介绍一下前后台交互的大致流程. 首先,我们来做一个简单的登陆界面. 这里为了方便我使用 ...

  7. wildfly10报错2:ID注释有错

    13:55:56,612 INFO [org.jboss.modules] (main) JBoss Modules version 1.5.1.Final 13:55:56,891 INFO [or ...

  8. mongodb取出最大值与最小值

    $res=self::aggregate([ ['$match'=>[ 'msg_id'=>1007, 'D'=>16, ]], ['$group'=>[ '_id'=> ...

  9. yii 输出当前的sql语句

    <?php namespace app\controllers; use yii\web\Controller; use yii\data\Pagination; use app\models\ ...

  10. Object-C知识点 (二) 控件的实用属性

    开发过程中的组件不常用但是很实用的属性!!!!!! p.p1 { margin: 0.0px 0.0px 0.0px 0.0px; font: 20.0px Menlo; color: #78492a ...