除了显而易见的事实,即第一种形式可以使用变量而不仅仅是字符串文字,是否有任何理由使用其中一种,如果是这样的话,在哪种情况下呢?
在代码中:
// Given:
var foo = {'bar': 'baz'};
// Then
var x = foo['bar'];
// vs.
var x = foo.bar;
上下文:我编写了一个生成这些表达式的代码生成器,我想知道哪个更好。
(来自here。)
方括号表示法允许使用不能与点表示法一起使用的字符:
var foo = myForm.foo[]; // incorrect syntax var foo = myForm["foo[]"]; // correct syntax
包括非ASCII(UTF-8)字符,如myForm["ダ"]
(more examples)。
其次,在处理以可预测的方式变化的属性名称时,方括号表示法很有用:
for (var i = 0; i < 10; i++) { someFunction(myForm["myControlNumber" + i]); }
围捕:
- 点符号编写速度更快,读取更清晰。
- 方括号表示法允许访问包含特殊字符的属性以及使用变量选择属性
另一个不能与点表示法一起使用的字符示例是属性名称,它们本身包含一个点。
例如,json响应可以包含名为bar.Baz
的属性。
var foo = myResponse.bar.Baz; // incorrect syntax
var foo = myResponse["bar.Baz"]; // correct syntax
[]
符号有用的情况:
如果您的对象是动态的,并且在number
和[]
or等键中可能存在一些随机值,例如其他特殊字符 -
var a = { 1 : 3 };
现在,如果你试图像a.1
一样访问它将通过一个错误,因为它期待在那里的字符串。
让我添加一些方括号表示法的用例。如果你想在一个对象中访问一个属性x-proxy
,那么-
将被错误地解释。他们的其他一些情况也像空格,点等,其中点操作对你没有帮助。此外,如果你有一个变量中的键,那么只能通过括号表示法来访问对象中键的值。希望你能得到更多的背景信息。
括号表示法允许您通过存储在变量中的名称访问属性:
var obj = { "abc" : "hello" };
var x = "abc";
var y = obj[x];
console.log(y); //output - hello
obj.x
在这种情况下不起作用。
点符号不适用于Internet Explorer 8中的某些关键字(如new
和class
)。
我有这个代码:
//app.users is a hash
app.users.new = {
// some code
}
这会触发可怕的“预期标识符”(至少在Windows XP上的IE8上,我还没有尝试过其他环境)。对此的简单修复是切换到括号表示法:
app.users['new'] = {
// some code
}
使用这些符号时要小心:例如。如果我们想要访问窗口父级中存在的函数。在IE中:
window['parent']['func']
不等于
window.['parent.func']
我们可以使用:
window['parent']['func']
要么
window.parent.func
访问它
在JavaScript中访问属性的两种最常用方法是使用点和方括号。两个value.x and value[x]
都在价值上访问一个属性 - 但不一定是相同的属性。不同之处在于如何解释x。使用点时,点后面的部分必须是有效的变量名,并直接命名该属性。使用方括号时,将计算括号之间的表达式以获取属性名称。 value.x获取名为“x”的值的属性,而value [x]尝试计算表达式x并使用结果作为属性名称。
因此,如果你知道你感兴趣的财产被称为“长度”,你说value.length
。如果要提取由变量i
中保存的值命名的属性,请说value[i]
。并且因为属性名称可以是任何字符串,如果要访问名为“2”
或“John Doe”
的属性,则必须使用方括号:value[2] or value["John Doe"]
。即使您事先知道属性的确切名称也是如此,因为“2” nor “John Doe”
都不是有效的变量名,因此无法通过点表示法访问。
在阵列的情况下
数组中的元素存储在属性中。因为这些属性的名称是数字,我们经常需要从变量中获取它们的名称,所以我们必须使用括号语法来访问它们。数组的length属性告诉我们它包含多少个元素。此属性名称是有效的变量名称,我们事先知道它的名称,因此要查找数组的长度,通常编写array.length
,因为这比array["length"]
更容易编写。
一般来说,他们做同样的工作。 尽管如此,括号表示法让你有机会做一些你用点符号做不到的东西,比如
var x = elem["foo[]"]; // can't do elem.foo[];
这可以扩展到包含特殊字符的任何属性。
如果属性名称具有特殊字符,则需要使用括号:
var foo = {
"Hello, world!": true,
}
foo["Hello, world!"] = false;
除此之外,我想这只是一个品味问题。恕我直言,点符号更短,它更明显,它是一个属性而不是数组元素(虽然当然JavaScript无论如何都没有关联数组)。
括号表示法可以使用变量,因此在点符号不起作用的两个实例中它很有用:
1)动态确定属性名称时(直到运行时才知道确切名称)。
2)当使用for..in循环来遍历对象的所有属性时。
来源:https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Working_with_Objects
当 - 时你必须使用方括号表示法
var ob = {
1: 'One',
7 : 'Seven'
}
ob.7 // SyntaxError
ob[7] // "Seven"
var ob = {
'This is one': 1,
'This is seven': 7,
}
ob.'This is one' // SyntaxError
ob['This is one'] // 1
var ob = {
'One': 1,
'Seven': 7,
}
var _Seven = 'Seven';
ob._Seven // undefined
ob[_Seven] // 7