Могу ли я использовать идентификатор в качестве имени переменной? - PullRequest
6 голосов
/ 28 июля 2011

Мне кажется удобным установить переменную с тем же именем, что и идентификатор элемента, например:

randomDiv = document.getElementById("randomDiv");
  randomDiv.onclick = function(){ /* Whatever; */ }
  randomDiv.property = "value";

Это работает в Chrome и Firefox, но не в IE8;выдача ошибки Объект не поддерживает это свойство или метод .

Создает переменную с именем, которое совпадает с идентификатором элемента, неверно (или плохой практикой), или это другой экземпляр ИнтернетаИсследователь действует?

Ответы [ 3 ]

8 голосов
/ 28 июля 2011

Создание глобальных переменных автоматически считается плохой практикой, потому что может быть трудно определить, глядя на какой-то код, нарочно ли он, или вы забыли где-то объявить переменную. Автоматическое создание глобальных переменных, подобных этой , не работает в строгом режиме ES5 и может быть прекращено в будущих версиях ECMAScript.

В браузере Глобальная область действия JavaScript на самом деле window. Когда вы ссылаетесь на document, вы получаете window.document. Для создания глобальной переменной в браузере рекомендуется добавить ее в window (global в Node.js). Вот пример из jQuery :

window.jQuery = window.$ = jQuery;

Некоторые свойства в window (следовательно, некоторые глобальные переменные) доступны только для чтения, их нельзя перезаписать. window.document - единица (протестировано в Chrome, все зависит от браузера и может измениться):

window.document; // → Document
window.document = 'foo'; // → "foo" // It worked!
window.document; // → Document // Hmm, no it didn’t

Оказывается, большинство браузеров создают свойства для window (отсюда глобальные переменные) для каждого идентификатора в документе. Многие браузеры не делают их доступными только для чтения, вы можете перезаписать их своими собственными, но Internet Explorer делает это.

Это еще одна причина, по которой глобальные переменные в JavaScript могут быть опасными - один из ваших идентификаторов может соответствовать свойству window только для чтения (сегодня или в каком-либо будущем браузере).

На верхнем уровне (не внутри функции), var объявляет глобальные переменные. Указание var document = 'foo' на верхнем уровне не приведет к ошибке, но document все равно будет Document, а не "foo".

Кроме того, новые браузеры (которые поддерживают ES5) позволяют создавать собственные глобальные переменные только для чтения с Object.defineProperty:

Object.defineProperty(window, 'foo', { value: 'bar', writable: false });
foo = 'baz';
foo; // → "bar"

У меня есть три варианта для вас.

  1. Продолжайте использовать глобальные переменные для своих элементов, но оставляйте их в покое, если они уже существуют (создавая их явно в window, чтобы код был ясным и классным с ES5):

    if ( ! window.randomDiv) {
        window.randomDiv = document.getElementById('randomDiv');
    }
    
  2. Создайте объект на window для использования в качестве собственного пространства имен вашего приложения, которое не будет мешать другим библиотекам или браузеру. Это распространено и считается довольно хорошей практикой, особенно если к нему нужно обращаться через файлы JavaScript:

    // Early in your code…
    window.Fantabulum = {};
    // Later on…
    Fantabulum.randomDiv = document.getElementById("randomDiv");
    
  3. Избегайте создания глобалов. Убедитесь, что код вашего приложения находится внутри функции (это должно быть уже так, чтобы ваши другие переменные не были глобальными и не имели таких же ограничений!), И объявите переменные для ваших элементов:

    (function(){
        var randomDiv = document.getElementById("randomDiv");
    })();
    
2 голосов
/ 28 июля 2011

Это особенность IE - создавать глобальные переменные с тем же именем, что и идентификаторы и имена элементов. Вы можете создать глобал с тем же именем, но с этим есть причуды.

Это довольно ужасная идея. Если вам не нравится ввод document.getElementById , просто создайте для него небольшую функцию-обертку, например:

funciton get(id) {
  return typeof id == 'string'? document.getElementById(id) : id;
}
1 голос
/ 28 июля 2011

randomDiv не является определенной / известной «переменной глобальной области видимости».

Объявление глобальной переменной

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...