在JavaScript对象中使用'this'关键字

Question

我喜欢认为我理解JavaScript,但今天我发现了一些意想不到的东西,我希望有人可以向我解释它为什么会发生.

拿这个代码

var animalData = {
                  cow:"cow",
                  sheep:"sheep",
                  getCow:function()
                  {
                    return this.cow;
                  },
                  animalList:[
                          {
                            animalId:this.cow,
                            label:"This is a cow"
                          },
                          {
                            animalId:this.sheep,
                            label:"This is a sheep"
                          }
                       ]
          };

console.log(animalData.getCow());
console.log(JSON.stringify(animalData.animalList,null," "))

输出不是我所期望的.按照您的预期调用animalData.getCow()结果"cow".但console.log这是让我感到困惑的第二个回报.

[
 {
  "label": "This is a cow"
 },
 {
  "label": "This is a sheep"
 }
]

换句话说,该对象animalId完全从定义的对象中删除属性.我在期待这个

[
 {
  "animalId":"cow",
  "label": "This is a cow"
 },
 {
   "animalId":"sheep",
  "label": "This is a sheep"
 }
]

我也许能理解这一点

[
 {
   "animalId":undefined,
  "label": "This is a cow"
 },
 {
   "animalId":undefined,
  "label": "This is a sheep"
 }
]

但为什么animalId要完全删除该属性？

任何人都可以解释表面下发生的事情导致这种行为吗？我猜测this关键字不起作用,因为调用它时属性是未定义的,但为什么它会完全删除属性？

注意:我不是在寻找一种解决方法,这很容易做到 - 只关心它为什么会发生.

JSFiddle在这里

Answer 1

在对象被初始化的点,this是指外上下文,这将不会有cow和sheep性质.如你所想,这将导致animalId存在undefined.

JSON.stringify做某些具有undefined属性的东西,即:

如果undefined在转换过程中遇到函数或符号,则将其省略(当在对象中找到它时)或者删除null(当它在数组中找到时).

这就是你没有看到它们的原因.