在javascript中使用'this'在自身内部使用相同对象的键值对答案

【问题标题】：using key value pair of same object inside itself with 'this' in javascript在javascript中使用'this'在自身内部使用相同对象的键值对
【发布时间】：2021-11-12 09:14:24
【问题描述】：

假设我有两个对象

var a = {
    b: 1,
    c: this.b
};

还有

var funcObj = {
    b : function() {
        return 1;
    },
    c: function() {
       console.log(return this.b())
    }
}

记录这两个喜欢

console.log(a.c)//results undefined
console.log(funcObj.c()) //results 1

为什么第一个函数不能使用 this 属性，而第二个函数可以？我真的很困惑。

【问题讨论】：

因为第一个示例显示了一个对象字面量，并且没有函数范围。

标签： javascript object

【解决方案1】：

答案取决于this 在每个上下文中所指的内容。在 JavaScript 中，this 在调用当前函数时绑定到点 (.) 左侧的任何对象。如果我们不在一个函数中，事情会变得有点复杂——this 要么是全局 window 对象，要么是 undefined，具体取决于环境。

在您的第一个示例中，this 的值取决于周围的上下文。当 JavaScript 构建您的对象 a 时，它会评估 this.b。无论this当前绑定到什么对象都没有b属性，所以c属性设置为undefined。

在第二个示例中，当您调用 funcObj.c() 时，函数中的 this 将绑定到 funcObj。因此，当您请求 b 属性时，您会得到上面定义的 b。 funcObj.b 是一个函数这一事实实际上是无关紧要的。以下方法也可以：

var funcObj = {
    b :  1,
    c: function() {
       console.log(return this.b)
    }
}

【讨论】：

【解决方案2】：

您不能将声明中的其他属性作为 Javascript 文字声明的一部分引用。因此，在您的 Javascript 文字声明中：

var a = {
    b: 1,
    c: this.b
};

this 未设置为您想要的，a 尚未初始化，因此您也无法引用它。在文字声明时根本无法访问其他属性。这是当前 Javascript 规范的限制。你可以这样做：

var a = {
    b: 1
};
a.c = a.b;

因为 a 在此时已完全形成，因此您可以引用其中的其他属性。

或者，在现代浏览器中，您甚至可以像这样使用 getter 来获取 b 的“实时”版本（这与您要求的功能不完全相同，因为它是b 将跟踪它的价值），但向您展示了另一种可能性：

var a = {
    b: 1,
    get c() {
         return b;
    }
};

console.log(a.c); //results 1

在你的第二个例子中：

var funcObj = {
    b : function() {
        return 1;
    },
    c: function() {
       console.log(return this.b())
    }
}

console.log(funcObj.c()) //results 1

您正在调用funcObj.c()，这会将c 内的this 的值设置为funcObj，因此您可以通过this 引用其他属性。

这里的主要区别在于 this 没有设置为 Javascript 文字定义中的对象（您的第一个示例），但是当您调用 funcObj.c() 中的方法时，this 被设置为对象。

【讨论】：

我想你的意思是在你的第二个例子中写a.c = a.b;。
@ChrisBouchard - 是的。现已修复。

【解决方案3】：

我知道这篇文章有点老了，但我在试图弄清楚如何解决类似问题时遇到了它。

我想做类似的事情：

const x = {
  a: 12,
  b: a + 1
}
console.log(x) //results undefined

（与我实际做的相比，这非常简化，但原理是一样的。）

我的解决方案是首先创建一个函数来构建我想要的对象，然后传入我尝试操作的主要值（在本例中，'a' 中的值）：

function buildObj (val) {
  const response = {
    a: val,
    b: val + 1
  };
  return response;
}

然后：

const x = buildObj(12)

console.log(x) // results { a: 12, b: 13 }

一旦 x 被初始化，任何后续的访问尝试

x.a

或

x.b

将返回其中存储的值。

如果未来的搜索者遇到这个问题，因为他们想对存储在同一对象内的嵌套键中的值执行操作，希望这会有所帮助。

【讨论】：