js函数的几个特殊点

时间：2021-07-17 11:38:46

在ECMAScript中，Function(函数)类型实际上是对象。每个函数都是Function类型的实例，而且都与其他引用类型一样具有属性和方法。由于函数是对象，因此函数名实际上也是一个指向函数对象的指针。

1 函数的返回值和函数作为参数传递

//函数传递给函数

function box(sum,num){

    return sum+num;

}

function sum(num){

    return num+10;

}

var result = box(sum(10),10);  //这里传递的是函数的返回值

alert(result);  //

//要把函数本身传递，而不是函数的结果

function box(sum,num){

    return sum(num);

}

function sum(num){

    return num+10;

}

var result = box(sum,10);  //这里sum是函数，而不是返回值

alert(result);  //

2 this 和arguments

在函数内部，有两个特殊的对象：arguments和this。arguments是一个类数组对象，包含着传入函数中的所有参数，主要用途是保存函数参数。但这个对象还有一个名叫callee的属性，该属性是一个指针，指向拥有这个arguments对象的函数。

//arguments.callee对象

//改进，使用arguments.callee动态调用自身，作用同上，但改变函数名时，里边的不用都修改一遍了

function box(num){

    if(num<1){

        return 1;

    }else{

        return num*arguments.callee(num-1);

    }

}

alert(box(4))*/

/*//this对象

//window是js中最外围对象

alert(typeof window);  //window对象,类型是对象

alert(this);            //这时的this就是window

var color='red';   //这里的color是全局遍量，又是window的属性

alert(window.color);//red

alert(this.color);//同上

//那么

window.color = "red"//相当于var color = 'red';

var box ={

    color:'blue',

    sayColor:function(){

        alert(this.color);  //this代表box

    }

}

box.sayColor();// blue

//另一种写法

window.color="红色";

function sayColor(){

    alert(this.color);

}

sayColor();                //红色

var box ={

    color:"蓝色的"

};

box.sayColor=sayColor;

box.sayColor();             //蓝色*/

3 length 和  prototype

每个函数都包含两个属性：length和prototype。其中，length属性表示函数希望接收的命名参数的个数。

//legth属性,传递参数的个数

function box(name,age){

    return name+age;

}

alert(box.length) //

对于prototype属性，它是保存所有实例方法的真正所在，也就是原型。详见面向对象一章详细介绍。

PS：而prototype下有两个方法：apply()和call()，每个函数都包含这两个非继承而来的方法。这两个方法的用途都在特定的作用域中调用函数，实际上等于设置函数体内this对象的值。

//prototype属性下有apply()和call()两个方法,apply()和call()，每个函数都包含这两个非继承而来的方法。

//这两个方法的用途都在特定的作用域中调用函数，实际上等于设置函数体内this对象的值。

function box(num1,num2){

    return num1+num2;

}

function sum(num1,num2){

    return box.apply(this,[num1,num2]);//此处this表示window作用域，[]表示传递的参数

}

alert(sum(10,10));

//当参数多时麻烦，可以这样

function sum(num1,num2){

    return box.apply(this,arguments);

}

function box(num1,num2){

    return num1+num2;

}

function sum(num1,num2){

    return box.call(this,num1,num2);//call只是不用传递数组了

}
//两者的正真用处是改变作用域

//假如下边直接执行sayColor是全局红色

var color = "红色的";

var box ={

    color:"蓝色的"

}

function sayColor(){

    alert(this.color);

}

//用call是实现对象冒充，冒充box下，或window下

sayColor.call(this); //红色

sayColor.call(box);  //蓝色，不用apply是因为此处没有传参，用call方便

使用call()或者apply()来扩充作用域的最大好处，就是对象不需要与方法发生任何耦合关系(耦合，就是互相关联的意思，扩展和维护会发生连锁反应)。也就是说，box对象和sayColor()方法之间不会有多余的关联操作，比如 box.sayColor = sayColor;

另：call()方法于apply()方法（接受的是数组）相同，他们的区别仅仅在于接收参数的方式不同。对于call()方法而言，第一个参数是作用域，没有变化，变化只是其余的参数都是直接传递给函数的。

相关文章