JavaScript的function函数详细介绍


Posted in Javascript onNovember 20, 2021

通过函数来封装任意多条语句,而且可以在任何地方、任何时间调用执行。

而我们的JavaScript脚本语言比较特殊,相对于C语言,它的参数是不需要数据类型加持的。返回值return,我就不过多描述,他是和 C语言通的,如果没写他就会自动返回undefined

function fun(x,y){
            
        }
//写成这样就可以声明一个函数

以我的理解他就是以对象的形式来传入参数,通过对象的各项属性值(引用类型的值),来作为我的实际参数,

例如我有以下做法:

function fun(x, y) {
          //  alert("x的值是" + x.value);
            alert("x的值是" + x);
        }

当我是这种操作的时候,他的弹出框报错是:x的值是[object HTMLInputElement],以对象的形式传入的它是不符合我的逻辑设计的,应该是下面的这种做法。

返回我的x的value值。

function fun(x, y) {
            alert("x的值是" + x.value);
          //  alert("x的值是" + x);
        }
  • 所以当我设计一个简单的,两个整数数字相乘,返回值。
  • 这里就要特别记忆一下<form></form> 要把输入的这一段html代码写在这个标签里。不然你将会找好半天错误(别问我怎么知道的,说多了都是泪)

JavaScript的function函数详细介绍

咋们是深度理解,先别急,再看看这段代码:

JavaScript的function函数详细介绍

是不是着这里有着不一样的发现,照以前的这个函数写法,铁定是在乱写,是不是?但是他在这里是能运行的,笑死(开心的笑)

JavaScript的function函数详细介绍

也就是说ECMAScript函数不介意传进来多少个参数,也不在乎你传进来个神马参数,解析器永远都不会有任何怨言。(太爽了,老师再也不用担心我不会传参了),那他是如何解决这个“世纪难题 ”的呢,其实在每个函数体内,都有一个arguments对象来访问这个参数数组,从而获取传递给数组的每一个参数。

道友试试给下面代码fun函数用双引号fun(“勇敢”,“牛牛”),会发生什么现象,解释一下就是上引号就近配对,呜呜呜呜

哎,这和咱们学的java函数重载是不是有点那味道了呀,其实JavaScript是没有重载滴。

再看两个例子:

JavaScript的function函数详细介绍

function fun() {
    if (arguments.length == 1) {
        alert(arguments[0] + 10);

    }
    if (arguments.length == 2) {
        alert(arguments[0] + arguments[1]);
    }
}
fun(10);//20
fun(10,20);//30

也只能通过传入参数的个数上,实现适当的功能,并不是实现真正意义上的重载,虽然特性算不上完美的重载,但是也足够弥补JavaScript的这一遗憾。arguments也可以与参数与一起使用,

如下:

function fun(num1, num2) {
    if (arguments.length == 1) {
        alert(num1 + 10);

    }
    if (arguments.length == 2) {
        alert(arguments[0] + num2);
    }

}
fun(10);//20
fun(10, 20);//30

那么就有宝问了,参数反正都是赋值在arguments对象中,那么我直接修改 arguments[i] 值是否可行呢?

  • 那有意思的是,关于arguments行为,它的值永远与对应的命名参数值保持同步,他会修改当下函数内的值!!!,也就是说参数与arguments[i]内存空间时独立的,但是值会同步。
function fun(num1, num2) {
    arguments[1] = 10;
    alert(arguments[0] + num2);
}

</script>
<form>
 <br><input type="button" onclick="fun(10,20)" value="点击">
</form>

他弹出框的值就是20;可见是修改arguments[i]值,会自动反应到这个参数当中,要是没有这个参数,重写这个参数值,将会导致语法错误。代码不会执行。如果有两个相同的函数名他不会报错,但是该名字只属于后定义的函数。

总结:

  • JavaScript函数与其他语言函数有很多细节之处不同。
  • 无需非得要返回值,因为在任何时候他都可以返回任何值
  • arguments.length长度由传入参数的个数确定,而不是定义时函数的命名数决定。
  • 是没有重载的,即参数是可以0个或者多个的的数组形式参与的,并且通过arguments对象来访问这些参数。

