什么是 bind 函数
Link to heading
bind() 方法会创建一个 新函数. bind 允许你设置这个值而不调用 新函数.
bind 函数的语法
Link to heading
fun.bind(thisArg[, arg1[, arg2[, ...]]])
- thisArg 当 新函数 被调用的时候, 该参数会作为原函数的
this指向. 但是, 当使用new操作符调用新函数的时候, 该参数无效. - arg1, arg2, … 这些参数会依次作为原函数的运行参数
例子 Link to heading
this.name = "John"
var myName = {
name: "Tom",
getName: function() {
return this.name
}
}
var storeMyName = myName.getName; // example 1
var storeMyName2 = myName.getName.bind(myName); // example 2
var storeMyName3 = myName.getName(); // example 3
console.log("example 1: " + storeMyName()); // John
console.log("example 2: " + storeMyName2()); // Tom
console.log("example 3: " + storeMyName3); // Tom
我们可以看到对于 example1 来说, 没有 bind(myName), 那么在运行 getName 函数的时候, this 指向了全局, 全局下 name 属性是 John.
对于 example2 来说, this bind 到了 myName, 那么 myName 的 name 属性是 Tom.
对于 example3 来说, 函数在当下就执行了, 给出了 Tom 的结果, 付给了 storeMyName3.
我们再看看下面的图 Link to heading
+-------------------+-------------------+
| | |
| time of | time of |
|function execution | this binding |
| | |
+-------------------+-------------------+-------------------+
| | | |
| function object | future | future |
| f | | |
| | | |
+-------------------+-------------------+-------------------+
| | | |
| function call | now | now |
| f() | | |
| | | |
+-------------------+-------------------+-------------------+
| | | |
| f.call() | now | now |
| f.apply() | | |
| | | |
+-------------------+-------------------+-------------------+
| | | |
| f.bind() | future | now |
| | | |
+-------------------+-------------------+-------------------+