Как объявить глобальную переменную в JavaScript?
Как я могу объявить глобальную переменную в JavaScript?
6 ответов:
Если вам нужно генерировать глобальные переменные в производственном коде (чего следует избегать) Всегда объявляйте их явно:
window.globalVar = "This is global!";
Хотя можно определить глобальную переменную, просто опуская
var
(предполагая, что нет локальной переменной с тем же именем), это создает неявный глобальный, что плохо и приведет к ошибке в строгом режиме.
Если это единственное приложение, в котором вы собираетесь использовать эту переменную, подход Феликса превосходен. Однако, если вы пишете плагин jQuery, рассмотрите "пространство имен" (подробности о кавычках позже...) переменные и функции, необходимые для объекта jQuery. Например, в настоящее время я работаю над всплывающим меню jQuery, которое я назвал miniMenu. Таким образом, я определил "пространство имен"
miniMenu
в jQuery, и я помещаю туда все.Причина, по которой я использую кавычки, когда говорю о javascript пространства имен - это то, что они на самом деле не являются пространствами имен в обычном смысле. Вместо этого я просто использую объект javascript и помещаю все свои функции и переменные в качестве свойств этого объекта.
Кроме того, для удобства я обычно подпространствую пространство имен плагинов с пространством именi
для вещей, которые должны использоваться только внутри плагина, чтобы скрыть их от пользователей плагина.Вот как это работает:
// An object to define utility functions and global variables on: $.miniMenu = new Object(); // An object to define internal stuff for the plugin: $.miniMenu.i = new Object();
Теперь я могу просто делать
$.miniMenu.i.globalVar = 3
или$.miniMenu.i.parseSomeStuff = function(...) {...}
всякий раз, когда мне нужно сохранить что-то глобальное, и я все еще держу его вне глобального пространства имен.
С помощью jQuery вы можете просто сделать это, независимо от того, где находится объявление:
$my_global_var = 'my value';
И будет доступен везде. Я использую его для создания быстрых галерей изображений, когда изображения распространяются в разных местах, например:
$gallery = $('img'); $current = 0; $gallery.each(function(i,v){ // preload images (new Image()).src = v; }); $('div').eq(0).append('<a style="display:inline-block" class="prev">prev</a> <div id="gallery"></div> <a style="display:inline-block" class="next">next</a>'); $('.next').click(function(){ $current = ( $current == $gallery.length - 1 ) ? 0 : $current + 1; $('#gallery').hide().html($gallery[$current]).fadeIn(); }); $('.prev').click(function(){ $current = ( $current == 0 ) ? $gallery.length - 1 : $current - 1; $('#gallery').hide().html($gallery[$current]).fadeIn(); });
Совет : запустите весь этот код в консоли на этой странице ; -)
Вот базовый пример глобальной переменной, к которой могут обращаться остальные функции. Вот вам живой пример: http://jsfiddle.net/fxCE9/
var myVariable = 'Hello'; alert('value: ' + myVariable); myFunction1(); alert('value: ' + myVariable); myFunction2(); alert('value: ' + myVariable); function myFunction1() { myVariable = 'Hello 1'; } function myFunction2() { myVariable = 'Hello 2'; }
Если вы делаете это в функции ready () jquery, то убедитесь, что ваша переменная находится внутри функции ready() вместе с другими функциями.
Объявить переменную вне функций
function dosomething(){ var i = 0; // can only be used inside function } var i = ''; function dosomething(){ i = 0; // can be used inside and outside the function }
Лучший способ-использовать
closures
, потому что ...window
объект становится очень, очень загроможден свойствами.Html
<!DOCTYPE html> <html> <head> <script type="text/javascript" src="init.js"></script> <script type="text/javascript"> MYLIBRARY.init(["firstValue", 2, "thirdValue"]); </script> <script src="script.js"></script> </head> <body> <h1>Hello !</h1> </body> </html>
Инит.js (на основе этого ответа )
var MYLIBRARY = MYLIBRARY || (function(){ var _args = {}; // private return { init : function(Args) { _args = Args; // some other initialising }, helloWorld : function(i) { return _args[i]; } }; }());
Сценарий.js
// Here you can use the values defined in the html as if it were a global variable var a = "Hello World " + MYLIBRARY.helloWorld(2); alert(a);
Вот plnkr. Надеюсь, это поможет !