一个 js 中值传递和引用传递的坑。

今天在调试代码时遇到一个问题,刚开始想不明白,然后分析了一下后,才知道其中的问题,这也是一个基础的问题,(所以基础是很重要的)

代码如下:

var a = 3;
a = a * 2;
console.log(a); // a = 6var b = 1, c =2, d = 3;
var arr1 = [b,c,d];
arr1.forEach((item)=>{item = item * 2;
});
console.log(arr1); //arr1 = [1,2,3];var arr2 = [{a:1},{a:2},{a:3}];
arr2.forEach((item)=>{item.a = item.a*2;
});
console.log(arr2); //arr2 = [{a:2},{a:4},{a:6}]

如果你能不假思索的得出上面的答案,我相信你对这方面的知识已经很了解了,所以可以不用继续往下看了,如果你像我今天该开始一样,觉得有点疑惑的话,那么这篇文文章就很适合你。

  1. 首先我们应该知道的是,在 javascript 中,基本数据类型是通过值传递的。

比如:

var a=1,b;b = a;// 这时 a 和 b 的值都为 1a = 2;//这时 a 的值 为 2,b 的值还是为 1 ,

图片描述

所以当 b = a, a = 2;a直接赋给b的值 是1,所以 b 就等于 1,而 a 的变化改变不了 b 的值

  1. 在 js 中复杂数据类型是通过 引用传递的

比如:

var v1 = { a:1 };
var v2 = v1; //v2 = { a:1 }
v1.a = 2;
console.log(v2.a); // v2.a = 2;

图片描述

了解了以上的一些基础知识后,就不难理解最开始的代码输出结果了。

1.var a = 3;a = a * 2;console.log(a); // a = 62. var b = 1, c =2, d = 3;var arr1 = [b,c,d];arr1.forEach((item)=>{item = item * 2;});console.log(arr1); //arr1 = [1,2,3];3. var arr2 = [{a:1},{a:2},{a:3}];arr2.forEach((item)=>{item.a = item.a*2;});console.log(arr2); //arr2 = [{a:2},{a:4},{a:6}]

第一段代码当然好理解,就是简单的值传递而已,然而第二段代码呢?我刚开始有点困惑的是,既然也是值传递,那为什么它的值没有变化还是原先的值,注意:这里我忽略了重要的一点,所以导致我不明白,那就是在这个 forEach 的遍历中,还存在一个赋值的过程,就是这个过程导致 arr1 的值没有改变,在每次循环中 arr1中的值都会赋给 item, 就是 item = b, item = c,item = d,所以后面对item 的改变就与 b,v,d 没有关系了。
所以那么 第三段也就很好理解了,他也与第二段代码一样,每次回存在一个赋值,但是注意的是 arr2 中存储的是对象,就是 item = { a:1 } ...,这样 item 仍然指向 arr2 中对象,所以这时对 item 的修改就可以通过 arr2 来反应出来。

虽然这只是自己的粗心造成的,但仍然是自己的基础不扎实而导致的,所以想要成为好的程序员,基础是非常重要的。希望大家都能注重基础的知识,为自己学习高级东西而打下坚实的基础。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/457053.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

关于在用异步消息处理机制使用Message.Obtain()方法(而非New Message)获得一个Message对象的好处

类概述 定义一个包含任意类型的描述数据对象,此对象可以发送给Handler。对象包含两个额外的int字段和一个额外的对象字段,这样可以使得在很多情况下不用做分配工作。 尽管Message的构造器是公开的,但是获取Message对象的最好方法是调用Messag…

python编程中的if __name__ == 'main': 的作用和原理

大多数编排得好一点的脚本或者程序里面都有这段if __name__ main: ,虽然一直知道他的作用,但是一直比较模糊,收集资料详细理解之后与打架分享。 1、这段代码的功能 一个python的文件有两种使用的方法,第一是直接作为脚本执行&…

自己简单封装的自己项目需要的http请求

2019独角兽企业重金招聘Python工程师标准>>> package www.tydic.com.util;import java.io.ByteArrayOutputStream; import java.io.DataOutputStream; import java.io.IOException; import java.io.InputStream; import java.io.OutputStream; import java.net.Http…

Java基础中按值传递和引用传递详解

下面是我在网上看到的一个帖子,解释的感觉挺全面,就转过来,以供以后学习参考: 1:按值传递是什么 指的是在方法调用时,传递的参数是按值的拷贝传递。示例如下: [java] view plaincopy public cla…

【Foreign】采蘑菇 [点分治]

采蘑菇 Time Limit: 20 Sec Memory Limit: 256 MBDescription Input Output Sample Input 51 2 3 2 31 21 32 42 5Sample Output 10912911HINT Main idea 询问从以每个点为起始点时,各条路径上的颜色种类的和。 Solution 我们看到题目,立马想到了O(n^2)…

