JavaScript学习笔记之Function对象


Posted in Javascript onJanuary 22, 2015

 在JavaScript中,函数function就是对象。

JS中没有方法重载

在JavaScript中,没有方法(函数)重载的概念。

例子:

<html>

       <head>

              <script type="text/javascript"> 

              function add(number)

              {

                    alert(number + 20);   

              }

              function add(number, number1)

              {

                     alert(number + 30);   

              }           

              add(10);

              </script>

       </head>

       <body>

       </body>

</html>

网页中弹框显示的是40。

说明虽然第二个方法是两个参数,但是仍然调用了它。

交换两个方法的顺序之后,弹框显示30,可以看出不管参数个数如何,是调用同名的后面的方法。

怎么解释这个现象?

这是因为函数声明实际上是建立了一个对象:

<html>

    <head>

        <script type="text/javascript">

        function add(number)

        {

             alert(number + 20);    

        }

        /*

        上面的函数等价于:

        var add = function(number)

        {

            alert(number + 20);

        }

        */        

        function add(number, number1)

        {

            alert(number + 30);    

        }

        /*

        上面的函数等价于:

        var add = function(number, number1)

        {

            alert(number + 30);

        }    

        */

        add(10);

        </script>

    </head>

    <body>    

    </body>

</html>

这样add实际指向的是后面的对象,而方法调用的时候赋予的参数将会按顺序赋给方法形式参数,后面没有被赋值的参数就是undefined。

JavaScript的函数调用的时候没有严格的参数个数检查,实参个数小于形参个数是可以的,没有被赋值的形参就是未定义值undefined。

实参个数大于形参个数也是可以的,这样只有前面的实参会被使用,多出来的实参不会被使用。

Function对象

在JavaScript中有一个Function对象,所有自定义的函数都是Function对象类型的。

Function对象接收的所有参数都是字符串类型的,其中最后一个参数就是要执行的函数体,而前面的参数则是函数真正需要接收的参数。

例子:

<html>

    <head>

        <script type="text/javascript">

        var add = new Function("number", "number1", "alert(number + number1);");

        var add = new Function("number", "alert(number + 20);");

        add(10, 30);

        </script>

    </head>

    <body>    

    </body>

</html>

隐含对象arguments

在JavaScript中,每个函数都有一个隐含的对象arguments,表示给函数实际传递的参数。

arguments和函数的形式参数及其个数无关。

arguments有个有用的属性length,表示实参的长度。可以借助这个来模拟出函数的重载:

练习例子:

<html>

    <head>

        <script type="text/javascript">

        function add(number1, number2)

        {

            alert(arguments.length);            

            alert(arguments[0]);

            alert(arguments[1]);

            alert(arguments[2]);

        }    

        //add(2, 3, 4);

        function add2()

        {

            if(1 == arguments.length)

            {

                alert(arguments[0]);

            }

            else if(2 == arguments.length)

            {

                alert(arguments[0] + arguments[1]);

            }

            else if(3 == arguments.length)

            {

                alert(arguments[0] + arguments[1] + arguments[2]);

            }

        }

        add2(3);

        add2(3, 4);

        add2(3, 4, 5);

        </script>

    </head>

    <body>    

    </body>

</html>

每一个函数对象都有一个length属性,表示该函数期望接收的参数格式。

它与函数的arguments不同,arguments.length表示函数实际接收的参数个数。

例子:

<html>

    <head>

        <script type="text/javascript">

        var add = function(num, num2, num3)

        {

            alert(num + num2 + num3);

        }    

        alert(add.length); //输出3

        add(1, 2, 3);

        var add2 = function()

        {

        }

        alert(add2.length); //输出0

        </script>

    </head>

    <body>

    </body>

