Доступ к свойствам JavaScript: точечная привязка к скобкам?
Кроме очевидного факта, что первая форма могла использовать переменную, а не только строковый литерал, есть ли какая-то причина использовать ее над другой, и если да, то в каких случаях?
В коде:
// Given:
var foo = {'bar': 'baz'};
// Then
var x = foo['bar'];
// vs.
var x = foo.bar;
Контекст: я написал генератор кода, который производит эти выражения, и мне интересно, что предпочтительнее.
Ответы
Ответ 1
(Источник здесь.)
Обозначение в квадратных скобках позволяет использовать символы, которые нельзя использовать с точечными обозначениями:
var foo = myForm.foo[]; // incorrect syntax
var foo = myForm["foo[]"]; // correct syntax
включая символы не ASCII (UTF-8), как в myForm["ダ"]
(больше примеров).
Во-вторых, обозначение в квадратных скобках полезно при работе с
Имена свойств, которые изменяются предсказуемым образом:
for (var i = 0; i < 10; i++) {
someFunction(myForm["myControlNumber" + i]);
}
Roundup:
-
Точечная запись быстрее и понятнее.
- Обозначение в квадратных скобках позволяет получить доступ к свойствам, содержащим специальные символы и выбор свойства с использованием переменных
Другим примером символов, которые нельзя использовать с точечной нотацией, являются имена свойств, которые сами содержат точку.
Например, ответ json может содержать свойство с именем bar.Baz
.
var foo = myResponse.bar.Baz; // incorrect syntax
var foo = myResponse["bar.Baz"]; // correct syntax
Ответ 2
Обозначение скобок позволяет вам получить доступ к свойствам по имени, хранящимся в переменной:
var obj = { "abc" : "hello" };
var x = "abc";
var y = obj[x];
console.log(y); //output - hello
obj.x
не будет работать в этом случае.
Ответ 3
Точечная нотация не работает с некоторыми ключевыми словами (например, new
и class
) в Internet explorer 8.
У меня был этот код:
//app.users is a hash
app.users.new = {
// some code
}
И это вызывает опасный "ожидаемый indentifier" (по крайней мере, на IE8 на windows xp, я не пробовал другие среды). Простое исправление заключается в том, чтобы переключиться на запись в скобках:
app.users['new'] = {
// some code
}
Ответ 4
Два наиболее распространенных способа доступа к свойствам в JavaScript - это точка и квадратные скобки. Оба value.x and value[x]
получают доступ к свойству по значению, но не обязательно к одному и тому же свойству. Разница заключается в том, как интерпретируется x. При использовании точки точка после точки должна быть допустимым именем переменной, и она непосредственно называет это свойство. При использовании квадратных скобок выражение между скобками оценивается для получения имени свойства. В то время как value.x извлекает свойство значения с именем "x", значение [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"]
.
Ответ 5
Будьте внимательны при использовании этих обозначений:
Напр. если мы хотим получить доступ к функции, присутствующей в родительском окне окна.
В IE:
window['parent']['func']
не эквивалентно
window.['parent.func']
Мы можем либо использовать:
window['parent']['func']
или
window.parent.func
для доступа к ней
Ответ 6
Вообще говоря, они выполняют ту же работу.
Тем не менее, условное обозначение дает вам возможность делать то, что вы не можете сделать с точечной нотацией, например
var x = elem["foo[]"]; // can't do elem.foo[];
Это может быть расширена до любого свойства, содержащего специальные символы.
Ответ 7
Вам нужно использовать скобки, если имена свойств имеют специальные символы:
var foo = {
"Hello, world!": true,
}
foo["Hello, world!"] = false;
Кроме этого, я полагаю, это просто вопрос вкуса. IMHO, точечная нотация короче и делает более очевидным, что это свойство, а не элемент массива (хотя, конечно, JavaScript не имеет ассоциативных массивов).
Ответ 8
Обозначение скобок может использовать переменные, поэтому полезно в двух случаях, когда точечная нотация не будет работать:
1) Когда имена свойств динамически определяются (когда точные имена неизвестны до времени выполнения).
2) При использовании цикла for..in для прохождения всех свойств объекта.
источник: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Working_with_Objects
Ответ 9
Вы должны использовать обозначение в квадратных скобках, когда -
-
Имя свойства номер.
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
Ответ 10
Случай, когда обозначение []
полезно:
Если ваш объект является динамическим, и могут быть некоторые случайные значения в таких ключах, как number
и []
, или любой другой специальный символ, например -
var a = { 1 : 3 };
Теперь, если вы попытаетесь получить доступ в виде a.1
, он будет через ошибку, потому что он ожидает строку там.
Ответ 11
Позвольте мне добавить еще пример использования квадратного обозначения. Если вы хотите получить доступ к свойству, скажите x-proxy
в объекте, то -
будет интерпретироваться неправильно. Их также некоторые другие случаи, такие как пространство, точка и т.д., Где точечная операция вам не поможет. Кроме того, если u имеет ключ в переменной, то только способ доступа к значению ключа в объекте - это скобка. Надеюсь, вы получите еще какой-то контекст.
Ответ 12
Пример сбоя точечной записи
json = {
"value:":4,
'help"':2,
"hello'":32,
"data+":2,
"😎":'😴',
"a[]":[
2,
2
]
};
// correct
console.log(json['value:']);
console.log(json['help"']);
console.log(json["help\""]);
console.log(json['hello\'']);
console.log(json["hello'"]);
console.log(json["data+"]);
console.log(json["😎"]);
console.log(json["a[]"]);
// wrong
console.log(json.value:);
console.log(json.help");
console.log(json.hello');
console.log(json.data+);
console.log(json.😎);
console.log(json.a[]);
Имена свойств не должны мешать правилам синтаксиса javascript, чтобы вы могли иметь к ним доступ как json.property_name
Ответ 13
Точечная запись всегда предпочтительнее. Если вы используете более "умную" IDE или текстовый редактор, он покажет неопределенные имена из этого объекта.
Используйте обозначения в скобках только в том случае, если у вас есть имя с похожими черточками или чем-то подобным недействительным. А также, если имя хранится в переменной.