JavaScript属性访问:点符号vs.括号?

除了第一种形式可以使用变量而不仅仅是字符串文字这一显而易见的事实之外，是否有任何理由使用其中一种而不是另一种，如果是这样，在哪些情况下?

在代码:

// Given:
var foo = {'bar': 'baz'};

// Then
var x = foo['bar'];

// vs. 
var x = foo.bar;

上下文:我写了一个代码生成器，产生这些表达式，我想知道哪个更可取。

当前回答

我举了另一个例子来清楚地理解用法上的差异。当使用嵌套数组和嵌套对象时

    const myArray = [
  {
    type: "flowers",
    list: [ "a", "b", "c" ],
  },
  {
    type: "trees",
    list: [ "x", "y", "z" ],
  }
];

现在如果我们想要访问树列表中的第二项是y。

我们不能一直用括号

const secondTree = myArray[1]["list"][1]; // incorrect syntex

相反，我们必须使用

const secondTree = myArray[1].list[1]; // correct syntex

其他回答

(来源此处)

方括号表示法允许使用点表示法不能使用的字符:

var foo = myForm.foo[];//错误的语法 var foo = myForm["foo[]"];//正确的语法

包括非ascii (UTF-8)字符，如myForm["ダ"](更多示例)。

其次，方括号符号在处理时很有用以可预测的方式变化的属性名:

For (var I = 0;I < 10;我+ +){ someFunction(myForm["myControlNumber" + i]); ｝

摘要:

点表示法写起来更快，读起来更清楚。方括号符号允许访问包含特殊字符的选择使用变量的属性

不能与点表示法一起使用的字符的另一个例子是本身包含点的属性名。

例如，json响应可以包含一个名为bar.Baz的属性。

var foo = myResponse.bar.Baz; // incorrect syntax
var foo = myResponse["bar.Baz"]; // correct syntax

[]符号有用的情况:

如果您的对象是动态的，并且在键中可能有一些随机值，如number和[]或任何其他特殊字符，例如-

var a = {1:3};

如果你试图访问a。1，它会报错，因为它期待的是一个字符串。

括号表示法允许您通过存储在变量中的名称访问属性:

var obj = { "abc" : "hello" };
var x = "abc";
var y = obj[x];
console.log(y); //output - hello

obj。X在这种情况下不成立。

一般来说，他们做同样的工作。尽管如此，括号符号给了你做点符号做不到的事情的机会，比如

var x = elem["foo[]"]; // can't do elem.foo[];

这可以扩展到任何包含特殊字符的属性。

括号表示法可以使用变量，所以它在两个点表示法不起作用的情况下很有用:

1)动态确定属性名时(直到运行时才知道确切的名称)。

2)当使用for..in循环遍历对象的所有属性时。

来源:https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Working_with_Objects

推荐文章