не может получить доступ к переменным в другом файла JavaScript

Question

Так я иметь ссылку на каждый файл необходимо в файл index.html:

<script src="jquery.js"></script> 
    <script src="notify.js"></script> 
    <script src="script.js"></script> 

я создать объект в «notify.js»:

var notify = { 
    newNotification : function(text) { 
    } 
} 

script.js:

alert(notify.newNotification); 

Когда я пытаюсь получить доступ к объекту «уведомить» в «script.js», это работает только fine.But я хочу использовать JQuery так я добавить $ (документ) .ready(), чтобы оба файла, как это:

notify.js

$(document).ready (
    function() { 
var notify = { 
    newNotification : function(text) { 
    } 
} 
} 
) 

script.js:

$(document).ready (
    function() { 
alert(notify.newNotification); 
    } 
) 

И после того, как я добавить, что это приходит с уведомлением, не определяется. Что не так? Может ли кто-нибудь объяснить, почему он не работает?

Answer 1

Как вы определили var notify в notify.js внутри $(document).ready(, что является анонимной функцией, и var notify сфера может ограничиваться только этой функцией.

Так он не доступен за пределами функции $(document).ready(

Чтобы сделать доступным снаружи не обернуть его в $(document).ready( функции

как это: -

var notify; 
$(document).ready(function() { 
    notify = { 
     newNotification: function (text) { } 
    } 
}); 

Answer 2

В этом случае есть нет нужно обернуть объект уведомления в dom ready ... потому что из его внешнего вида вы не создаете ссылку на элемент dom при создании объекта ... единственное, что имеет значение, - это любой метод invokation, который имеет дело с dom элемент должен быть сделан на dom ready.

var notify = { 
    newNotification: function (text) {} 
} 

$(document).ready(function() { 
    notify.newNotification() 
}) 

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

других решение добавить переменную в глобальной области в йот готовой ручки, как

var notify; 
$(document).ready(function() { 
    notify = { 
     newNotification: function (text) {} 
    } 
}) 

или

$(document).ready(function() { 
    window.notify = { 
     newNotification: function (text) {} 
    } 
}) 

Answer 3

Вам нужен только один document.ready И это только объявляет переменные, которые будут свободно перемещаться по своим скриптам.

Смотрите пример:

script.js:

$(document).ready(function(){ 
    // declare the variables as global 
    $.varA, $.varB, $.varC; 
}); 

уведомления.js:

function doNotify(){ 
    // your code here 
    $.varA = /*your code here */ 
} 

function otherFunc(txt){ 
    // your code here 
    $.varB = txt; 
} 

Answer 4

Попробуйте это.

var notify = { 
    newNotification : function(text) { 
    } 

Answer 5

Все ваши Java-скрипты будут загружаться до того, как документ будет готов.

Создайте отдельную функцию в script.js, который ссылается на notify объекте, а затем вызвать эту функцию из $(document).ready

Answer 6

Как и все остальные здесь уже указывались: использовать только $().ready, когда вы обработку DOM-элементы и ваш переменный не потому что вы использовали ключевое слово var (как и предполагалось). Ключевое слово var ограничивает определенные переменные текущей областью, которая является областью анонимной функции, которую вы используете в качестве DOM-Ready-Handler.

Таким образом, удаление ненужного $().read будет временно решить вашу проблему.

BUT (!), Вы должны обернуть свой код в блокировки, чтобы избежать испорчения глобальной области и избежать возможных конфликтов имен с сторонним кодом.

Как что:

notify.js

;(function ($, window, undefined) { 
    var notify = { 
    newNotification : function(text) { 
     return text; 
    } 
    }; 
})(jQuery, this); 

script.js

;(function ($, window, undefined) { 
    alert(notify.newNotification()); 
})(jQuery, this); 

Итак, теперь вы будете иметь те же проблемы, как и прежде, вы не имеете доступа к вашему объекту.

Уверенный, что вы можете просто добавить свой объект notify в глобальную область действия, как предложил Арун П. Джонни в своем ответе, но я уверен, что в течение более длительного времени вам будет необходимо сделать глобальный доступ. Если вы поместили каждый из них в глобальную область видимости, вы снова начнете заполнять глобальную область, поэтому моя рекомендация будет ОДНОМ глобальным объектом, который будет содержать все другие объекты/переменные, которые вам нужны глобально. (Или еще лучше использовать что-то вроде requirejs

Somethink так:

main.js

;var MyApp = {}; # Only variable in global scope 

# Maybe some more initalization code here, dunno 

notify.js

;(function ($, window, undefined) { 
    MyApp.notify = { 
    newNotification : function(text) { 
     return text; 
    } 
    }; 
})(jQuery, this); 

сценария.JS

;(function ($, window, undefined) { 
    alert(MyApp.notify.newNotification()); 
})(jQuery, this); 

Некоторые интересные Q/A вот-вот объем и закрытие здесь на StackOverflow:

• What is the scope of variables in JavaScript?
• How do JavaScript closures work?
• JavaScript closures vs. anonymous functions

Хороший ответ о возни с глобальный охват:

• What is meant by “leaking” into global scope?