这个陈述有什么作用? console.log.bind(控制台) [英] What does this statement do? console.log.bind(console)
问题描述
我正在使用JavaScript并且语句出现问题
I am using JavaScript and getting a problem with the statement
console.log.bind(console)
请告诉我这个陈述实际上做了什么。我已经多次申请但没有做任何事情。
Please tell me what does this statement actually do. I have applied this several times but it did not do anything.
推荐答案
在JavaScript中,这个函数调用中的code>由如何调用函数确定(对于正常函数,请参见下面的*)。如果它被作为检索对象属性的表达式的一部分调用(例如,
foo.bar()
调用 bar()
作为从 foo
获取它的属性检索操作的一部分,此
设置为属性来自的对象在调用函数期间。
In JavaScript, this
within a function call is determined by how the function is called (for normal functions, see * below). If it's called as part of an expression retrieving an object property (e.g., foo.bar()
calls bar()
as part of a property retrieval operation getting it from foo
), this
is set to the object that the property came from during the call to the function.
假设你想要一个较短形式的 console.log
,比如˚F
。你可以这样做:
Suppose you wanted a shorter form of console.log
, like f
. You might do this:
var f = console.log; // <== Suspect!
...但是如果 log
功能在调用期间依赖 this
引用 console
对象,然后调用 f(消息这里)
将无效,因为此
将不会引用 console
。
...but if the log
function relies on this
referring to the console
object during the call, then calling f("Message here")
won't work, because this
won't refer to console
.
函数#bind
就是出于这种情况:它允许你创建一个新的函数,当被调用时,它将会使用调用原始文件,将此
设置为您提供的值。所以
Function#bind
is for just that situation: It lets you create a new function that, when called, will call the original with this
set to the value you give. So
var f = console.log.bind(console); // Still suspect, for a different reason
... 应该,理论上,给你一个函数 f
,你可以调用它来登录控制台。
...should, in theory, give you a function, f
, that you can call to log to the console.
除外:主机提供的功能,如 console.log
(以及 alert
和 getElementById
)不需要是真正的JavaScript函数(尽管在现代浏览器中它们往往是,或者至少非常接近),并且不需要具有所有功能,包含 bind
。因此,如果您在该行上收到错误,可能是您使用该行的引擎在 bind
> console.log function。
Except: Host-provided functions like console.log
(and alert
and getElementById
) aren't required to be "real" JavaScript functions (although on modern browsers they tend to be, or at least very close), and aren't required to have all of their features, inculding bind
. So if you're getting an error on that line, it may be that the engine you're using that line on doesn't support bind
on the console.log
function.
那么什么是主机提供的功能?任何未在规范中明确定义为 JavaScript (语言)一部分的函数。再次,在浏览器上,浏览器相关的功能,如 alert
或 console.log
等。
So what are "host-provided functions"? Any function not explicitly defined in the specification as being part of JavaScript, the language. So again, on a browser that's browser-related functions like alert
or console.log
and such.
我可以想到这两行可能给你带来麻烦的原因:
I can think of two reasons that line might be giving you trouble:
-
以上:您使用的JavaScript引擎不会使
console.log
成为一个真正的函数。
The above: You're using a JavaScript engine that doesn't make
console.log
a real function.
您正在IE上使用上面的行并关闭了Dev Tools。在IE上,当dev工具未打开时, console
对象未定义,因此该行将抛出 ReferenceError
。
You're using the line above on IE with the Dev Tools closed. On IE when the dev tools aren't open, the console
object isn't defined, and so that line will throw a ReferenceError
.
如果最终目标是获得一个你可以打电话的功能,比如说 f(在这里留言)
,对于 console.log
,以下是处理上述#1和#2的方法:
If the end goal is to get a function you can call, say f("Message here")
, for console.log
, here's how you can do that dealing with both #1 and #2 above:
function f(item) {
if (typeof console != "undefined" && console.log) {
console.log(item);
}
}
这只允许你给一个项目,而 console.log
允许你提供多个项目( console.log(this,that,and other)
),但是如果 console.log
可能不是真正的JavaScript函数,那么它可能没有函数#application
,这使它很难包装。
That only lets you give one item, whereas console.log
lets you give multiple items (console.log("this", "that", "and the other")
), but if console.log
may not be a real JavaScript function, then it may not have Function#apply
, which makes it very hard to wrap it.
现在,如果你不关心获得相同的输出你会得到 console.log(this,that,and other)
只要你能看到它的内容,只需使用控制台即可。 log(arguments);
( arguments
是传递给函数的所有参数的内置标识符)。但是如果你想复制确切的输出,你最终会做这样的事情:
Now, if you don't care about getting the same output you'd get from console.log("this", "that", "and the other")
so long as you can see what's there, simply use console.log(arguments);
(arguments
is the built-in identifier for all arguments passed into a function). But if you want to replicate the exact output, you end up doing something like this:
function f() {
var a = arguments;
if (typeof console != "undefined" && console.log) {
if (console.log.apply) {
// It has Function#apply, use it
console.log.apply(console, arguments);
} else {
// Ugh, no Function#apply
switch (a.length) {
case 0: console.log(); break;
case 1: console.log(a[0]); break;
case 2: console.log(a[0], a[1]); break;
case 3: console.log(a[0], a[1], a[2]); break;
case 4: console.log(a[0], a[1], a[2], a[3]); break;
case 5: console.log(a[0], a[1], a[2], a[3], a[4]); break;
default:
throw "f() only supports up to 5 arguments";
}
}
}
}
。 ..那只是丑陋。
* ES5添加绑定函数,这些函数是将此
值通过绑定附加到它们上:
* ES5 added bound functions, which are functions that have their this
value attached to them via binding:
// Normal function
function foo() {
console.log(this.name);
}
// Create a bound function:
var f = foo.bind(someObject);
如何调用 f
,它将调用 foo
,此
设置为 someObject
。
It doesn't matter how you call f
, it will call foo
with this
set to someObject
.
* ES2015(又名ES6)添加了箭头功能。使用箭头函数,此
不根据函数的调用方式设置;相反,该函数从创建它的上下文继承 this
:
* ES2015 (aka ES6) added arrow functions. With arrow functions, this
is not set by how the function is called; instead, the function inherits this
from the context in which it was created:
// Whatever `this` is here...
var f = () => { // <== Creates an arrow function
// Is what `this` will be here
};
当您执行类似 Array#forEach的操作时,箭头函数非常方便
在对象方法中:
Arrow functions are really handy when you're doing something like Array#forEach
within an object method:
this.counter = 0;
this.someArray.forEach(entry => {
if (entry.has(/* some relevant something */)) {
++this.counter;
}
});
这篇关于这个陈述有什么作用? console.log.bind(控制台)的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!