绑定这个和参数
Version >= 5.1
当你在 JavaScript 中引用方法(属性是一个函数)时,它通常不记得它最初附加到的对象。如果该方法需要将该对象称为 this
,则无法将其调用,并且调用它可能会导致崩溃。
你可以在函数上使用 .bind()
方法来创建包含 this
值和任意数量的前导参数的包装器。
var monitor = {
threshold: 5,
check: function(value) {
if (value > this.threshold) {
this.display("Value is too high!");
}
},
display(message) {
alert(message);
}
};
monitor.check(7); // The value of `this` is implied by the method call syntax.
var badCheck = monitor.check;
badCheck(15); // The value of `this` is window object and this.threshold is undefined, so value > this.threshold is false
var check = monitor.check.bind(monitor);
check(15); // This value of `this` was explicitly bound, the function works.
var check8 = monitor.check.bind(monitor, 8);
check8(); // We also bound the argument to `8` here. It can't be re-specified.
当不处于严格模式时,函数使用全局对象(浏览器中的 window
)作为 this
,除非使用方法 .call
语法将函数作为方法调用,绑定或调用。
window.x = 12;
function example() {
return this.x;
}
console.log(example()); // 12
在严格模式下,this
默认为 undefined
window.x = 12;
function example() {
"use strict";
return this.x;
}
console.log(example()); // Uncaught TypeError: Cannot read property 'x' of undefined(…)
Version >= 7
绑定运算符
双冒号绑定运算符可用作上述概念的缩写语法:
var log = console.log.bind(console); // long version
const log = ::console.log; // short version
foo.bar.call(foo); // long version
foo::bar(); // short version
foo.bar.call(foo, arg1, arg2, arg3); // long version
foo::bar(arg1, arg2, arg3); // short version
foo.bar.apply(foo, args); // long version
foo::bar(...args); // short version
这种语法允许你正常编写,而不用担心在任何地方绑定 this
。
将控制台功能绑定到变量
var log = console.log.bind(console);
用法:
log('one', '2', 3, [4], {5: 5});
输出:
one 2 3 [4] Object {5: 5}
为什么要这么做?
一个用例可以是你有自定义记录器,并且你想决定运行时使用哪一个。
var logger = require('appLogger');
var log = logToServer ? logger.log : console.log.bind(console);