</html>
Javascript 相关文章推荐
jquery 打开窗口返回值实现代码
Mar 04 Javascript
基于jquery的一个图片hover的插件
Apr 24 Javascript
js null undefined 空区别说明
Jun 13 Javascript
JS数学函数Exp使用说明
Aug 09 Javascript
JS 实现Json查询的方法实例
Apr 12 Javascript
js随机生成网页背景颜色的方法
Feb 26 Javascript
Bootstrap优化站点资源、响应式图片、传送带使用详解3
Oct 14 Javascript
基于webpack4.X从零搭建React脚手架的方法步骤
Dec 23 Javascript
JS实现获取当前所在周的周六、周日示例分析
May 11 Javascript
javascript实现导航栏分页效果
Jun 27 Javascript
JS数组方法slice()用法实例分析
Jan 18 Javascript
微信小程序APP页面的之间的相互传递参数以及自定义组件
Apr 19 Javascript
JavaScript学习笔记之Cookie对象
Jan 22 #Javascript
javascript二维数组转置实例
Jan 22 #Javascript
JavaScript学习笔记之内置对象
Jan 22 #Javascript
JavaScript学习笔记之JS事件对象
Jan 22 #Javascript
jquery实现搜索框常见效果的方法
Jan 22 #Javascript
JavaScript学习笔记之定时器
Jan 22 #Javascript
JavaScript学习笔记之JS对象
Jan 22 #Javascript
You might like
ThinkPHP中U方法的使用浅析
2014/06/13 PHP
PHP操作MySQL事务实例
2014/11/05 PHP
PHP实现的日历功能示例
2018/09/01 PHP
js函数的延迟加载实现代码
2012/10/11 Javascript
js文件Cookie存取值示例代码
2014/02/20 Javascript
使用jQuery中的when实现多个AJAX请求对应单个回调的例子分享
2014/04/23 Javascript
关于JavaScript中name的意义冲突示例介绍
2014/05/29 Javascript
Vue form 表单提交+ajax异步请求+分页效果
2017/04/22 Javascript
VUE + UEditor 单图片跨域上传功能的实现方法
2018/02/08 Javascript
JavaScript 作用域实例分析
2019/10/02 Javascript
webpack常用构建优化策略小结
2019/11/21 Javascript
原生JS实现留言板功能
2020/02/08 Javascript
vue3.0封装轮播图组件的步骤
2021/03/04 Vue.js
Flask框架通过Flask_login实现用户登录功能示例
2018/07/17 Python
使用python脚本实现查询火车票工具
2018/07/19 Python
python3+requests接口自动化session操作方法
2018/10/13 Python
python发送多人邮件没有展示收件人问题的解决方法
2019/06/21 Python
python实现动态创建类的方法分析
2019/06/25 Python
对pytorch的函数中的group参数的作用介绍
2020/02/18 Python
Python调用shell cmd方法代码示例解析
2020/06/18 Python
PyQt5结合matplotlib绘图的实现示例
2020/09/15 Python
纯CSS实现颜色渐变效果(包含环形渐变、线性渐变、彩虹效果等)
2014/05/07 HTML / CSS
请解释接口的显式实现有什么意义
2012/05/26 面试题
儿科护理实习自我鉴定
2013/09/19 职场文书
我的网上商城创业计划书
2013/12/26 职场文书
服装设计师求职信
2014/06/04 职场文书
大学毕业典礼演讲稿
2014/09/09 职场文书
学校总务处领导干部个人对照检查材料思想汇报
2014/10/06 职场文书
大学生考试作弊检讨书1000字
2014/10/14 职场文书
地方课程教学计划
2015/01/19 职场文书
抢劫罪辩护词
2015/05/21 职场文书
纪委立案决定书
2015/06/24 职场文书
中学总务处工作总结
2015/08/12 职场文书
个人工作失误的保证书怎么写?
2019/06/21 职场文书
golang 实现对Map进行键值自定义排序
2021/04/28 Golang
Java中Quartz高可用定时任务快速入门
2022/04/03 Java/Android