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 相关文章推荐
js程序中美元符号$是什么
Jun 05 Javascript
JQuery+DIV自定义滚动条样式的具体实现
Jun 25 Javascript
Jquery uploadify图片上传插件无法上传的解决方法
Dec 16 Javascript
自定义jquery模态窗口插件无法在顶层窗口显示问题
May 29 Javascript
javascript定义变量时加var与不加var的区别
Dec 22 Javascript
jQuery的事件委托实例分析
Jul 15 Javascript
JavaScript仿百度图片浏览效果
Nov 23 Javascript
bootstrap weebox 支持ajax的模态弹出框
Feb 23 Javascript
详解webpack + react + react-router 如何实现懒加载
Nov 20 Javascript
JS实现的文字间歇循环滚动效果完整示例
Feb 13 Javascript
Vue在chrome44偶现点击子元素事件无法冒泡的解决方法
Dec 15 Javascript
JS绘图Flot应用图形绘制异常解决方案
Oct 16 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加密解密类代码
2011/11/27 PHP
win2003服务器使用WPS的COM组件的一些问题解决方法
2012/01/11 PHP
php实现利用phpexcel导出数据
2013/08/24 PHP
Yii2使用自带的UploadedFile实现的文件上传
2016/06/20 PHP
PHP学习笔记之session
2018/05/06 PHP
jQuery+PHP实现图片上传并提交功能
2020/07/27 PHP
javascript 操作文件 实现方法小结
2009/07/02 Javascript
JS关闭窗口与JS关闭页面的几种方法小结
2013/12/17 Javascript
简介alert()与console.log()的不同
2015/08/26 Javascript
vue 设置proxyTable参数进行代理跨域
2018/04/09 Javascript
vue地址栏直接输入路由无效问题的解决
2018/11/15 Javascript
express express-session的使用小结
2018/12/12 Javascript
vue动态子组件的两种实现方式
2019/09/01 Javascript
JavaScript代码异常监控实现过程详解
2020/02/17 Javascript
js实现跳一跳小游戏
2020/07/31 Javascript
[00:37]DOTA2上海特级锦标赛 OG战队宣传片
2016/03/03 DOTA
python实现数通设备端口监控示例
2014/04/02 Python
Python操作MongoDB数据库PyMongo库使用方法
2015/04/27 Python
python 实现在txt指定行追加文本的方法
2018/04/29 Python
Linux上使用Python统计每天的键盘输入次数
2019/04/17 Python
python实现批量视频分帧、保存视频帧
2019/05/31 Python
Python 3 使用Pillow生成漂亮的分形树图片
2019/12/24 Python
Python @property原理解析和用法实例
2020/02/11 Python
Python+Xlwings 删除Excel的行和列
2020/12/19 Python
联想墨西哥官方网站:Lenovo墨西哥
2016/08/17 全球购物
伦敦眼门票在线预订:London Eye
2018/05/31 全球购物
营销专业应届生求职信
2013/11/26 职场文书
宿舍打麻将检讨书
2014/01/24 职场文书
法学专业毕业生求职信
2014/06/12 职场文书
体育运动会广播稿
2014/10/05 职场文书
中学生自我评价2015
2015/03/03 职场文书
暑期实践个人总结
2015/03/06 职场文书
结婚通知短信怎么写
2015/04/17 职场文书
2015年“7.11”世界人口日宣传活动方案
2015/05/06 职场文书
mysql分表之后如何平滑上线详解
2021/11/01 MySQL
ubuntu开机后ROS程序自启动问题
2022/12/24 Servers