浅析js的函数的按值传递参数
js的函数传参的方式是按值传递,正常情况下,改变函数参数的值,并不会对函数外部的变量造成影响。例如:
'use strict';
var list = [1, 2, 3];
list.forEach(function(item) {
item ++;
});
console.log(list); // [ 1, 2, 3 ]
这是因为js的函数在接收参数时,会生成一个副本变量,该副本变量等于参数的值,可以分析js这样运行的:
'use strict';
var list = [1, 2, 3];
list.forEach(function(item, i) {
// 第一个item是副本,第二个item是数组元素list[i]
var item = item;
// 副本item++
item ++;
// 打印的是副本的值
console.log(item); // 2, 3, 4
});
// 原数组不会改变
console.log(list); // [ 1, 2, 3 ]
但是当函数的参数传递的是一个对象呢?
'use strict';
var list = [{a: , b: }];
list.forEach(function(item) {
item.a ++;
});
console.log(list); // [ { a: 2, b: 2 } ]
发现函数内部居然改变了函数外部变量的值,那这又是为什么呢?
我们来分析js是如何运行这段代码的
'use strict';
var list = [{a: 1, b: 2}];
list.forEach(function(item, i) {
// 第一个item是副本,第二个item是数组元素list[i]
var item = item;
// 此时item和list[i]指向的是同一地址,故两者完全一样
console.log(item === list[i]); // true
// 此时item.a++ 亦即 list[i].a++
item.a ++;
// list[i]的值已经改变
console.log(list[i]); // { a: 2, b: 2 }
});
console.log(list); // [ { a: 2, b: 2 } ]
那么为什么会产生这种情况呢?
由于js中对象属于引用类型,var item = item 这一步相当于把 list[i] 的地址赋值给了item,他们两个指向的都是原对象的地址,所以通过其中的一个去修改值时其实是修改他们指向的那个对象。例子中通过 item.a++ 方法改变了原对象的值,因此最后应该输出 [ { a: 2, b: 2 } ]。
浅析js的函数的按值传递参数的更多相关文章
- js 获取函数的所有参数名
具体思路: 利用Function.toString()方法,获取到函数的源码,再利用正则匹配获取到参数名字. 实现代码(代码基于ES6): // 获取函数的参数名 function getParame ...
- js 以函数名作为参数动态执行 函数
function myFunc() { console.log(11111); } test("myFunc"); function test(funcName) { if(typ ...
- js 事件函数中的参数带换行符或换行标签都不能起作用的解决方法
把问题参数值赋给标签的属性data-value,通过属性值获取参数值.
- 【js】函数问题
一.函数重载问题: 由于js的函数传入的参数当做arguments对象(和数组类似,但不是Array的实例),传入的参数类型和数量没有限制,没有函数签名,所以如果要实现重载功能 的话,只能是不够完美得 ...
- JS:函数多个参数默认值指定
函数有一个参数时,以往这样定义(参数为p1): function mfun(p1){ … } 当需要为p1设定一个默认值时 function mfun(p1){ if(p1===undefined) ...
- js调用函数时传入的参数个数与函数定义时的参数个数不符时的操作
在js中函数没有重载的概念,如果声明了多个重名的函数,不管函数的形参个数是否一样,只有最有一个有效,其他的函数声明都是无效的.比如说声明了两个函数fn(),第一次声明时没有形参,第二次声明时形参有两个 ...
- JS中函数参数和函数返回值的理解
函数本质就是功能的集合 JS中函数是对象,因此,函数名实际上仅仅是一个指向函数对象的指针,不会与某个函数绑定,所以,JS中没有重载(重载就是通过传递不同类型的参数,使两个相同函数名的函数执行不同的功能 ...
- js 四舍五入函数 toFixed(),里面的参数 就是保留小数的位数。
js 四舍五入函数 toFixed(),里面的参数 就是保留小数的位数. <script language="javascript"> document.write(& ...
- 关于js 中函数的参数
var a = 100; function test(a){ a++; //a(形参)是局部变量 console.log(a); } test(a); console.log(a); //结果是 10 ...
随机推荐
- Spartan6系列之Spartan6系列之芯片时钟资源深入详解
1. 时钟资源概述 时钟设施提供了一系列的低电容.低抖动的互联线,这些互联线非常适合于传输高频信号.最大量减小时钟抖动.这些连线资源可以和DCM.PLL等实现连接. 每一种Spartan-6芯片提 ...
- docloud后台管理项目(开篇)
最近朋友做app需要web做后台管理,所以花了一周时间做了这个项目. 废话不多说,开发环境是nginx+php5.3,使用thinkphp框架.是一个医疗器械数据统计的后台,业务功能很简单就是查看用户 ...
- OpenGL坐标系之间的转换 http://blog.csdn.net/sac761/article/details/52179585
1. OpenGL 渲染管线 OpenGL渲染管线分为两大部分,模型观测变换(ModelView Transformation)和投影变换(Projection Transformation).做个比 ...
- Xamarin View获取属性的绑定信息
public static Binding GetBinding( BindableObject self, BindableProperty property) { var methodInfo = ...
- java_IO_3
Reader和Writer针对字符文件 对图片类文件可能就显得无能为力了 会损坏文件 package ioStudy; import java.io.File; import java.io.Fi ...
- SpringMVC-Mybatis整合和注解开发
SpringMVC-Mybatis整合和注解开发SpringMVC-Mybatis整合整合的思路在mybatis和spring整合的基础上 添加springmvc.spring要管理springmvc ...
- form表单传输多余参数
1.使用post提交表单,同时在form的action属性后添加“?参数=参数值”,经验证,可行,但是在浏览器中看不到该参数在form参数中,如下图: 上图未出现courseId属性,form代码如下 ...
- [Algorithm] 3. Digit Counts
Description Count the number of k's between 0 and n. k can be 0 - 9. Example if n = 12, k = 1 in [0, ...
- ConcurrentHashMap笔记
概览: 内部存储的数据结构为:数组+链表+红黑树,图示: 重要的属性(内部类): //存放元素的数组 transient volatile Node<K,V>[] table; //数组中 ...
- python 读取指定文件信息并拼接
python 读取指定文本并拼接成指定的格式 # -*- coding: utf-8 -*- import os def getHelloWorld(path, fileName): "&q ...