今天遇到了一个连续赋值的经典案例,网友们给出的答案也是五花八门,看起来有些繁琐,我也来说说自己的看法。

  下面就是这个经典案例:

var a = {n: 1};
var b = a;
a.x = a = {n: 2};
console.log(a);
console.log(b);
console.log(a.x);
console.log(b.x); 

  我们先来看一下普通连续赋值,即:变量赋值的类型是数据类型值

    var a=3;
var b=a=5;
console.log(a);
console.log(b);

  一般来说,等号赋值的方向是从右至左,那么上面的代码等同于下面这段代码,那么我们就用下面这段代码来解释上面的代码:

    var a=3;  //全局变量a被赋值为3
var a=5;  //此时a被重新赋值为5
var b=a;  //将a的值赋给全局变量b
  console.log(a);//a最终的值就是第二次被赋的值:5
  console.log(b);//按照代码执行顺序b的值也是:5

  上面的小案例用来抛砖引玉,现在我们来分析这个经典案例:

var a = {n: 1};//a第一次被赋值,是一个引用类型值,请记得变量赋值为引用类型值的时候,通过变量改变这个对象的时候,对象本身也发生了变化
var b = a;//b被赋值为a,因此b就是对象{n:1}
a.x = a = {n: 2};
//这个赋值与之前的简单案例有所不同,a.x指的是给a添加一个x属性,在js的运算中“.”和"="运算符同时出现,会先执行"."运算
//因此,赋值顺序被改变了,是先给a.x赋值,再给a赋值
//就是先执行:a.x={n:2},注意这里a并未改变,是给a的x属性赋值为{n:2},a还是{n:1}
//再回到我代码中的第一句话,这个赋值行为,改变了{n:1}这个对象,即给它增加了名为x的属性
//再执行a={n:2},这是变量a不再是对象{n:1},而被重新赋值为一个新的对象{n:2}; console.log(a);//自然此时a是对象{n:2}
console.log(b);//a的二次赋值,并没有影响b,b还是对象{n:1},但是由于a在重新赋值之前,给{n:1}这个对象,增加了一个x属性,因此,这时的b已经有了x属性
console.log(a.x);//{n:2}对象没有x属性,所以结果是undefined
console.log(b.x);//综上所述,这个结果是{n:2}   

  不知道您理解了吗?为了照顾初学者我用了最简单易懂甚至有些啰嗦的话来解释我对这个案例的认识,欢迎有识之士点评和交流!

 

