JavaScript學習(2)call&apply&bind&eval用法

javascript學習(2)call&apply&bind&eval用法

在javascript中存在這樣幾種特別有用的函數，能方便咱們實現各類奇技淫巧。其中，call、bind、apply能改變函數運行時的上下文，或者說動態改變函數內部的this指向的做用，這就給咱們使用時提供了極大的靈活性。而eval能夠將傳入的字符串看成JavaScript代碼執行。本文，簡單的介紹下其中的用法。

1. call

含義：
Function.prototype.call()
可知它是Function原型的一個方法，它自己會調用另一個函數，並接收指定的this值和參數列表。也能夠理解爲，call()方法中接收的對象調用當前對象所擁有的函數，而返回值則是該調用方法的返回值。

用法：

fun.call(thisObj, arg1, arg2, ...)

以上，會將fun的上下文對象this修改成thisObj，並將可選參數arg1，arg2等看成參數傳遞給fun函數。

示例：

var student = {
    name: "張三",
    age: 18,
    getInfo: function(desc) {
        console.log(desc + "," + this.name + "," + this.age);
    }
}

var xiaoming = {
    name: "小明",
    age: 20,
}

student.getInfo.call(xiaoming);       // welcome,小明,20

2. apply

Function.prototype.apply()
應該說apply方法跟call方法的做用相似，只是apply接收的參數是指定的this值和一個包含多個參數的數組做爲參數列表，而call是接受若干個參數的列表。

用法：

fun.apply(thisObj, [argsArray])

注意，argsArray是一個數組或者類數組對象。

示例：

var student = {
    name: "張三",
    age: 18,
    getInfo: function(desc) {
        console.log(desc + "," + this.name + "," + this.age);
    }
}

var xiaoming = {
    name: "小明",
    age: 20,
}

student.getInfo.apply(xiaoming, ["welcome"]);    //welcome,小明,20

3. bind

Function.prototype.bind()
bind方法會建立一個新的函數，並將原函數this的值綁定爲當前指定的對象，返回由指定this值和初始化參數的原函數的拷貝。

用法：

fun.bind(thisObj[, arg1[, arg2[, ...]]])

即：將fun函數的this值指定爲thisObj，並將參數列表arg1，arg2等傳遞給該函數所建立的一個新的函數。

示例：

var student = {
    name: "張三",
    age: 18,
    getInfo: function(desc) {
        console.log(desc + "," + this.name + "," + this.age);
    }
}

var xiaoming = {
    name: "小明",
    age: 20,
}

var getInfo2 = student.getInfo.bind(xiaoming, "welcome");
getInfo2();                 // welcome,小明,20
console.log(getInfo2);      // [Function: bound getInfo]

4. eval

eval()函數，是全局對象的一個函數屬性。該函數接受一個字符串參數，並會看成javascript代碼來執行，若是接受的不是字符串參數，則原樣返回。

用法：

eval(string)

示例：

console.log(eval("new Date()"));    // 2017-12-09T08:45:23.759Z
console.log(eval(false));           // false

以上幾個是平常開發可能會用到的高級用法，但不限於這些，這裏只是也作了簡單的介紹，主要是促進對javascript的使用與理解，更多後續的使用會陸續更新。