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 相关文章推荐
WebGame《逆转裁判》完整版 代码下载(1月24日更新)
Jan 29 Javascript
jquery实现非叠加式的搜索框提示效果
Jan 07 Javascript
JavaScript数字和字符串转换示例
Mar 26 Javascript
Javascript实现的常用算法(如冒泡、快速、鸽巢、奇偶等)
Apr 29 Javascript
JS小游戏之仙剑翻牌源码详解
Sep 25 Javascript
js实现图片轮播效果
Dec 19 Javascript
vue中如何实现变量和字符串拼接
Jun 19 Javascript
五步轻松实现JavaScript HTML时钟效果
Mar 25 Javascript
JS实现数组的增删改查操作示例
Aug 29 Javascript
koa2的中间件功能及应用示例
Mar 05 Javascript
Openlayers学习之地图比例尺控件
Sep 28 Javascript
分享几个JavaScript运算符的使用技巧
Apr 24 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
php正则表达式(regar expression)
2011/09/10 PHP
PHP消息队列用法实例分析
2016/02/12 PHP
PHP PDOStatement::fetchAll讲解
2019/01/31 PHP
Bookmarklet实现启动jQuery(模仿 云输入法)
2010/09/15 Javascript
jQuery 常见操作实现方式和常用函数方法总结
2011/05/06 Javascript
jQuery Form 页面表单提交的小例子
2013/11/15 Javascript
JavaScript-RegExp对象只能使用一次问题解决方法
2014/06/23 Javascript
JavaScript插件化开发教程(五)
2015/02/01 Javascript
微信小程序 定义全局数据、函数复用、模版等详细介绍
2016/10/27 Javascript
AngularJS使用ng-inlude指令加载页面失败的原因与解决方法
2017/01/19 Javascript
Angular.JS中指令ng-if的注意事项小结
2017/06/21 Javascript
微信小程序实现倒计时60s获取验证码
2020/04/17 Javascript
详解在Vue中有条件地使用CSS类
2017/09/30 Javascript
什么是Vue.js框架 为什么选择它?
2017/10/17 Javascript
vue.js通过路由实现经典的三栏布局实例代码
2018/07/08 Javascript
NodeJS 将文件夹按照存放路径变成一个对应的JSON的方法
2018/10/17 NodeJs
vue动态禁用控件绑定disable的例子
2019/10/28 Javascript
JQuery中的常用事件、对象属性与使用方法分析
2019/12/23 jQuery
vue Cli 环境删除与重装教程 - 版本文档
2020/09/11 Javascript
[51:53]完美世界DOTA2联赛循环赛 LBZS vs DM BO2第二场 11.01
2020/11/02 DOTA
[01:06:18]DOTA2-DPC中国联赛 正赛 Phoenix vs Dynasty BO3 第二场 1月26日
2021/03/11 DOTA
Python多线程编程(三):threading.Thread类的重要函数和方法
2015/04/05 Python
Python3网络爬虫之使用User Agent和代理IP隐藏身份
2017/11/23 Python
Pyspider中给爬虫伪造随机请求头的实例
2018/05/07 Python
对python文件读写的缓冲行为详解
2019/02/13 Python
Python enumerate函数遍历数据对象组合过程解析
2019/12/11 Python
Python Pandas list列表数据列拆分成多行的方法实现
2020/12/14 Python
不用游标的SQL语句有哪些
2012/09/07 面试题
自我鉴定四大框架
2014/01/17 职场文书
《社戏》教学反思
2014/04/15 职场文书
清正廉洁演讲稿
2014/05/22 职场文书
民事诉讼代理授权委托书
2014/10/11 职场文书
实习介绍信范文
2015/05/05 职场文书
一个独生女的故事观后感
2015/06/04 职场文书
成人成长感言如何写?
2019/08/16 职场文书
Windows Server 2019 安装DHCP服务及相关配置
2022/04/28 Servers