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 相关文章推荐
静态图片的十一种滤镜效果--不支持Ie7及非IE浏览器。
Mar 06 Javascript
jquery 实现的全选和反选
Apr 15 Javascript
jquery操作select详解(取值,设置选中)
Feb 07 Javascript
jQuery中使用data()方法读取HTML5自定义属性data-*实例
Apr 11 Javascript
简述AngularJS的控制器的使用
Jun 16 Javascript
如何用javascript计算文本框还能输入多少个字符
Jul 29 Javascript
AngularJS中处理多个promise的方式
Feb 02 Javascript
jQuery实现的自动加载页面功能示例
Sep 04 Javascript
node.js到底要不要加分号浅析
Jul 11 Javascript
解决vue js IOS H5focus无法自动弹出键盘的问题
Aug 30 Javascript
react 组件传值的三种方法
Jun 03 Javascript
如何进行微信公众号开发的本地调试的方法
Jun 16 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
IIS6的PHP最佳配置方法
2007/03/19 PHP
一个PHP的String类代码
2010/04/20 PHP
PHP生成随机用户名和密码的实现代码
2013/02/27 PHP
php下拉选项的批量操作的实现代码
2013/10/14 PHP
PHP 实现页面静态化的几种方法
2017/07/23 PHP
使用Apache的rewrite
2021/03/09 Servers
漂亮的widgets,支持换肤和后期开发新皮肤
2007/04/23 Javascript
Jquery命名冲突解决的五种方案分享
2012/03/16 Javascript
分析Node.js connect ECONNREFUSED错误
2013/04/09 Javascript
jQuery之折叠面板的深入解析
2013/06/19 Javascript
js中如何复制一个对象并获取其所有属性和属性对应的值
2013/10/24 Javascript
js调用iframe实现打印页面内容的方法
2014/03/04 Javascript
JSON格式化输出
2014/11/10 Javascript
仿JQuery输写高效JSLite代码的一些技巧
2015/01/13 Javascript
7个jQuery最佳实践
2016/01/12 Javascript
Bootstrap 折叠(Collapse)插件用法实例详解
2016/06/01 Javascript
JSON与String互转的实现方法(Javascript)
2016/09/27 Javascript
JS常用知识点整理
2017/01/21 Javascript
微信小程序实战之顶部导航栏(选项卡)(1)
2020/06/19 Javascript
node使用UEditor富文本编辑器的方法实例
2017/07/11 Javascript
JS实现全屏预览F11功能的示例代码
2018/07/23 Javascript
Bootstrap4 gulp 配置详解
2019/01/06 Javascript
Angular8引入百度Echarts进行图表分析的实现代码
2019/11/27 Javascript
uniapp实现可滑动选项卡
2020/10/21 Javascript
python使用cookie库操保存cookie详解
2014/03/03 Python
Python实现获取照片拍摄日期并重命名的方法
2017/09/30 Python
Django入门使用示例
2017/12/12 Python
python 信息同时输出到控制台与文件的实例讲解
2018/05/11 Python
Python 矩阵转置的几种方法小结
2019/12/02 Python
浅析两列自适应布局的3种思路
2016/05/03 HTML / CSS
行政工作试用期自我评价
2014/09/14 职场文书
对学校的意见和建议
2015/06/04 职场文书
无工作证明怎么写
2015/06/15 职场文书
爱心捐赠活动简讯
2015/07/20 职场文书
让人瞬间清醒的句子,句句经典,字字如金
2019/07/08 职场文书
分享一个vue实现的记事本功能案例
2022/04/11 Vue.js