JS函数参数的传递与同名参数实例分析


Posted in Javascript onMarch 16, 2020

本文实例讲述了JS函数参数的传递与同名参数。分享给大家供大家参考,具体如下:

函数参数的传递

函数参数如果是原始类型值,传递方式是值传递。这意味着,在函数体内修改参数值,不会影响函数外部。

var p = 2 
function f(p) {
 p = 3
}
f(p)
p // 2

上面代码中,变量p是一个原始类型的值,传入函数f的方式是值传递,因此在函数内部,p的值是原始值的拷贝,无论怎么修改,都不会影响到原始值。

但是,如果函数参数是复合类型,传入函数的方式是引用的传递,也就是说,传入函数的是一个地址,因此在函数内部修改参数,将会影响到原始值。

var obj = { p: 1 };

function f(o) {
 o.p = 2;
}
f(obj);

obj.p // 2

上面代码中,传入函数f的参数对象obj的地址。因此,在函数内部修改obj的属性p,会影响到原始值 。

注意,如果函数内部修改的,不是参数对象的某个属性,而是替换掉整个参数,这时不会影响到原始值 。

var obj = [1, 2, 3];

function f(o) {
 o = [2, 3, 4];
}
f(obj);

obj // [1, 2, 3]

上面代码中,在函数f内部,参数对象obj被整个替换成另一个值。这时不会影响到原始值。这是因为,形式参数(o)的值实际是参数obj的地址,重新对o赋值 ,导致o指向另一个地址,保存在原地址上的值当然不受影响。

函数中的同名参数

如果函数中出现了同名参数,则取最后出现的那个值

function f(a, a) {
 console.log(a);
}

f(1, 2) // 2

上面代码中,函数f有两个参数,且参数名都为a,取值 的时候,以后面的a为准,即使后面的a没有值,或者被省略,也是以其为准。

function f(a, a) {
 console.log(a);
}

f(1) // undefined

调用函数f的时候,没有提供第二个参数,a的取值就变成了undefined。这时,如果要获得第一个a的值,可以使用arguments对象。

function f(a, a) {
 console.log(arguments[0]);
}

f(1) // 1

感兴趣的朋友可以使用在线HTML/CSS/JavaScript代码运行工具:http://tools.3water.com/code/HtmlJsRun测试上述代码运行效果。

更多关于JavaScript相关内容可查看本站专题:《JavaScript常用函数技巧汇总》、《javascript面向对象入门教程》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》及《JavaScript数学运算用法总结》

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
jquery延迟加载外部js实现代码
Jan 11 Javascript
JavaScript中把数字转换为字符串的程序代码
Jun 19 Javascript
js实现连个数字相加而不是拼接的方法
Feb 23 Javascript
JQuery中上下文选择器实现方法
May 18 Javascript
快速使用Bootstrap搭建传送带
May 06 Javascript
onmouseover事件和onmouseout事件全面理解
Aug 15 Javascript
jQuery实现的简单在线计算器功能
May 11 jQuery
JavaScript模拟文件拖选框样式v1.0的实例
Aug 04 Javascript
C#实现将一个字符转换为整数
Dec 12 Javascript
vue实现导航栏效果(选中状态刷新不消失)
Dec 13 Javascript
微信小程序简单的canvas裁剪图片功能详解
Jul 12 Javascript
js实现飞机大战小游戏
Aug 26 Javascript
vue css 引入asstes中的图片无法显示的四种解决方法
Mar 16 #Javascript
JS函数本身的作用域实例分析
Mar 16 #Javascript
JavaScript实现tab栏切换效果
Mar 16 #Javascript
vue-cli3使用mock数据的方法分析
Mar 16 #Javascript
vue-cli3.0实现一个多页面应用的历奇经历记录总结
Mar 16 #Javascript
vue从零实现一个消息通知组件的方法详解
Mar 16 #Javascript
JavaScript实现动态留言板
Mar 16 #Javascript
You might like
PHP扩展程序实现守护进程
2015/04/16 PHP
PHP实现单文件、多个单文件、多文件上传函数的封装示例
2019/09/02 PHP
javascript中常用编程知识
2013/04/08 Javascript
用javascript替换URL中的参数值示例代码
2014/01/27 Javascript
浅谈jQuery页面的滚动位置scrollTop、scrollLeft
2015/05/19 Javascript
关于js里的this关键字的理解
2015/08/17 Javascript
以JavaScript来实现WordPress中的二级导航菜单的方法
2015/12/14 Javascript
JavaScript中三种异步上传文件方式
2016/03/06 Javascript
图文详解Heap Sort堆排序算法及JavaScript的代码实现
2016/05/04 Javascript
使用jquery/js获取iframe父子级、同级获取元素的方法
2016/08/05 Javascript
微信小程序 WXDropDownMenu组件详解及实例代码
2016/10/24 Javascript
JavaScript面向对象精要(下部)
2017/09/12 Javascript
关于Webpack dev server热加载失败的解决方法
2018/02/22 Javascript
在vue中使用Autoprefixed的方法
2018/07/27 Javascript
PWA介绍及快速上手搭建一个PWA应用的方法
2019/01/27 Javascript
vue用BMap百度地图实现即时搜索功能
2019/09/26 Javascript
JS三级联动代码格式实例详解
2019/12/30 Javascript
js实现弹幕墙效果
2020/12/10 Javascript
python基础教程之实现石头剪刀布游戏示例
2014/02/11 Python
python在linux中输出带颜色的文字的方法
2014/06/19 Python
Flask框架学习笔记(一)安装篇(windows安装与centos安装)
2014/06/25 Python
深入了解Python数据类型之列表
2016/06/24 Python
python实现电脑自动关机
2018/06/20 Python
python 读写文件,按行修改文件的方法
2018/07/12 Python
python3.6使用urllib完成下载的实例
2018/12/19 Python
浅谈Pycharm中的Python Console与Terminal
2019/01/17 Python
Python Flask框架扩展操作示例
2019/05/03 Python
python Django 创建应用过程图示详解
2019/07/29 Python
Python如何用filter函数筛选数据
2020/03/05 Python
python pyqtgraph 保存图片到本地的实例
2020/03/14 Python
Python 合并拼接字符串的方法
2020/07/28 Python
Smashbox英国官网:美国知名彩妆品牌
2017/11/13 全球购物
建筑施工实习自我鉴定
2013/09/19 职场文书
网络工程专业毕业生推荐信
2013/10/28 职场文书
房地产财务部员工岗位职责
2014/03/12 职场文书
GoLang中生成UUID唯一标识的实现
2021/05/08 Golang