c语言程序设计贪吃蛇需求分析,C语言编程新手入门基础进阶学习!贪吃蛇小游戏演示和说明...

C语言是面向过程的,而C++是面向对象的设计贪吃蛇游戏的主要目的是让大家夯实C语言基础,训练编程思维,培养解决问题的思路,领略多姿多彩的C语言。游戏开始后,会在中间位置出现一条只有三个节点的…

Strus2中关于ValueStack详解

什么是ValueStack 它是一个接口com.opensymphony.xwork2.util.ValueStack。我们使用它是将其做为一个容器,用于携带action数据到页面。在页面上通过ognl表达式获取数据。 valueStack主要是将action数据携带到页面上,通过ognl获取数据 1.ValueStack有一个…

c语言递归汉诺塔次数,汉诺塔问题(C语言经典递归问题(一))

把A杆上的金盘全部移到C杆上,并仍保持原有顺序叠好。操作规则:每次只能移动一个盘子,并且在移动过程中三根杆上都始终保持大盘在下,小盘在上,操作过程中盘子可以置于A、B、C任一杆上。思路:图解&#xff1a…

理解浏览器是如何加载及渲染网页的

先上图,我们再慢慢解释,这图就是浏览器加载网页的一个过程 当我们在浏览器输入一个地址(比如:http://toadw.cn),那么点击回车后,浏览器是如何加载网页的呢? 加载过程 一开始浏览器是不知道你输入的http://t…

CentOS下的Mysql的安装和使用

1.使用安装命令 :yum -y install mysql mysql-server mysql-devel 安装完成却发现Myserver安装缺失,在网上找原因,原来是因为CentOS 7上把MySQL从默认软件列表中移除了,用MariaDB来代替,所以这导致我们必须要去官网上…

Android中创建自己的对话框

Activities提供了一种方便管理的创建、保存、回复的对话框机制,例如 onCreateDialog(int), onPrepareDialog(int, Dialog), showDialog(int), dismissDialog(int)等方法,如果使用这些方法的话,Activity将通过getOwnerActivity()方法返回该Act…

一件很好笑的事情

我是一个比较习惯努力学习的人, 我也会去学习各种可能与我有交集的知识, 就在这几天,我看到以前的一个android网络培训学校开办了C/C的培训,这是挺好的事, 但是看他们的文件,我就奇怪了。 这份文件&#xf…

关于Eclipes的Logcat无法打印消息的解决办法

转自:http://blog.csdn.net/harry211/article/details/8453532 调试程序需要打印一些消息出来,logcat不好用的话就很麻烦了。这个问题折腾了好久,为啥就是不出来呢? 上网找了很多解决办法: 重启eclipse 重启adb 重启…

17:文字排版

17:文字排版 查看提交统计提问总时间限制: 1000ms内存限制: 65536kB描述给一段英文短文,单词之间以空格分隔(每个单词包括其前后紧邻的标点符号)。请将短文重新排版,要求如下: 每行不超过80个字符;每个单词…

解决AttributeError: 'str' object has no attribute 'decode'报错问题

顺着报错文件点进去,找到query query.decode(errors‘replace’) 将decode修改为encode即可

解决python中html 代码被注释掉 依旧被解释导致报错ERROR:tornado.access:500 GET /home (xxx.xxx.xxx.xxx)

ERROR:tornado.access:500 GET /home (xxx.xxx.xxx.xxx) 注释的是Html代码,是给浏览器看的。 Html里的代码还是要执行。注释python代码用{# #}

springMvc 传子 bean 中有bean

2019独角兽企业重金招聘Python工程师标准>>> bean 类型 如下 1. json 字符串 $.ajax({ url :${ctx}/test/testData/f1?bookjava, type: post, dataType : "json", con…

关于地图中轨迹的平滑移动的实现

很多人应该都有类似的经历,叫完车,想看看车离我还有多远距离?但手机屏幕上的车不是一动不动,就是一跳一跳的漂移。 目前市面上大多产品“轨迹平滑移动”做的并不好。 市面上只有快的打车和一号专车实现了平滑移动,那…

查看centos中的用户和用户组

1、用户列表文件:/etc/passwd/ 2、用户组列表文件:/etc/group 3、查看系统中有哪些用户: cut -d : -f 1 /etc/passwd 4、查看可以登录系统的用户: cat /etc/passwd | grep -v /sbin/nologin | cut -d : -f 1 5、查看用户操作…

Android 开源优秀 Library 推荐

之后的每月会推荐一些优秀的开源 Android libraries,不仅仅是学习,也可以方便的使用到项目中,避免重复的造轮子。 PageIndicatorView 如果你需要在 ViewPager 中指明当前处于哪个画面中,PageIndicatorView是你的不二选择。而且真…