JavaScript之Function类型

1. 创建方式

    //1.函数声明
    function sum(num1,num2){
        return num1+num2;
    }
    //2.函数表达式
    var sum = function(num1,num2){
        return num1+num2;
    }
    //3.使用new关键字，创建Function类型的实例----不推荐
    var sum = new Function("num1","num2","return num1+num2;");

    console.log(sum(1,2));//3

函数声明和函数表达式最大的区别是：函数声明提升(可以在声明前调用该函数)

2. 理解：“函数是对象，函数名是指向该对象的指针”

例1.

    function sum(num1, num2) {
        return num1 + num2;
    }

    var anotherSum = sum;
    sum = null;
    console.log(anotherSum(1, 2));//3

例2.

    function echo() {
        return 4;
    }

    function echo(num) {
        return num;
    }

    console.log(echo());//undefined

JavaScript中没有重载：函数名为绑定函数的引用，一个引用只能绑定一个函数对象，所以JS中函数没有重载！

3. 内置对象：arguments和this

 

arguments

该内置对象的行为非常类似Array类型，但实际上并非Array的实例。

例3.

function test(a,b,c){
    console.log(arguments[0]);
    console.log(arguments[1]);
    console.log(arguments[2]);
    console.log(arguments.length);
}

test(1,'a');

arguments对象的长度是由实参个数而不是形参个数决定！

例2.

    function factorial(num){
        if (1 == num) {
            return 1;
        } else if (num > 1) {
            return num * arguments.callee(num - 1);
        }
    }

arguments属性callee为此arguments对象所在的当前函数引用，可以通过它实现递归，解耦函数名！

this

链接 http://www.cnblogs.com/ZHeGeS/p/4715570.html

 

4. 固有的属性和方法

 

caller

caller（保存调用当前函数的函数的引用），即调用者的引用。如果在全局作用域中调用当前函数，它的值为null

prototype

链接：http://www.cnblogs.com/ZHeGeS/p/4870332.html

call和apply

每个函数都包含两个非继承而来的方法：apply和call(在特定作用域中调用函数，等同于设置函数体内this对象的值)

用法：

call(thisObj,var1,var2,var3)

apply(thisObj,[var1,var2,var3]/arguments)

区别：

call要逐个填入参数、apply不仅可以直接传入参数数组而且可以把当前函数的arguments对象传入！

    function sum(num1,num2){
        return num1+num2;
    }
    function callsum1(num1,num2){
        return sum.apply(this,arguments);//这里的this为window对象
    }
    function callsum2(num1,num2){
        return sum.apply(this,[num1,num2]);
    }
    function callsum3(num1,num2){
        return sum.call(this,num1,num2);
    }

    console.log(callsum1(10,10)+" "+callsum2(10,10)+" "+callsum3(10,10));

call/apply真正强大的地方在于：扩充函数赖以运行的作用域的同时，不需要与方法有任何耦合关系！

例1.通过耦合的方式扩充作用域：

var name = "ZheG"
function echoName(){
    alert(this.name);
}
var echo = {
    name:"sansan",
    echoName:echoName
}

echoName();//"ZheG"
echo.echoName();//"sansan"

例2.采用apply/call通过解耦的方式扩充作用域：

var name = "ZheG"
function echoName(){
    alert(this.name);
}

var echo = {
    name:"sansan"
}

echoName();//"ZheG"
echoName.call(echo);//"sansan"
alert(echo.echoName);//undefined,可知echoName和对象echo没有任何关系了！

例3.

    $(".login-button:first").click(function(){

        $(this).attr("buttonName","loginBtn");
        echoBtnName();//由于当时作用域中的this为windows，所以打印undefined
        echoBtnName.call(this);//扩展echoBtnName作用域，使得this为当前点击Dom对象，打印“loginBtn”
    });

    function echoBtnName(){
       //alert(this.buttonName);this只能获得原生的Dom属性，无法获得自定义的属性！
        //alert(this.tagName);//获得标签名称
        alert($(this).attr("buttonName"));//alert($(this).attr("buttonname"));也可以
    }