使用变量的值访问对象的属性

Using the value of a variable to access a property of an object

本文关键字:对象 属性 访问 变量      更新时间:2023-09-26
var fruit = {apple:"1", banana:"2"};
var w = "apple";
console.log(fruit.w); //this is problematic

我正在尝试在我的代码中使用此逻辑在控制台中显示值"1"。 这行不通。 直观地说,这是有道理的,因为console.log(fruit.w);等价于console.log(fruit."apple");,因为引号是无意义的。 那么我该如何修改此代码才能工作呢?

您可以使用:

console.log(fruit[w]);

这就是为什么这不起作用。这一切都与范围有关。当你调用 fruit.w 时,它查找的是属于fruit对象的属性w,而不是对象fruit中的全局变量w的值。

相反,您可以使用 [w] ,它使用全局 w 的值作为对象 fruit 的属性名称。

注意:全局用于它所在的代码块的上下文中。

var fruit = {apple:"1", banana:"2"};
var w = "apple";
console.log(fruit[w]); // Produces '1'

这使用此表示法将变量的值用作属性。

这个片段应该说明这一点。

$(document).ready(function() {
  var fruit = {
    apple: "1",
    banana: "2"
  };
  var w = "apple";
  $(".apple").text(fruit[w]);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="apple"></div>

延伸阅读:

MDN 括号表示法(谢谢@Grundy)