Должен ли я использовать window.variable или var?
У нас есть много настраиваемого JS-кода, который определяет панели, кнопки и т.д., которые будут использоваться во многих других JS файлах.
Обычно мы делаем что-то вроде:
grid.js
var myGrid = .....
combos.js
var myCombo = .....
Затем в нашем коде приложения мы:
application.js
function blah() {
myGrid.someMethod()
}
someother.js
function foo() {
myCombo.someMethod();
myGrid.someMethod();
}
Итак, следует ли использовать var myGrid
или лучше использовать window.myGrid
Какая разница?
Ответы
Ответ 1
Я бы предложил создать переменную пространства имен var App = {};
App.myGrid = ...
Таким образом, вы можете ограничить загрязнение глобального пространства имен.
РЕДАКТОР: Что касается числа переменных - 2 возможных решения:
- Вы можете дополнительно использовать пространство имен по типу (сетки, кнопки и т.д.) или по отношениям (ClientInfoSection, AddressSection и т.д.).
- Вы инкапсулируете свои методы в объекты, которые создаются с помощью компонентов, которые у вас есть.
ex: у вас есть
function foo() {
myCombo.someMethod();
myGrid.someMethod();
}
становится:
var Foo = function(combo, grid) {
var myCombo = combo;//will be a private property
this.myGrid = grid;//will be a public property
this.foo = function() {//public method
myCombo.someMethod();
myGrid.someMethod();
}
}
App.myFoo = new Foo(someCombo, someGrid);
App.myFoo.foo();
таким образом вы ограничиваете количество маленьких объектов и раскрываете только то, что вам нужно (а именно функцию foo)
PS: если вам нужно разоблачить внутренние компоненты, добавьте их в это внутри функции конструктора
Ответ 2
Потенциально важное различие в функциональности заключается в том, что window.myGrid
может быть delete
d, а var myGrid
не может.
var test1 = 'value';
window.test2 = 'value';
console.log( delete window.test1 ); // false ( was not deleted )
console.log( delete window.test2 ); // true ( was deleted )
console.log( test1 ); // 'value' ( still accessible )
console.log( test2 ); // ReferenceError ( no longer exists )
Ответ 3
Хорошим использованием window.variable является то, что вы можете проверить его без ошибки javascript. Например, если у вас есть:
if(myVar){
//do work
}
и myVar не определен нигде на странице, вы получите ошибку javascript. Однако:
if(window.myVar){
//do work
}
не дает ошибок и работает так, как можно было бы ожидать.
var myVar = 'test';
а также
window.myVar = 'test';
примерно эквивалентны.
Кроме того, как и другие, вы должны спуститься с одного глобального объекта, чтобы избежать загрязнения глобального пространства имен.
Ответ 4
В глобальном масштабе оба варианта фактически эквивалентны функциональности. В области возможностей var
, безусловно, предпочтительнее, когда требуется поведение замыканий.
Я бы просто использовал var
все время: во-первых, он согласуется с обычно предпочтительным поведением в закрытии (поэтому вам легче перемещать ваш код в закрытие, если вы решите сделать это позже), а во-вторых, это просто чувствует себя более смысловым для меня, чтобы сказать, что я создаю переменную, чем прикреплять свойство окна. Но в основном это стиль.
Ответ 5
Общий ответ на вопрос будет заключаться в использовании var
.
В частности, всегда помещайте свой код в Выражение с немедленной вызывной функцией (IIFE):
(function(){
var foo,
bar;
...code...
})();
Это сохраняет переменные, такие как foo
и bar
, от загрязнения глобального пространства имен. Затем, когда вы явно хотите, чтобы переменная находилась в глобальном объекте (обычно window
), вы можете написать:
window.foo = foo;
JavaScript имеет функциональный охват, и это действительно полезно, чтобы в полной мере использовать его. Вы не хотели бы, чтобы ваше приложение ломалось, потому что какой-то другой программист сделал что-то глупое, как перезаписал ваш таймер.
Ответ 6
В дополнение к другим ответам стоит отметить, что если вы не используете var
внутри функции при объявлении переменной, она течет в глобальную область, автоматически делая ее свойством объекта window
(или глобальной области).
Ответ 7
Чтобы расширить то, что сказал Ливиу, используйте:
App = (function() {
var exports = {};
/* code goes here, attach to exports to create Public API */
return exports;
})();
Поступая таким образом, вы можете скрыть часть своего конкретного кода реализации, который вам может не понравиться, используя var
внутри. Однако вы можете получить доступ к чему-либо, прикрепленному к объекту exports
.