JavaScript 函数参数是传值(byVal)还是传址(byRef) 分享


Posted in Javascript onJuly 02, 2013

对于“JavaScript 函数参数是传值(byVal)还是传址(byRef)”这个问题,普遍存在一个误区:number,string等“简单类型”是传值,Number, String, Object, Array等“复杂类型”是传址。
这样不对吗?为什么会有这样的误区?看一下这两段代码:

//造成传值假象的代码
function modifyLikeByVal(x){
  x = 1;
  console.log('x = %d', x);
}
var x = 0;
console.log('x = %d', x); // 输出 x = 0
modifyLikeByVal(x);  // 输出 x = 1
console.log('x = %d', x); // 输出 x = 0   x没变!

//造成传址假象的代码
function modifyLikeByRef(x){
  x[0] = 4;
  x[1] = 5;
  x[2] = 6;
  console.log('x = [ %s ]', x.join(', '));
}
var x = [1, 2, 3];
console.log('x = [ %s ]', x.join(', ')); // 输出 x = [ 1, 2, 3 ]
modifyLikeByRef(x);  // 输出 x = [ 4, 5, 6 ]
console.log('x = [ %s ]', x.join(', ')); // 输出 x = [ 4, 5, 6 ]   x变了!

于是,由以上代码得出结论,“简单类型”作为参数是传值(byVal)的,“复杂类型”作为参数是传址(byRef)的。

问题出在哪呢?

仔细观察两个函数,就可以发现一点:
在byVal中,是直接修改了参数x: x = 1;
而byRef中,是修改参数x的成员: x[0] = 4; x[1] = 5; x[2] = 6;

本人由此得出猜想:在JavaScript中,所有的变量或成员,都是一个指针,在修改变量或成员值的时候,其实是修改了该指针的地址。

这样上面的代码就可以得到解释了:

在“byVal”中:

global {  // 表示全局作用域,下面的表示函数作用域
  var x = 0;  // 初始化指针x并指向数字0
    fun(x) {
      x = global.x; // 传入参数global.x; fun域的x指针地址与global域的x指针地址一样指向数字0
      x = 1; // 修改fun域的x指针地址,指向数字1;
    } // fun 域结束,global域中的x指针没改变
}

在“byRef”中:
global {  // 表示全局作用域,下面的表示函数作用域
  /*
    初始化指针x并指向数组[1, 2, 3]
    其实是x的三个成员0, 1, 2,分别指向1, 2, 3;
  */
  var x = [1, 2, 3];  
    fun(x) {
      x = global.x; // 传入参数global.x; fun域的x指针地址与global域的x指针地址一样指向数组[1, 2, 3]
      /*
       在fun域中的x没有再被改变
       紧接着修改fun域中的x(也就是global.x)三个成员指针的指向
      */
      x[0] = 4;
      x[1] = 5;
      x[2] = 6;
    } // fun 域结束,global域中的x指针没改变,但其三个成员指针被改变了,于是就看到我们输出的结果
}

那这段代码怎么解释呢???
(function(a, b){
    arguments[0] = 1;
    b = 2;
    console.log(arguments, a, b);
})(-1, -2);

只能说a, b...,是arguments[0],...[n]的别名了。

如果有不对的地方,请指出来,谢谢。

如果有更好的解释,欢迎大家分享。

Javascript 相关文章推荐
JavaScript 垃圾回收机制分析
Oct 10 Javascript
jQuery.event兼容各浏览器的event详细解析
Dec 18 Javascript
node.js中的events.emitter.once方法使用说明
Dec 10 Javascript
ztree获取当前选中节点子节点id集合的方法
Feb 12 Javascript
Node.js实现Excel转JSON
Apr 24 Javascript
介绍JavaScript中Math.abs()方法的使用
Jun 14 Javascript
jquery+php随机生成红包金额数量代码分享
Aug 27 Javascript
js组件SlotMachine实现图片切换效果制作抽奖系统
Apr 17 Javascript
ES6通过babel转码使用webpack使用import关键字
Dec 13 Javascript
jquery层次选择器的介绍
Jan 18 jQuery
深入学习TypeScript 、React、 Redux和Ant-Design的最佳实践
Jun 17 Javascript
angular异步验证防抖踩坑实录
Dec 01 Javascript
js创建子窗口并且回传值示例代码
Jul 02 #Javascript
封装html的select标签的js操作实例
Jul 02 #Javascript
使用js获取地址栏中传递的值
Jul 02 #Javascript
jquery实现隐藏与显示动画效果/输入框字符动态递减/导航按钮切换
Jul 01 #Javascript
jquery动态增加text元素以及删除文本内容实例代码
Jul 01 #Javascript
Extjs4 Treegrid 使用心得分享(经验篇)
Jul 01 #Javascript
原生javascript兼容性测试实例
Jul 01 #Javascript
You might like
PHP通过正则表达式下载图片到本地的实现代码
2011/09/19 PHP
PHP安全配置详细说明
2011/09/26 PHP
PHP中spl_autoload_register函数的用法总结
2013/11/07 PHP
php将字符串转换成16进制的方法
2015/03/17 PHP
Zend Framework教程之Bootstrap类用法概述
2016/03/14 PHP
PHP+Ajax实现的博客文章添加类别功能示例
2018/03/29 PHP
PHP多维数组指定多字段排序的示例代码
2018/05/16 PHP
解决laravel中日志权限莫名变成了root的问题
2019/10/17 PHP
使用Entrust扩展包在laravel 中实现RBAC的功能
2020/03/16 PHP
PHP实现页面静态化深入讲解
2021/03/04 PHP
JSQL 批量图片切换的实现代码
2010/05/05 Javascript
JS正则验证邮箱的格式详细介绍
2013/11/19 Javascript
JS动态添加与删除select中的Option对象(示例代码)
2013/12/25 Javascript
js动态删除div元素基本思路及实现代码
2014/05/08 Javascript
js跨域访问示例(客户端/服务端)
2014/05/19 Javascript
node.js中的url.format方法使用说明
2014/12/10 Javascript
EasyUI学习之Combobox下拉列表(1)
2016/12/29 Javascript
js Canvas绘制圆形时钟教程
2017/02/06 Javascript
深入理解vue.js中$watch的oldvalue与newValue
2017/08/07 Javascript
jQuery+ajax实现动态添加表格tr td功能示例
2018/04/23 jQuery
JS实现密码框效果
2020/09/10 Javascript
用Python制作简单的朴素基数估计器的教程
2015/04/01 Python
Python+tkinter使用40行代码实现计算器功能
2018/01/30 Python
Python中if elif else及缩进的使用简述
2018/05/31 Python
win8.1安装Python 2.7版环境图文详解
2019/07/01 Python
python使用sessions模拟登录淘宝的方式
2019/08/16 Python
python 使用多线程创建一个Buffer缓存器的实现思路
2020/07/02 Python
html5录音功能实战示例
2019/03/25 HTML / CSS
英国国家美术馆商店:National Gallery
2019/05/01 全球购物
Unineed中文官网:高端护肤美妆与时尚配饰,英国直邮
2020/07/23 全球购物
电子商务专业实习生自我鉴定
2013/09/24 职场文书
医学护理系毕业生求职信
2013/10/01 职场文书
旅游管理毕业生自荐信
2013/11/05 职场文书
物流专业大学生职业生涯规划书范文
2014/01/15 职场文书
员工工作表现评语
2014/04/26 职场文书
2014班子“三严三实”对照检查材料思想汇报
2014/09/18 职场文书