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 相关文章推荐
onkeypress字符按键兼容所有浏览器使用介绍
Apr 24 Javascript
js数组去重的方法汇总
Jul 29 Javascript
JS实现的表格操作类详解(添加,删除,排序,上移,下移)
Dec 22 Javascript
Angularjs material 实现搜索框功能
Mar 08 Javascript
微信小程序手势操作之单触摸点与多触摸点
Mar 10 Javascript
react.js CMS 删除功能的实现方法
Apr 17 Javascript
Vue Spa切换页面时更改标题的实例代码
Jul 15 Javascript
关于在mongoose中填充外键的方法详解
Aug 14 Javascript
详解layui弹窗父子窗口之间传参数的方法
Jan 16 Javascript
jquery实现搜索框功能实例详解
Jul 23 jQuery
Node.js API详解之 dgram模块用法实例分析
Jun 05 Javascript
Vue将props值实时传递 并可修改的操作
Aug 09 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面向对象三大特点学习(充分理解抽象、封装、继承、多态)
2012/05/07 PHP
解析PHP中ob_start()函数的用法
2013/06/24 PHP
php 读取文件头判断文件类型的实现代码
2013/08/05 PHP
thinkphp常见路径用法分析
2014/12/02 PHP
利用php实现一周之内自动登录存储机制(cookie、session、localStorage)
2016/10/31 PHP
php微信开发之谷歌测距
2018/06/14 PHP
jquery1.4.2 for Visual studio 2010 模板文件
2010/07/14 Javascript
完美兼容IE,chrome,ff的设为首页、加入收藏及保存到桌面js代码
2014/12/17 Javascript
基于jquery实现省市联动效果
2015/11/23 Javascript
JavaScript计划任务后台运行的方法
2015/12/18 Javascript
js多功能分页组件layPage使用方法详解
2016/05/19 Javascript
js 自带的sort() 方法全面了解
2016/08/16 Javascript
纯JS实现轮播图
2017/02/22 Javascript
p5.js入门教程和基本形状绘制
2018/03/15 Javascript
Vue SPA单页应用首屏优化实践
2018/06/28 Javascript
浅析Vue 和微信小程序的区别、比较
2018/08/03 Javascript
Vue form表单动态添加组件实战案例
2019/09/02 Javascript
vscode 插件开发 + vue的操作方法
2020/06/05 Javascript
vue+iview分页组件的封装
2020/11/17 Vue.js
微信小程序实现底部弹出框
2020/11/18 Javascript
python创建进程fork用法
2015/06/04 Python
详解Python的Django框架中的模版相关知识
2015/07/15 Python
Python删除Java源文件中全部注释的实现方法
2017/08/30 Python
Python获取当前公网ip并自动断开宽带连接实例代码
2018/01/12 Python
python numpy数组的索引和切片的操作方法
2018/10/20 Python
Mac下Anaconda的安装和使用教程
2018/11/29 Python
python实现连续图文识别
2018/12/18 Python
Python获取一个用户名的组ID过程解析
2019/09/03 Python
Python 测试框架unittest和pytest的优劣
2020/09/26 Python
高中生职业规划范文
2014/03/09 职场文书
成龙洗发水广告词
2014/03/14 职场文书
2014大学生中国梦主题教育学习思想汇报
2014/09/10 职场文书
幼儿园小班见习报告
2014/10/31 职场文书
2014年保卫部工作总结
2014/11/21 职场文书
2015年秋季小学开学标语
2015/07/16 职场文书
解析在浏览器地址栏输入一个URL后发生了什么
2021/06/21 Servers