JavaScript: два отдельных скрипта - совместно использовать переменные?

Question

Если у меня есть два отдельных сценария на странице HTML с JavaScript, переменные совместно используются всей страницей? Или только в рамках собственных деклараций?

Пример:

<script> var title = "Hello World!"; </script>
// random HTML/PHP
<script> document.write(title); </script>

Будет ли написано "Hello World!"? Это похоже на плохое соглашение о кодировании, как еще можно добиться чего-то подобного с правильной формой.

Answer 1

Заголовок переменной в вашем примере объявлен как глобальная переменная, поэтому он будет доступен для всех без исключения скриптов, загруженных на одну и ту же страницу.Более того, если на той же странице уже есть глобальная переменная с именем title, ее значение будет перезаписано при назначении ей значения «Hello World!»

Обычная практика, позволяющая избежать подобных проблем.это объявить ровно одну глобальную переменную, а затем поместить в нее все остальные переменные.Например:

var bobbyS_vars = {
    title: "Hello World!";
};

Назначьте этой единственной глобальной переменной имя, которое никто другой не выберет, например, ваше имя или имя работодателя или, что лучше всего, доменное имя, которое принадлежит вам или вашемуEmployer.

Другой, более распространенный способ решения этой проблемы - воспользоваться преимуществами способа, которым JavaScript обрабатывает переменную область видимости в функциях.Например, создайте анонимную функцию, объявите all вашего кода внутри этой функции, затем вызовите функцию в конце объявления, поставив () в конце объявления.Например:

(function() {
    var title = "Hello World!";

    document.write(title);
})();

// title is not in scope here, so it is undefined,
// unless it were declared elsewhere.

Если вы хотите, чтобы совместно использовали некоторые переменные, но не другие, попросите вашу анонимную функцию использовать комбинацию подходов:

var bobbyS_vars = {
    title: "Hello World!";
};

(function() {
    var employeeId = "E 298";
    var count = 7;

    document.write("<p>" + bobbyS_vars.title + "</p>");
    document.write("<p>" + employeeId + "</p>");
})();

// At this point, bobbyS_var.title is in scope and still has the 
// value "Hello World!". Variables employeeId and count are not
// in scope and effectively private to the code above.

Oneпоследнее замечаниеВсе функции, которые объявляет ваш код, также являются глобальными переменными.Таким образом, если вы создаете функцию с именем printTitle, она 1) доступна для всего другого кода на странице и 2) может быть перезаписана или перезаписана другой функцией на той же странице, также называемой printTitle.Вы можете защитить и / или предоставить свои функции так же, как и любую другую переменную:

var bobbyS_vars = { };

(function() {
    // Private functions
    var function = addOne(i) {
        return i + 1;
    };

    // Public vars
    bobbyS_vars.title: "Hello World!";

    // Public functions
    bobbyS_vars.printTitle = function() {
        document.write("<p>" + bobbyS_vars.title + "</p>");
        document.write("<p>" + addOne(41) + "</p>");
    };
})();

// At this point, function addOne is not directly accessible,
// but printTitle is.
bobbyS_vars.printTitle();

Обратите внимание, что, хотя функция addOne фактически является закрытой функцией в замыкании, она по-прежнему доступна косвенно через printTitleфункция, потому что addOne и printTitle находятся в одной области видимости.

Answer 2

title находится в области действия Global, которая в случае JavaScript, запущенного в веб-браузере, является объектом window. Когда вы говорите var title = "Hello World!" вне какой-либо функции, которая ограничивает его область действия, это то же самое, что сказать window.title = "Hello World!". Ваш код эквивалентен следующему:

<script>
    window.title = "Hello World!";
</script> 
<!-- random HTML/PHP -->
<script>
    document.write(title);
    // or document.write(window.title) works just as well
</script> 

Answer 3

Все они будут «разделены» в соответствии с правилами области видимости и тому подобным. Отдельные файлы не влияют на этот, за исключением порядка включения указанных файлов.

Редактировать: То же правило применяется и к встроенным скриптам.

И уточнить на исключение:

Если у меня есть файл Foo, где я объявляю следующее:

var fooVar = barVar;

Тогда у меня есть файл Bar, где я объявляю следующее:

var barVar = 'bar';

И я включаю их в следующем порядке:

<script type="javascript/text" src="foo.js"></script>
<script type="javascript/text" src="bar.js"></script>

Вы получите интерпретированную ошибку, поскольку использование barVar предшествует ее объявлению.

Answer 4

В этом случае title будет глобальной переменной.Вам нужно заключить переменную в область видимости.Существуют различные методы для этого.Я предпочитаю самозапускающуюся анонимную функцию, которая будет выполняться так:

    (function() {
       var title = "Hello world!";

       alert(title); // would pop up "Hello World!" since title is in scope
    });

    alert(title); // title doesn't exist, because it's outside the scope

Answer 5

window содержит все переменные.Все сценарии находятся в матери window объекте.Таким образом, все переменные находятся в одном пространстве.Однако их можно локализовать для функций и т. Д.