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 相关文章推荐
比较简单的异步加载JS文件的代码
Jul 18 Javascript
fancybox1.3.1 基于Jquery的插件在IE中图片显示问题
Oct 01 Javascript
jquery中获取select选中值的代码
Jun 27 Javascript
Jquery实现页面加载时弹出对话框代码
Apr 19 Javascript
通过jquery 获取URL参数并进行转码
Aug 18 Javascript
js解决select下拉选不中问题
Oct 14 Javascript
jquery实现无限分级横向导航菜单的方法
Mar 12 Javascript
Javascript中Date类型和Math类型详解
Feb 27 Javascript
JavaScript中定义对象原型的两种使用方法
Dec 15 Javascript
改变vue请求过来的数据中的某一项值的方法(详解)
Mar 08 Javascript
Vue中的$set的使用实例代码
Oct 08 Javascript
vue-cli 为项目设置别名的方法
Oct 15 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
CodeIgniter框架中_remap()使用方法2例
2014/03/10 PHP
延时重复执行函数 lLoopRun.js
2007/05/08 Javascript
Javascript玩转继承(二)
2014/05/08 Javascript
介绍JavaScript的一个微型模版
2015/06/24 Javascript
JavaScript实现斗地主游戏的思路
2016/02/29 Javascript
在javascript中创建对象的各种模式解析
2016/05/16 Javascript
JavaScript ES6中CLASS的使用详解
2016/11/22 Javascript
jQuery 控制文本框自动缩小字体填充
2017/06/16 jQuery
67 个节约开发时间的前端开发者的工具、库和资源
2017/09/12 Javascript
angular 实时监听input框value值的变化触发函数方法
2018/08/31 Javascript
微信小程序性能优化之checkSession的使用
2019/03/06 Javascript
js瀑布流布局的实现
2020/06/28 Javascript
vue实践---根据不同环境,自动转换请求的url地址操作
2020/09/21 Javascript
vue使用exif获取图片经纬度的示例代码
2020/12/11 Vue.js
Python爬取国外天气预报网站的方法
2015/07/10 Python
如何用python整理附件
2018/05/13 Python
在python环境下运用kafka对数据进行实时传输的方法
2018/12/27 Python
Python二叉搜索树与双向链表转换算法示例
2019/03/02 Python
Django 用户认证组件使用详解
2019/07/23 Python
python实现多线程端口扫描
2019/08/31 Python
python3 pathlib库Path类方法总结
2019/12/26 Python
使用Python获取当前工作目录和执行命令的位置
2020/03/09 Python
Django3中的自定义用户模型实例详解
2020/08/23 Python
CSS3教程(1):什么是CSS3
2009/04/02 HTML / CSS
移动HTML5前端框架—MUI的使用
2017/12/18 HTML / CSS
美国中小型企业领先的办公家具供应商:Office Designs
2016/11/26 全球购物
美国最大的户外装备和服装购物网站:Backcountry
2019/10/15 全球购物
世界上最大的铁人三项商店:Tri UK
2020/11/04 全球购物
static关键字的用法
2013/10/07 面试题
《大作家的小老师》教学反思
2014/04/16 职场文书
学校安全生产承诺书
2014/05/23 职场文书
施工安全汇报材料
2014/08/17 职场文书
个人三严三实对照检查材料思想汇报
2014/09/22 职场文书
社区党员群众路线教育实践活动心得体会
2014/11/03 职场文书
MySQL里面的子查询的基本使用
2021/08/02 MySQL
Oracle中DBLink的详细介绍
2022/04/29 Oracle