js中变量的连续赋值的更多相关文章

  1. js中变量的声明

    大家都知道js中变量的声明是要提前的,下面有4个样例: 1.if(!"t" in window){  var t = 1; }       alert(t);答案是undefine ...

  2. js中变量的作用域、变量提升、链式作用域结构

    一:作用域 在ES6之前,javascript没有块级作用域(一对{}即为一个块级作用域),只有全局作用域和函数作用域(局部),因此,对应的有全局变量和局部变量.在函数内部可以访问到全局变量,但在函数 ...

  3. JS中变量的存储

    JS中的变量是保存在栈内存中的 基本数据类型的值直接在栈内存中存储: 值与值之间是独立存在的,修改一个变量不会影响其他变量: var a=20; var b=a; a++; 对象(引用数据类型)是保存 ...

  4. js中变量提升(一个是变量,一个是函数表达式都会存在变量提升,函数声明不存在)

    一.变量提升 在ES6之前,JavaScript没有块级作用域(一对花括号{}即为一个块级作用域),只有全局作用域和函数作用域.变量提升即将变量声明提升到它所在作用域的最开始的部分.上个简历的例子如: ...

  5. js中变量声明有var和没有var的区别

    转js中var用与不用的区别 2015年07月13日 16:08:22 阅读数:3627 Javascript声明变量的时候,虽然用var关键字声明和不用关键字声明,很多时候运行并没有问题,但是这两种 ...

  6. JS中变量的命名规范

    命名规范 包含数字.字母.下划线和$,但 不能以数字开头 变量名严格区分大小写 变量名不能是关键字和保留字 变量名要见名知意 如果变量名有多个单词组成,推荐使用 小驼峰命名法 命名时,尽量使用英语,如 ...

  7. js中变量base64加密传输

    首先对base64进行定义: var Base64 = { _keyStr : "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz01 ...

  8. 关于js中变量声明和作用域的理解

    1. var是声明一个变量:虽然声明了这个变量,但在存入值之前,它的初始值是 undefined:2.全局变量:拥有全局作用域,在js代码中的任何地方都是有定义的:3.局部变量:在函数内声明的变量只在 ...

  9. 关于JS中变量提升的规则和原理的一点理解

        关于变量提升,以前在一些教程和书籍上都听到过,平时开发中也知道有这个规律,但是今天突然在一个公开课中听到时,第一反应时一脸懵逼,然后一百度,瞬间觉得好熟悉啊,差点被这个概念给唬住了,不信我给你 ...

随机推荐

  1. 发布支持多线程的PowerShell模块 —— MultiThreadTaskRunner

    应用场景 多线程在需要批量处理一些任务的时候相当有用,也更加有利于充分利用现有计算机的能力.所有主流的开发语言都支持多线程. 默认情况下,PowerShell作为一个脚本语言,是不支持多线程操作的,虽 ...

  2. 原生js实现图片网格式渐显、渐隐效果

    写正文前先吐槽一下:端午放假完第一天去某千人以上公司面试前端工程师,第一轮是我应聘职位的部门小领导,谈的不错,面试主要围绕要用到的技术来:第二轮来了我要说的正主,我了个去,问的问题一个和前端无关,问我 ...

  3. JDBC连接数据库程序

    废话少说,看了尚学堂的视频以及某大神的博客,总结出以下.(本文以oracle数据库为例) 创建一个JDBC连接数据库的程序,需要着手做以下几件事情: 注意,这里边使用了java.sql.Stateme ...

  4. 泛型(java菜鸟的课堂笔记)

                1. 泛型的简单运 用和意义   2. 泛型的上限与下限   3. 泛型和 子类继承的限制   4. 泛型类和泛型 方法   5. 泛型嵌套和泛型擦除             ...

  5. ViewModel从未如此清爽 - 轻量级WPF MVVM框架Stylet

    Stylet是我最近发现的一个WPF MVVM框架, 在博客园上搜了一下, 相关的文章基本没有, 所以写了这个入门的文章推荐给大家. Stylet是受Caliburn Micro项目的启发, 所以借鉴 ...

  6. Qt自定义标签按钮

    当你接触到Qt时,你会为它极为方便的跨平台方面感到吃惊,从而想尝试着使用Qt.渐渐地你会发现Qt自带的一些控件不能满足自己的需要,此时就需要我们自己定义一个属于自己的控件.总所周知,标签的风格设置类比 ...

  7. iter迭代器的应用

    迭代器是访问集合元素的一种方式.迭代器对象从集合的第一个元素开始访问,直到所有的元素被访问完结束. 用户不用关心迭代器的内部结构,仅需通过next方法不断去读取下一个内容 不能随机访问任意一个内容,只 ...

  8. Chapter 3:Speech Production and Perception

    作者:桂. 时间:2017-05-24  09:09:36 主要是<Speech enhancement: theory and practice>的读书笔记,全部内容可以点击这里. 一. ...

  9. ThinkPHP3.2 生成二维码

    下面是整合将phpqrcode整合到TP生成二维码就可以解决这个问题了.其实也很简单,使用方法如下:先下载附件解压至ThinkPHP/Extend/Vendor目录,目录不存在自己创建.      v ...

  10. ORA-12638: 身份证明检索失败 解决方法

    用PL/SQL或Navicat连接本地或远程Oracle数据库的时候报错:ORA-12638: 身份证明检索失败 解决方法: 开始 -> 所有程序 -> Oracle - Oracle_h ...