到此这篇关于JavaScriptfunction函数详细介绍的文章就介绍到这了,更多相关JavaScript的function函数内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木!

Javascript 相关文章推荐
Jquery Ajax学习实例7 Ajax所有过程事件分析示例
Mar 23 Javascript
jquery remove方法应用详解
Nov 22 Javascript
JQuery中serialize() 序列化
Mar 13 Javascript
Javascript 字符串模板的简单实现
Feb 13 Javascript
JS面试题---关于算法台阶的问题
Jul 26 Javascript
更改BootStrap popover的默认样式及popover简单用法
Sep 13 Javascript
关于Vue项目跨平台运行问题的解决方法
Sep 18 Javascript
elementUI select组件默认选中效果实现的方法
Mar 25 Javascript
vue.js 2.0实现简单分页效果
Jul 29 Javascript
jQuery zTree插件快速实现目录树
Aug 16 jQuery
微信小程序 函数防抖 解决重复点击消耗性能问题实现代码
Sep 12 Javascript
js实现点击生成随机div
Jan 16 Javascript
JavaScript文档对象模型DOM
Nov 20 #Javascript
四十九个javascript小知识实用技巧
Nov 20 #Javascript
js不常见操作运算符总结
Nov 20 #Javascript
javascript的setTimeout()使用方法总结
Nov 20 #Javascript
JavaScript异步操作中串行和并行
Nov 20 #Javascript
vue中 this.$set的使用详解
如何用vue实现网页截图你知道吗
You might like
curl实现站外采集的方法和技巧
2014/01/31 PHP
thinkphp集成前端脚手架Vue-cli的教程图解
2018/08/30 PHP
php设计模式之职责链模式实例分析【星际争霸游戏案例】
2020/03/27 PHP
window.open的功能全解析
2006/10/10 Javascript
使用prototype.js进行异步操作
2007/02/07 Javascript
FireFox与IE 下js兼容触发click事件的代码
2008/11/20 Javascript
jQuery解决iframe高度自适应代码
2009/12/20 Javascript
浅析IE10兼容性问题(frameset的cols属性)
2014/01/03 Javascript
js在数组中删除重复的元素自保留一个(两种实现思路)
2014/08/22 Javascript
jQuery的load()方法及其回调函数用法实例
2015/03/25 Javascript
node.js调用C++开发的模块实例
2015/07/03 Javascript
jQuery中的siblings用法实例分析
2015/12/24 Javascript
javascript断点调试心得分享
2016/04/23 Javascript
jQuery的Cookie封装,与PHP交互的简单实现
2016/10/05 Javascript
angular json对象push到数组中的方法
2018/02/27 Javascript
Vue2.0 http请求以及loading展示实例
2018/03/06 Javascript
vue+element-ui动态生成多级表头的方法
2018/08/28 Javascript
使用VUE实现在table中文字信息超过5个隐藏鼠标移到时弹窗显示全部
2019/09/16 Javascript
解决vue+webpack项目接口跨域出现的问题
2020/08/10 Javascript
Pycharm编辑器技巧之自动导入模块详解
2017/07/18 Python
python如何重载模块实例解析
2018/01/25 Python
python构建深度神经网络(续)
2018/03/10 Python
详解Python并发编程之创建多线程的几种方法
2019/08/23 Python
基于Python编写一个计算器程序,实现简单的加减乘除和取余二元运算
2020/08/05 Python
python判断变量是否为列表的方法
2020/09/17 Python
捷克体育用品购物网站:D-sport
2017/12/28 全球购物
欧洲最大的拼图游戏商店:JigsawPuzzle.co.uk
2018/07/04 全球购物
CHARLES & KEITH加拿大官网:新加坡时尚品牌
2020/03/26 全球购物
广播电视新闻学专业应届生求职信
2013/10/08 职场文书
2014年基层党建工作总结
2014/11/11 职场文书
2015年老干部工作总结
2015/04/23 职场文书
观看建国大业观后感
2015/06/01 职场文书
职业规划从高考志愿专业选择开始
2019/08/08 职场文书
浅谈如何提高PHP代码质量之端到端集成测试
2021/05/28 PHP
Python初学者必备的文件读写指南
2021/06/23 Python
Python 中的 copy()和deepcopy()
2021/11/07 Python