javascript - 数组方法中关于“ thisArg”的困惑(Confusion about 'thisArg' in array methods)

Question

I was learning about arrays methods and there's one thing I don't quite understand, possibly related to closures.(我正在学习数组方法，有一件事我不太了解，可能与闭包有关。)

First things first though, here's the code snippet:(首先，这是代码片段：)

 let range = { minNumber: 20, maxNumber: 30, isValid(number) { return number >= this.minNumber && number < this.maxNumber; } }; let numbers = [16, 23, 27, 30, 45]; let filteredNumbers = numbers.filter(range.isValid, range); console.log(filteredNumbers.length); // 2 console.log(filteredNumbers[0]); // 23 console.log(filteredNumbers[1]); // 27 

From what I understand by passing second argument we bind this to range , otherwise simply calling: numbers.filter(range.isValid) will make this undefined.(从我通过传递第二个参数，我们绑定明白this对range ，否则简单的调用： numbers.filter(range.isValid)将使this不确定的。)

Shouldn't it have access to this either way though, as we're "calling" isValid from range context by using .(但是，它不应该以任何一种方式访问this方法，因为我们使用来从range上下文“调用” isValid .) operator?(操作员？)

There is also a second approach that works:(还有另一种有效的方法：)

numbers.filter(number => range.isValid(number))

What's going on here?(这里发生了什么？)

Now it's able to pick up this from range object all of a sudden?(现在，能够拿起this从range对象一下子？) Arrow functions have no this iirc, so it's not that.(箭头函数没有this iirc，所以不是。)

Thanks for all the help in advance.(感谢您提前提供的所有帮助。)

:)(:))   ask by flamasterrr translate from so

Answer 1

My understanding is that when you call(我的理解是，当您打电话时)

numbers.filter(range.isValid)

really what you are doing is passing the function by referrence or(实际上，您正在做的是通过引用传递函数或)

numbers.filter(isValid(number) {
    return number >= this.minNumber && number < this.maxNumber;
  })

effectively the context is not transferred(eg maxNumber and minNumber are not set anywhere.)(有效地不传输上下文（例如，未在任何地方设置maxNumber和minNumber。）)

when you do(当你做)

numbers.filter(number => range.isValid(number))

it works because the => function does not establish a context so it gets the context from the definition of range in the current scope.(之所以起作用，是因为=>函数未建立上下文，因此它从当前范围中的range定义获取上下文。)

when you do(当你做)

numbers.filter(range.isValid, range)

You are making use of the optional parameter to .filter described below(From W3C docs here: https://www.w3schools.com/jsref/jsref_filter.asp )(您正在使用可选参数对.filter进行如下所述（来自W3C文档： https ：//www.w3schools.com/jsref/jsref_filter.asp）)

Optional.(可选的。)

A value to be passed to the function to be used as its "this" value.(要传递给函数的值用作其“ this”值。) If this parameter is empty, the value "undefined" will be passed as its "this" value(如果此参数为空，则将值“ undefined”作为其“ this”值传递)