javascript - Javascript Array of Functions 失去了 This 范围

Question

测试一些代码我发现了这个问题，当我直接调用类Results的函数时，那些工作正常，但是当我将它们推送到一个数组然后我调用那些不起作用的函数时，因为this关键字丢失并且控制台显示未定义的消息。

class Results
{
    sum(numbers){
      let result=numbers.reduce((a,b)=>a+b);
      return result;
    }

    state(numbers){
      console.log(this);
      let result= this.sum(numbers)>0 ? "positive" : "negative";
      return result;
    }
}

function play(){
    let results=new Results(); 

    let numbers=[1,2,3,4];

    console.log(results.sum(numbers));
    console.log(results.state(numbers));

    let arrayfunctions=[];

    arrayfunctions.push(results.sum);
    arrayfunctions.push(results.state);

    arrayfunctions.forEach(funcion=>
    {
        console.log(funcion(numbers))
    });
}

标签： javascriptscope

Answer 1

轻微的变化是定义类方法。

sum(numbers) {
  let result=numbers.reduce((a,b)=>a+b);
  return result;
}

更改为分配给类成员变量的函数

sum = (numbers) => {
  let result=numbers.reduce((a,b)=>a+b);
  return result;
}

class Results
{
    sum = (numbers) => {
      let result=numbers.reduce((a,b)=>a+b);
      return result;
    }

    state = (numbers) => {
      console.log(this);
      let result= this.sum(numbers)>0 ? "positive" : "negative";
      return result;
    }
}

function play(){
    let results=new Results(); 

    let numbers=[1,2,3,4];

    console.log(results.sum(numbers));
    console.log(results.state(numbers));

    let arrayfunctions=[];

    arrayfunctions.push(results.sum);
    arrayfunctions.push(results.state);

    arrayfunctions.forEach(funcion=>
    {
        console.log(funcion(numbers))
    });
}

play();