今天在微信群里有这样一个问题和大家分享一下:

附上源码:

function changeAgeAndReference(person){person . age = 25;person = {nage : 'John',age : 50};return person ;
}
var personObj1={name : 'Alex',age : 30
}
var personObj2 = changeAgeAndReference(personObj1);
console.log(personObj1)
console.log(personObj2)
复制代码

会输出什么呢?答案是:

{name: "Alex", age: 25}
{nage: "John", age: 50}
复制代码

要理解答案为什么是25和50 要理解Js变量赋值问题:

1. Js有两类数据类型:值类型(基本类型)和引用类型

值类型(基本类型):字符串(String)、数字(Number)、布尔(Boolean)、对空(Null)、未定义(Undefined)、Symbol
引用数据类型:对象(Object)、数组(Array)、函数(Function)。

基本数据类型是按值访问的,因为可以操作保存在变量中的实际的值; 引用类型的值是保存在内存中的对象,在操作对象时,实际上是在操作对象的引用而不是实际的对象

2. 变量复制

基本类型复制:举个栗子

var num1 = 5;
var num2 = num1;
复制代码

num1 中保存的值是 5。当使用 num1 的值来初始化 num2 时,num2 中也保存了值 5。但 num2 中的 5 与 num1 中的 5 是完全独立的,该值只是 num1 中 5 的一个副本。此后,这两个变量可以参与任 何操作而不会相互影响

引用类型复制:举个栗子

var obj1 = new Object();
var obj2 = obj1;
obj1.name = "Nicholas";
alert(obj2.name);
复制代码

变量 obj1 保存了一个对象的新实例。然后,这个值被复制到了 obj2 中;换句话说,obj1 和 obj2 都指向同一个对象。这样,当为 obj1 添加 name 属性后,可以通过 obj2 来访问这个属性, 因为这两个变量引用的都是同一个对象

现在让我们回到问题当中

function changeAgeAndReference(person){person . age = 25;person = {nage : 'John',age : 50};return person ;
}
var personObj1={name : 'Alex',age : 30
}
var personObj2 = changeAgeAndReference(personObj1);
console.log(personObj1)
console.log(personObj1)
复制代码

var personObj2 = changeAgeAndReference(personObj1) 相当于:

var person = personObj1
复制代码

personObj1person 都指向同一个对象,改变person的属性age也就改变了personObj1的age; 所以 personObj1 变为 {name: "Alex", age: 25}

函数内部:

person = {nage : 'John',age : 50
};
//相当于
var person = {nage : 'John',age : 50
};
复制代码

person被重新赋值,已经不指向之前的的对象了,所以return 的是 {nage: "John", age: 50}


文章参考:

《JavaScript 高级程序设计》中文译本 第三版

转载于:https://juejin.im/post/5becd0e9e51d4543cd17310c

问题分享:Js引用类型赋值相关推荐

  1. 引入js_好程序员web前端教程分享js中的模块化一

    好程序员web前端教程分享js中的模块化一:我们知道最常见的模块化方案有CommonJS.AMD.CMD.ES6,AMD规范一般用于浏览器,异步的,因为模块加载是异步的,js解释是同步的,所以有时候导 ...

  2. 好程序员web前端教程分享js中的模块化一

    好程序员web前端教程分享js中的模块化一:我们知道最常见的模块化方案有CommonJS.AMD.CMD.ES6,AMD规范一般用于浏览器,异步的,因为模块加载是异步的,js解释是同步的,所以有时候导 ...

  3. 好程序员web前端分享js剪切板Clipboard.js 使用

    好程序员web前端分享js剪切板Clipboard.js 使用,clipboard.js是一个用来设置剪切板的库,小巧无依赖,但用法有点诡异,必须依赖一个DOM元素. 必须要与一个DOM元素相关联,并 ...

  4. 网页空间php可以赋值,js如何赋值给php

    js变量赋值给php: js变量赋值给php,由于PHP是服务器语言要在后台运行,JS是客户端语言可以直接在浏览器上运行,所以js变量不能直接赋值给php,那么怎么样知道什么是服务器语言什么是客户端语 ...

  5. js代码赋值触发select控件的onchange事件

    嗯,现在在一个小公司实习,直接接触代码收获不小.  现在有个需求是4级联动的select过滤,需要js代码赋值并触发onchange来调用ajax方法,于是问题是怎样触发,找了些资料并且自己尝试了一下 ...

  6. 好程序员web前端分享JS引擎的执行机制

    好程序员web前端分享JS引擎的执行机制,请先着重牢记两点!JS是单线程语言. JS的EventLoop是JS的执行机制.深入了解JS的执行,就等于深入了解JS里的eventloop. 1.灵魂三问: ...

  7. JS动态赋值同时触发onchange方法

    2019独角兽企业重金招聘Python工程师标准>>> JS 动态赋值时不触发 onchange 方法,如何同时触发? 注意: IE 与 Firefox . Chrome 处理情况不 ...

  8. 解决ajax无法给js全局变量赋值的问题

    解决ajax无法给js全局变量赋值的问题 参考文章: (1)解决ajax无法给js全局变量赋值的问题 (2)https://www.cnblogs.com/zealousness/p/8757950. ...

  9. 微信分享 JS 失效

    转自:方倍工作室 -- 微信分享JS接口失效说明及解决方案 关键字:微信分享 JS 失效  分享到朋友圈  微信分享JS接口目前已失效,以前可以自定义分享的标题.描述.图片.链接地址在微信6.0.2版 ...

最新文章

  1. 高中计算机个人总结怎么写,毕业生自我总结范文
  2. iPhone开发进阶(9)--- 用SQLite管理数据库
  3. linux shell 实现自增版本号
  4. POJ - 2018 Best Cow Fences(二分+最长连续子段和)
  5. linux命令学习记录一
  6. CSS之中间固定两边自适应宽度
  7. python-datetime模块190901
  8. parrot linux iso下载,Parrot 4.7 发布,基于Debian的数字取证和隐私保护Linux发行版
  9. prim算法_历时两月,终拿字节跳动offer,算法面试题分享「带答案」
  10. 5工程添加emwin库_手把手教你打造专属自己的远程私有库——上
  11. 最新酷睿计算机配置,三款intel九代酷睿全系列组装电脑配置推荐 每一款CPU都支持超频...
  12. mysql集群解决方案mysql复制原理
  13. 【用matlab设计仿真数字锁相放大器】
  14. Android蓝牙自动配对和Pin码设置
  15. 线性稳压芯片的选取要素
  16. 族蚂网针对宠物网站建设有哪些新体验
  17. 专访有赞 CTO 崔玉松:打造中国 SaaS 领域最好的开店软件解决方案
  18. CS 与 PS 的区别
  19. 看中文域名 谈国际域名
  20. [20190328]PPT中的png图片去底色(透明化)

热门文章

  1. 《数据结构》知识点Day_01
  2. python小结价格_036 Python进阶小结
  3. Mysql的左外连接丶右外连接与内连接的区别
  4. 通过 SpringBoot 中使用 lombok 实现自动创建JavaBean的get/set方法、全参/无参构造方法、toString()、equals()、hashCode()
  5. Maven项目不能编译jsp解决方法:Unable to compile class for JSP
  6. 人工智能简史(Rockwell Anyoha )
  7. 面试题php2018,2018php最新面试题之PHP核心技术
  8. Centos7修改Docker默认存储位置
  9. MATLAB 使用CNN拟合回归模型预测手写数字的旋转角度(卷积神经网络)
  10. c语言x的2取模_c语言如何取模运算