【问题标题】:Using 'this' in javascript function attached to object property [duplicate]在附加到对象属性的javascript函数中使用“this”[重复]
【发布时间】:2019-06-27 03:07:39
【问题描述】:

编辑: 被称为重复的问题并没有真正回答为什么不应该使用箭头函数来访问非词法 this。它只是回答箭头函数会自动绑定 this。我的情况是使用箭头函数而不是普通函数会导致我失去对此的正确引用。如果您需要在当前范围之外使用this,请使用普通函数。

我四处寻找解决问题的方法,但没有成功。即使我被指出了正确的方向,我需要做的事情也会很棒!我的问题本质上是 this.Favkey 在这里未定义:

const setFavorite = val => {
  console.log(this);
  this.Favorite = val;
  AsyncStorage.setItem(this.Favkey, JSON.stringify(val));
};

这个函数被分配给一个特定的对象,如下所示:

  for (const obj of objArray) {
    obj.Favkey = `c${obj['-id=']}`;
    obj.Favorite = await getFavorite(obj.Favkey);
    obj.SetFavorite = setFavorite;
  }

然后我稍后会在一个按钮上调用它:

onPress={val => props.myObj.SetFavorite(val)}

在第一个代码块中,我希望 this 成为我试图将函数包含在其上的特定 obj。但是setFavorite 中的this.Favkey 是未定义的。而在console.log(this) 上打印出来的是我认为是Object 的整个原型。所以我不太确定我在这里做错了什么。

【问题讨论】:

  • arrow function 没有自己的上下文绑定。它们与 function 表达式不同。
  • 被称为重复的问题并没有真正回答为什么不应该使用箭头函数来访问非词法this。它只是回答箭头函数自动绑定this。我的情况是使用箭头函数而不是普通函数会导致我丢失this 的正确引用。
  • 这就是箭头函数的全部意义,欺骗问题的答案可以解释在深入研究 JavaScript 之前应该注意的每一个变化。
  • 抱歉,Emily 我没有回复您,将其标记为重复。没关系。我的评论主要是针对有类似问题的其他人。我的搜索从未找到那个链接的问题,所以谢谢。

标签: javascript arrays function object ecmascript-6


【解决方案1】:

不要使用箭头函数 - 它会丢失与您尝试访问的 this 的绑定。只需使用普通功能:

const setFavorite = function(val) {...};

【讨论】:

  • 完美!你有任何信息说明为什么会这样吗?
猜你喜欢
  • 2015-11-24
  • 1970-01-01
  • 1970-01-01
  • 2015-04-25
  • 2011-08-04
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2017-03-19
相关资源
最近更新 更多