这个Arg-in.forEach的目的是什么
What is the purpose of thisArg in .forEach?
JavaScript的forEach文档指出.forEach
语法为:
arr.forEach(callback[, thisArg])
thisArg
的用途是什么?
可以提供thisArg
来更改回调函数的内部this
。
不指定thisArg
导致this
在非严格模式下引用Window
。在严格模式("use strict";
)中,它将是undefined
。
如果您对以下事实感到困惑,thisArg
在使用箭头函数时不会执行任何操作:
var myObject = { name: 'myObject' };
[1,2].forEach(item => {
console.log(item); // 1, 2
console.log(this === myObject, this); // false Window {}
}, myObject)
这是因为:
无法绑定箭头函数
在箭头函数中,如果没有作用域提供this
值,则this
指代最接近作用域的this
,一直到Window。它的工作方式就像普通的变量查找一样,直到找到一些this
为了更好地理解this
,请参阅本要点或运动场
具有正常功能的上下文绑定
var myObject = { name: 'myObject' };
[1,2].forEach(function(item){
console.log(item); // 1, 2
console.log(this === myObject, this); // true {name: "myObject"}
}, myObject)
如果此时未指定myObject
,则内部的this
将与箭头函数一样指向Window
。
thisArg
是指应该调用回调的上下文,基本上就是CCD_ 20在回调中所指的。例如:
var myObject = { name: 'myObject' };
[1,2].forEach(function(item) {
console.log(item); // 1, 2
console.log(this === myObject); // true
}, myObject)
this
值是一个与execution context
相关的特殊对象。
一个对象,在该对象的上下文中,执行上下文被激活
this
的值在进入上下文时仅确定一次并且不可能为这个分配新的值
在您的情况下,提供thisArg
就像
arr.forEach(callback.bind(thisArg));
forEach
,为您简化了它,要求单独的可选参数
现在,如果您在没有this
的情况下运行此forEach
arr.forEach(function(item) {
console.log(this === window); //true
console.log(this === arr); //false
});
你明白了!
我认为这些测试会让整个事情变得清楚只需在浏览器控制台中进行测试
arr=[0];
arr.forEach(function(item) {
console.log(this === window); //true
console.log(this === arr); //false
});
arr.forEach(function(item) {
console.log(this === window); //true
console.log(this === arr); //false
},this);
arr.forEach(function(item) {
console.log(this === window); //false
console.log(this === arr); //true
},arr);
arr.forEach(function(item) {
console.log(this === window); //false
console.log(this === arr); //false
},0);
我经常在原型和函数的上下文中使用这个:
var MyClass = function() {
this.GlobalVar = 3;
}
MyClass.prototype.func1 = function(a) {
return (a == this.GlobalVar);
}
MyClass.prototype.func2 = function(arr) {
arr.forEach(function(item) {
console.log(this.func1(item));
}, this); // use of thisArg
}
MyClass.prototype.func3 = function(arr) {
var that = this;
arr.forEach(function(item) {
console.log(that.func1(item));
}); // also possible without using thisArg
}
MyClass.prototype.func4 = function(arr) {
arr.forEach(function(item) {
console.log(this.func1(item));
}); // implementation raising an error, because this.func1 does not exist in that context
}
var arr = [0, 1, 3, 4, 3, 1];
var myClass = new MyClass();
myClass.func2(arr);
/* prints:
false
false
true
false
true
false
*/
myClass.func3(arr) /* same as func2 */
myClass.func4(arr); /* Fails with
Error: {
"message": "TypeError: this.func1 is not a function",
"filename": "https://stacksnippets.net/js",
"lineno": 35,
"colno": 26
}
*/
相关文章:
- 这是什么 ==- javascript 运算符
- 我的单元测试选项是什么
- 打破承诺链的好方法是什么
- 在AngularJS应用程序中使用封装指令和路由的推荐方式是什么
- Javascript中的空白是什么
- 是什么让一个“;Uncaught RangeError:超过了最大调用堆栈大小“;错误(Chrome,在其他浏览器中显示
- 在JavaScript中拆分日期字符串的更好方法是什么
- 将jQuery.ech()方法转换为本地JavaScript抽象的最佳方法是什么
- 处理浮点错误的最佳方法是什么
- javascript导入的最佳实践是什么
- 基于窗口宽度jquery的函数的替代方法是什么
- 在ng重复循环中显示条件内容的最佳方式是什么
- 我的客户端选项是什么
- 这是什么“;要求“;事情
- 未捕获的类型错误:topFrame.window.changeSelectedBarStyle不是函数,原因是什么
- 实现比较方法的最佳实践是什么;s的比较类型是在运行时选择的
- @@(“at at”)在ES6 JavaScript中是什么意思
- knex:根据结果创建数组的合适方法是什么
- “return”关键字在“forEach”函数中是什么意思
- 这个Arg-in.forEach的目的是什么