码迷,mamicode.com
首页 > 编程语言 > 详细

浅析JavaScript中Function对象(一)

时间:2018-09-25 01:09:23      阅读:170      评论:0      收藏:0      [点我收藏+]

标签:超过   实参   length   callee   alert   选择器   nbsp   har   方法   

  一、Function对象及其原型对象

  Function对象是js中一个非常重要的对象,所有通过function关键字声明的函数,本质上都是由Function这个特殊的构造器对象创建出来的,也就是new出来的。

  首先要明确的一点就是,在JS中万物皆对象,所以函数本身也是对象,只不过函数对象比较特殊,比其他对象多一个prototype属性。所以Function既是对象,也是函数(构造器),其实更准确的说就是函数对象。

  其次,更特殊的一点是,由于js中所有的对象都是由构造器new出来的,那么Function既然也是个对象,那么它又是由谁构造出来的呢?这个答案我们可以考察它的prototype和__proto__属性就能得出答案。

console.log(Function.prototype == Function.__proto__);//true

  也就是说,Function函数的prototype和__proto__指向的是同一个对象,换句话说就是Function自己构造了自己。到了这里,其实就成了“蛋”和“鸡”的关系了。到底是先有鸡还是先有蛋?这是个问题,但也不是问题,对于我们开发人员来说,我们压根没必要在这个问题上纠结,因为这个问题丝毫不会影响我们开发项目。我们这需要知道有这么一个扯淡的事情就OK了。

  二、arguments

  其实arguments有2个,惊喜不惊喜,以外不意外?

  1.arguments属性

  其语法是:function.arguments 属性:代表传入函数的实参,它是一个伪数组对象。已废弃。

function test(var1,var2){
    console.log(test.arguments[0]+test.arguments[1]);
}

  注意: 1)、使用函数名调用;2)、arguments数组访问的是本次函数调用时传入的实参,而非上一次调用时的参数(对于嵌套或循环调用需注意!)。推荐使用函数内部的arguments对象:。

  2.arguments对象

  该对象是函数内部的本地变量,而不是函数的属性。使用示例

function test(var1,var2){
    arguments[0]=0;//可改变参数的值
    alert(arguments[0]+arguments[1]);
}
test(1,2);//将提示结果为2

  arguments对象并不是一个真正的Array对象,而是一个伪数组,所以它没有数组的属性与方法(length除外)。

  arguments对象的主要成员有:arguments.callee,arguments.length。

  ①arguments.callee返回该arguments对象所属的函数构造器(即函数),从而可实现匿名函数的递归等 ,例如

function create() {
   return function(n) {
      if (n <= 1)
         return 1;
      return n * arguments.callee(n - 1);//调用该arguments所属的匿名函数构造器。
   };
}
var result = create()(5); // returns 120 (5 * 4 * 3 * 2 * 1)

  ②arguments.length : 返回函数被调用时实际传参的个数。

  来个小例子来说下arguments的用处吧,比如我们封装一个$(selector){}函数,用来获取DOM对象,要求这里的selector能使用各种合法的选择器,比如:"div",“.hide",”#btn"。那么我们可以这么写:

  function $(selector) {  
        if(arguments.length != 1){
            throw new Error("当前参数为: " + arguments.length + "个,但是函数要求必须为1个参数."); 
        }
        if(selector.length > 0){
            var firstChar = selector.substr(0,1);// [#|.|tag]
            var lastString = selector.substr(1);
            switch(firstChar){
                case "#":
                    return document.getElementById(lastString);
                case ".":
                    return document.getElementsByClassName(lastString);
                default:
                    document.getElementsByTagName(selector);
            }
        }        
    }

  我们首先要判断用户有没有传递参数,如果没有或者参数超过一个就要报错,那么如何判断用户传递的参数的个数呢?这时候arguments.length就派上用场了。

  三、length属性

  此length属性表示声明的函数的形参个数。

  上面说了,在函数内部可以使用arguments对象,arguments对象有一个length属性。

  其实每一个function对象自己本身也有一个length属性,这个length属性是函数对象的一个属性值,指明该函数期望多少个参数,意即形参的个数。

  四、方法成员:call()   、 apply() 、bind()

  这三个是一个比较难理解的部分,我们放在下一个专题来分析。

浅析JavaScript中Function对象(一)

标签:超过   实参   length   callee   alert   选择器   nbsp   har   方法   

原文地址:https://www.cnblogs.com/ldq678/p/9697153.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!