Javascript 在TypeScript中使用forEach访问对象的键和值

为什么在案例1中抛出错误而在案例2中没有

案例1：

导出类AppComponent实现OnInit{
obj={
名称：“XYZ”，
年龄:"22岁",，
高度：“5”
}
恩戈尼尼特（）{
这是调用（）；
}
调用（）{
如果（真）{
Object.keys（this.obj）.forEach（函数（键）
{
console.log（key，this.obj[key]）
}
)
}
}
}

错误：无法读取未定义的属性“obj”

案例2：

导出类AppComponent实现OnInit{
恩戈尼尼特（）{
这是调用（）；
}
调用（）{
如果（真）{
让obj={
名称：“XYZ”，
年龄:"22岁",，
高度：“5”
}
Object.keys（obj）.forEach（函数（key）
{
console.log（key，obj[key]）
}
)
}
}
}

---

在这种情况下，控制台中不会显示错误。

当您使用

函数（）

定义函数时，

此

引用的值会发生更改。如果希望

此

继续引用该类，请使用箭头函数

export class AppComponent implements OnInit {
  obj = {
    name:"XYZ",
    age:"22",
    height:"5"
  }

  ngOnInit() {
    this.calling();
  }
        
  calling(){
    if(true){
      const func = function(key) {
        console.log(key, this.obj[key])
      };

      Object.keys(this.obj).forEach(func.bind(this));
    }
  }
 }

导出类AppComponent实现OnInit{
obj={
名称：“XYZ”，
年龄:"22岁",，
高度：“5”
}
恩戈尼尼特（）{
这是调用（）；
}
调用（）{
如果（真）{
Object.keys（this.obj）.forEach（（key）=>
{
console.log（key，this.obj[key]）
}
)
}
}
}

您还可以通过调用函数来解决此问题，以便在函数中设置

此

export class AppComponent implements OnInit {
  obj = {
    name:"XYZ",
    age:"22",
    height:"5"
  }

  ngOnInit() {
    this.calling();
  }
        
  calling(){
    if(true){
      const func = function(key) {
        console.log(key, this.obj[key])
      };

      Object.keys(this.obj).forEach(func.bind(this));
    }
  }
 }

---

您没有掌握Javascript中的作用域

在第一个示例中，回调函数定义了自己的

this

，因此外部函数

this

不可访问

要解决这个问题，您可以使用箭头函数（或者您可以使用

.bind（this）

，但我从来没有真正使用过它）

//箭头函数
Object.keys（this.obj）.forEach（（key）=>{
console.log（key，this.obj[key]）
)}

以下是有关箭头函数与绑定的更多信息：

您的第二个示例之所以有效，是因为您使用

let

定义了

obj

，因此它可以在函数中访问

export class AppComponent implements OnInit {
  obj = {
    name:"XYZ",
    age:"22",
    height:"5"
  }

  ngOnInit() {
    this.calling();
  }
        
  calling(){
    if(true){
      const func = function(key) {
        console.log(key, this.obj[key])
      };

      Object.keys(this.obj).forEach(func.bind(this));
    }
  }
 }

这里有一篇关于var/let/const的好文章

---

使用箭头运算符，您将不会遇到任何问题，因为在forEach回调中，此值未定义，不再是类变量。在第一个方法中，上下文在forEach内部更改。您可以使用下面的代码来完成它。var self=这个；console.log（key，self.obj[key]）