通过实例了解JS 连续赋值

这篇文章主要介绍了通过实例了解JS 连续赋值,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下

问题:

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

根据js引擎语法解析,会先去从左到右寻找有没有未声明的变量,如果有就把该变量提升至作用域顶部并声明该变量。那么恭喜js引擎他找到a.x这个属性没有声明,那么他会在{n: 1}这个内存区声明一个x属性等待赋值!

语法解析完成后,开始进行运算(ps:赋值运算),首先将a变量的指针指向了一个新的内存区{n: 2},那么a变量脱离了对内存区{n: 1}的引用关系。

但是此时{n:1 }这个内存区并没有被GC回收因为b变量的指针依然指向它。并且因为之前就声明了x属性所以该内存区
增加了X属性。那么X属性指向哪儿呢?a.x = a = {n: 2}它的返回值就是{n: 2}的内存区。

那么根据图上可得:

a.x 不存在,故: => undefined

b.x => {n: 2}

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持我们。

(0)

相关推荐

  • 写了10年的Javascript也未必全了解的连续赋值运算

    一.引子 复制代码 代码如下: var a = {n:1}; a.x = a = {n:2}; alert(a.x); // --> undefined 这是蔡蔡在看 jQuery源码 时发现这种写法的.以上第二句 a.x = a = {n:2} 是一个连续赋值表达式.这个连续赋值表达式在引擎内部究竟发生了什么?是如何解释的? 二.猜想 猜想1:从左到右赋值,a.x 先赋值为{n:2},但随后 a 赋值为 {n:2},即 a 被重写了,值为 {n:2},新的 a 没有 x属性,因此为undefi

  • Javascript表达式中连续的 && 和 || 之赋值区别

    代码如下: 复制代码 代码如下: function write(msg){ for(var i = 0; i < arguments.length; i ++){ document.write(arguments[i] + '<br />'); } } //关于 '&&' test1 = 1 && 2 && 3 && 4; test2 = '0' && 2 && 3 && 4;

  • JavaScript中的连续赋值问题实例分析

    本文实例讲述了JavaScript中的连续赋值问题.分享给大家供大家参考,具体如下: JavaScript中的连续赋值: <script> var a = {n: 1} var b = a; a.x = a = {n: 2} console.log(a.x);//undefined console.log(b.x)//Object {n: 2} </script> Javascript中赋值运算符"="的优先级是除了","以外最低的,并且是从

  • js 连续赋值的简单实现

    无意中网上发现的这个问题,预想的结果和真实的结果大相径庭. var a={n:1} var b=a; a.x=a={n:2} console.log(a.x); console.log(b.x); undefined Object{n:2} 要是拆开来看,结果就是我所想的那样 var a={n:1} var b=a; a={n:2}: a.x={n:2} console.log(a.x);//Object{n:2}console.log(b.x);//undefined 分析: a.x=a={n

  • javascript连续赋值问题

    前几天在搜索面试题时发现了这么一段代码,执行完后感觉完全不与所想的一样 var a = { n : 1 }; var b = a; a.x = a = {n : 2}; console.log(a.x); console.log(b.x); 输出结果为: undefined [object Object] 一开始以为语句应该是先给 a 赋值 {n : 2} , 然后再将 a.x 赋值 {n : 2} ; 但事实却不是那样,于是改动了一下代码,添加几条log var test; var a = {

  • javascript实现连续赋值

    最近项目接触,时间比较充足,到网上逛逛了逛无意中在网上发现了这个问题,预知的结果和真实结果相差太大. 请看下面代码 var a={n:1} var b=a; a.x=a={n:2} console.log(a.x); console.log(b.x); undefined Object{n:2} 如果把代码拆开来看,结果就是我们所想的那样 var a={n:1} var b=a; a={n:2}: a.x={n:2} console.log(a.x);//Object{n:2} console.

  • js中变量的连续赋值(实例讲解)

    今天遇到了一个连续赋值的经典案例,网友们给出的答案也是五花八门,看起来有些繁琐,我也来说说自己的看法. 下面就是这个经典案例: 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

  • 通过实例了解JS 连续赋值

    这篇文章主要介绍了通过实例了解JS 连续赋值,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下 问题: var a = {n: 1}; var b = a; a.x = a = {n: 2}; console.log(a.x); //undfined console.log(b.x); //{a:2} 根据js引擎语法解析,会先去从左到右寻找有没有未声明的变量,如果有就把该变量提升至作用域顶部并声明该变量.那么恭喜js引擎他找到a.x这个属性没有声

  • 实例讲解JS中setTimeout()的用法

    本文实例讲解了JS中setTimeout()的用法,分享给大家供大家参考,具体内容如下 效果图: 具体代码: <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>无标题文档</title> <script type="text/javascript"&

  • 实例分析JS与Node.js中的事件循环

    这两天跟同事同事讨论遇到的一个问题,js中的event loop,引出了chrome与node中运行具有setTimeout和Promise的程序时候执行结果不一样的问题,从而引出了Nodejs的event loop机制,记录一下,感觉还是蛮有收获的 console.log(1) setTimeout(function() { new Promise(function(resolve, reject) { console.log(2) resolve() }) .then(() => { con

  • 实例分析js事件循环机制

    本文通过实例给大家详细分析了JS中事件循环机制的原理和用法,以下是全部内容: var start = new Date() setTimeout(function () { var end = new Date console.log('Time elapsed:', end - start, 'ms') }, 500) while (new Date() - start < 1000) { } 有其他语言能完成预期的功能吗?Java, 在Java.util.Timer中,对于定时任务的解决方案

  • 详解一个小实例理解js原型和继承

    导语1:一个构造函数的原型对象,其实就是这个构造函数的一个属性而已,属性名叫prototype,值是一个对象,对象中有一些属性和方法,所以每个构造函数的实例对象都拥有这些属性和方法的使用权. 导语2:构造函数需要用 new 操作符来调用,它本身没有任何意义,只有实例化后才有生命,当然你也可以把它当普通函数使用,那this就是指向window了(意义不大). 导语3:对于构造函数实例化出一个对象经历了什么? 我们看下面这个例子: 这个例子充分说明了,大佬们创造出构造函数这种东西,是有特殊用处的,本

  • 通过实例了解js函数中参数的传递

    先看一道JS的笔试题: var setObj=function(o){ o.name="xiaoming"; o={}; o.name="xiaohong"; } var p={name:"xixi",age:24}; setObj(p); console.log(p); 答案是{name:xiaoming,age24}: 在JavaScript中函数参数默认为引用类型. 一.函数传递值类型: 代码实例如下: function addNum(nu

  • 实例浅析js的this

    js的this是什么?关于这个东西,博客园里面有太多的解释了,不过,本人看了一下,感觉对this解释的有点复杂了,因此,本人在此给this一个简单易于理解的定义. this其实是js的一个对象,至于是什么对象呢?很简单,this这个对象就是:谁调用它它就指向谁. 关于这一点,其实,博客园的文章已经说明了很多了,有的文章也说到了点子上,只不过,他们解释的还是有点模糊,这里,我给大家做几个简单的对照实验,根据这几个对照实验的结果,大家应该很清楚了. 希望大家根据我的代码重复实现下面的实验. 首先,我

  • 实例分析js和C#中使用正则表达式匹配a标签

    废话不多说,都在代码中,直接上 JS代码: 复制代码 代码如下: <html> <head> <script language="javascript">     var a='<P><A href=\'~abc/ccg/ab.jpg\' width="3">文字</A><A width="4" style="color:#ddd; font-weight:b

  • js获取url参数代码实例分享(JS操作URL)

    代码很简单,主要一个思路是把url参数解析为js对象,再做增.删.改.查操作就很方便了~,这里做笔记. 复制代码 代码如下: var LG=(function(lg){    var objURL=function(url){        this.ourl=url||window.location.href;        this.href="";//?前面部分        this.params={};//url参数对象        this.jing="&quo

随机推荐