nie może uzyskać dostępu do zmiennych w innym pliku javascript

Question

więc mam linku każdy plik potrzebny do pliku index.html:

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

utworzyć obiekt w „notify.js”:

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

script.js:

alert(notify.newNotification); 

Kiedy próbuję uzyskać dostęp do obiektu 'zawiadomić' w 'script.js', to działa tylko fine.But chcę używać jquer y więc dodać $ (document) .ready(), aby zarówno pliku tak:

notify.js

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

script.js:

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

I dodam, że po , pojawia się powiadomienie nie jest zdefiniowane. Co jest nie tak? Czy ktoś może wyjaśnić, dlaczego to nie działa?

Answer 1

Tak jak zdefiniowałeś var notify w pliku notify.js wewnątrz $(document).ready(, który jest funkcją anonimową, a zakres var notify jest ograniczony tylko do tej funkcji.

Więc to nie jest dostępne poza funkcją $(document).ready(

Aby udostępnić na zewnątrz nie zawinąć go w $(document).ready( funkcji

tak: -

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

Answer 2

W tym przypadku nie ma tam trzeba zawinąć obiekt powiadomień w domenie gotowy ... ponieważ z jego wyglądu nie tworzysz żadnego odniesienia do elementu DOM podczas tworzenia obiektu ... liczy się tylko jakakolwiek metoda wywoływania, która zajmuje się domem elem ent musi być zrobione na dom gotowy.

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

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

jeśli zadeklarować zmienną wewnątrz dom gotowy obsługi wówczas staje się ona zmienną lokalną do obsługi dom gotowy ... więc nie będzie dostępny poza dom gotowy obsługi ...

Another rozwiązaniem jest dodanie zmiennej do zakresu globalnego w dom gotowy uchwyt jak

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

lub

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

Answer 3

Potrzebny jest tylko jeden dokument.ready A to tylko zadeklaruj zmienne, które będą się swobodnie poruszać w swoich skryptach.

Patrz przykład:

script.js:

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

powiadamiania.js:

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

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

Answer 4

Spróbuj tego.

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

Answer 5

Wszystkie twoje skrypty JavaScript zostaną załadowane zanim dokument będzie gotowy.

utworzyć oddzielną funkcję w script.js odwołujący obiekt notify, następnie wywołać tę funkcję od $(document).ready

Answer 6

jak wszyscy tutaj już zauważył: Należy używać tylko $().ready gdy jesteś obsługi DOM-elementów i nie jest zmienna dostępne, ponieważ użyłeś słowa kluczowego var (jak powinieneś). Słowo kluczowe var ogranicza zdefiniowane zmienne do bieżącego zakresu, który jest zakresem anonimowej funkcji używanej jako obiekt obsługi DOM-Ready.

Usunięcie niepotrzebnego $().read tymczasowo rozwiąże problem.

ALE (!) Powinieneś zawinąć swój kod do zamknięć, aby uniknąć bałaganu w zasięgu globalnym i uniknąć możliwych konfliktów nazw z kodem firm trzecich.

tak:

notify.js

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

script.js

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

Więc teraz będziesz miał ten sam problem jak wcześniej, nie masz dostępu do twojego obiektu.

Pewnie możesz dodać swój obiekt notify do globalnego zasięgu, jak sugerował Arun P Johny w swojej odpowiedzi, ale jestem pewien, że z czasem będzie więcej obiektów, których potrzebujesz do globalnej dostępności. Jeśli umieścisz każdą z nich w zasięgu globalnym, zaczniesz ponownie mieszać zasięg globalny, więc moja rekomendacja będzie JEDNYM globalnym obiektem, który będzie przechowywał wszystkie inne obiekty/zmienne, których potrzebujesz na całym świecie. (Lub nawet lepiej użyć czegoś podobnego requirejs

somethink tak:

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); 

skryptu.js

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

Niektóre interesujące Q/A chodzi o zakres i zamknięć tutaj na stackoverflow:

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

dobra odpowiedź o aprowizacji z Zakres globalny:

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