Использование var для объявления переменных в Javascript

Question

Я борюсь с (как мне кажется,) проблемой с ограничениями.Вот пример моего кода:

$(document).ready(function() {

var counter = 0;

function scrollTweets() {
    counter ++;
    // rest of code
}

...

)}; // end of document ready

Когда я смотрю переменную counter в консоли Chrome Javascript, она возвращает «ReferencedError».Однако, когда я удаляю var из приведенного выше кода и набираю counter в консоли, он возвращает значение.Почему это так?

Я думаю, что понимание этой простой концепции позволило бы мне решать проблемы, возникающие в процессе разработки.Это просто проблема со стороны Chrome?Неужели я без нужды оборачиваю все в «функцию» $(document).ready?

Answer 1

var фиксирует переменную counter в любой лексической области видимости - это означает, что она доступна в текущем блоке, методе и т. Д. И может быть присоединена к закрытым областям (т. Е. Замыканиям), например вы делаете с scrollTweets. Таким образом, counter доступен только для обратного вызова ready и всего, что закрыто вокруг него, поэтому вы не можете получить к нему доступ с консоли.

Когда вы убираете var, counter фактически является глобальным, поэтому в этом случае вы можете получить к нему доступ.

Answer 2

Если вы не используете var для установки области действия переменной, она автоматически становится глобальной переменной внутри глобальной области.Вот почему это видно в консоли Chrome.

Как примечание, я ни в коем случае не предполагаю, что вы должны сделать переменную глобальной.На самом деле это почти всегда плохая идея!Захват переменной в контексте области, в которой она используется, является правильным решением.Если консоль Chrome не может справиться с этим, вам просто нужен лучший отладчик.Firebug для Javascript отлично справляется с работой, даже с ошибками!