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 相关文章推荐
判断是否输入完毕再激活提交按钮
Jun 26 Javascript
用javascript实现给图片加链接
Aug 15 Javascript
javascript addBookmark 加入收藏 多浏览器兼容
Aug 15 Javascript
javascript 弹出层组件(升级版)
May 12 Javascript
jQuery找出网页上最高元素的方法
Mar 20 Javascript
获取JS中网页各种高宽与位置的方法总结
Jul 27 Javascript
如何清除IE10+ input X 文本框的叉叉和密码输入框的眼睛图标
Dec 21 Javascript
JavaScript拖动层Div代码
Mar 01 Javascript
HTML中使背景图片自适应浏览器大小实例详解
Apr 06 Javascript
基于react框架使用的一些细节要点的思考
May 31 Javascript
微信小程序网络封装(简单高效)
Aug 06 Javascript
vue+elementUi 实现密码显示/隐藏+小图标变化功能
Jan 18 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使用GETDATE获取当前日期时间作为一个关联数组的方法
2015/03/19 PHP
隐性调用php程序的方法
2015/06/13 PHP
抛弃 PHP 代价太高
2016/04/26 PHP
PHP中include/require/include_once/require_once使用心得
2016/08/28 PHP
PHP字典树(Trie树)定义与实现方法示例
2017/10/09 PHP
Extjs学习笔记之一 初识Extjs之MessageBox
2010/01/07 Javascript
javascript中判断一个值是否在数组中并没有直接使用
2012/12/17 Javascript
javascript unicode与GBK2312(中文)编码转换方法
2013/11/14 Javascript
jQuery EasyUI Dialog拖不下来如何解决
2015/09/28 Javascript
jQuery.trim() 函数及trim()用法详解
2015/10/26 Javascript
JS+JSP通过img标签调用实现静态页面访问次数统计的方法
2015/12/14 Javascript
Bootstrap企业网站实战项目4
2016/10/14 Javascript
VueJs使用Amaze ui调整列表和内容页面
2017/11/30 Javascript
使用weixin-java-tools完成微信授权登录、微信支付的示例
2018/09/26 Javascript
解决vue组件中click事件失效的问题
2019/11/09 Javascript
[01:32]2014DOTA2西雅图邀请赛 CIS我们有信心进入正赛
2014/07/08 DOTA
python获取命令行输入参数列表的实例代码
2018/06/23 Python
Python绘制并保存指定大小图像的方法
2019/01/10 Python
Python基础学习之基本数据结构详解【数字、字符串、列表、元组、集合、字典】
2019/06/18 Python
对django layer弹窗组件的使用详解
2019/08/31 Python
Python大数据之使用lxml库解析html网页文件示例
2019/11/16 Python
python enumerate内置函数用法总结
2020/01/07 Python
python 串行执行和并行执行实例
2020/04/30 Python
Python实现随机爬山算法
2021/01/29 Python
详解python日志输出使用配置文件格式
2021/02/10 Python
使用css3实现超炫的loading加载动画效果
2014/05/07 HTML / CSS
html5+css3之动画在webapp中的应用
2014/11/21 HTML / CSS
流行文化收藏品:Sideshow(DC漫画,星球大战,漫威)
2019/03/17 全球购物
银行毕业实习自我鉴定
2013/09/19 职场文书
董事长秘书岗位职责
2013/11/29 职场文书
中专生自我鉴定书范文
2013/12/28 职场文书
董事长助理岗位职责
2014/02/18 职场文书
通用自荐信范文
2014/03/14 职场文书
亲属关系公证书
2014/04/08 职场文书
结婚保证书(三从四德)
2015/02/26 职场文书
军训决心书范文
2015/09/22 职场文书