2012-02-16 12 views
17

Pochodzę z klasycznego tła OOP Niedawno zacząłem się uczyć więcej o JavaScript. Jest jednak jedna rzecz, której nie mogę w pełni zrozumieć:Jak organizować funkcje JS w wielu plikach

W klasycznych językach OOP zwykle tworzy się osobny plik dla każdej klasy, ponieważ ułatwia to utrzymanie kodu. JS nie ma prawdziwych klas, i o ile wiem, nie ma również prostego sposobu na dołączenie innego pliku JS z jednego pliku. Jednak, gdy pracujesz z zespołem nad dużym projektem JS, prawdopodobnie chcesz podzielić projekt na wiele plików. Jak to się robi? Co umieścisz w tych plikach i jak je poprawnie załadować?

Odpowiedz

9

Uwielbiam twoje pytanie. Piszę mój JavaScript bardzo Object Oriented i utrzymuję moje konstruktory obiektów w ich własnych plikach. Wrzucam wszystkie moje pliki .js do katalogu, który mogę uporządkować w podkatalogi w dowolny sposób. Następnie uruchamiam skrypt "make". Poniżej znajduje się skrypt Bash, który napisałem. Pracuję na maszynie z Linuksem, więc skryptowanie Bash jest naturalnym rozwiązaniem dla mnie każdego, kto pracuje w Linuksie.

#!/bin/bash 

echo '' > temp0.js 
find ./bin/external -name \*.js -exec cat {} >> temp0.js \; 

echo ''> temp1.js 
echo '(function(){' > temp1.js 
find ./bin/prop -name \*.js -exec cat {} >> temp1.js \; 
echo '})();' >> temp1.js 

cat temp0.js temp1.js > script.js 
rm temp1.js temp0.js 

Przebacz mi, jeśli ten skrypt bash jest amatorski. Przyznaję, że w skryptach bash po prostu zhakuję wszystko, co działa, ale podoba mi się mój JavaScript, aby był czysty i zorganizowany oraz zorientowany obiektowo.

Ten skrypt bash trafia do katalogu wraz z katalogiem o nazwie "bin", który zawiera wszystkie pliki .js javascript. Tam podkatalog "zewnętrzny" zawiera różne wypożyczone skrypty, takie jak JQuery. Umieszczam własne skrypty .js w folderze o nazwie "prop" w powyższym przykładzie. Skrypt bash pobiera wszystkie te skrypty i łączy je. Zawija również moje własne pliki wniosku w anonimową funkcję, aby nadać im prywatną przestrzeń nazw (sortof).

Domyślam się, że to nie jest dokładnie to, czego chciałeś - Java - ale myślę, że jest to opcja, z którą musimy sobie poradzić w JavaScript.

+1

Bardzo podoba mi się to rozwiązanie! Jest to również najbardziej kompletna odpowiedź, jaką mam, więc dziękuję! – Tiddo

1

Możesz pogrupować pliki według dowolnej logicznej metody. Zazwyczaj jest to wykonywane przez funkcję - ten plik animuje logo, ten plik tworzy funkcję pokazu slajdów na stronie głównej, ten plik obsługuje rozwijane paski nawigacji. Wyobrażam sobie, że zazwyczaj twój zespół dzieli się na podobną organizację, w której każda osoba odpowiada za określoną funkcję. Poza tym zarządzanie kontrolą źródła działa tak samo, jak każdy inny projekt, w którym użytkownicy muszą wyewidencjonować lub zatwierdzić kod podczas pracy nad nim.

4

Model prototypowy JavaScript jest bardzo prosty i możesz podzielić kod na dowolną liczbę plików. Istnieje kilka różnych sposobów ładowania zależności, z których popularna jest RequireJS.

2

Będziesz musiał posegmentować kod w dowolny sposób ma sens dla twojego projektu.

To, jak uwzględnić skrypty, jest trudniejsze. Najprostszym sposobem jest po prostu zawierać wiele plików JavaScript, albo kolejno wywoływane z HTML (<script src="..."></script><script src="..."></script>) lub kierownika zależność lub skryptu obciążenia jak Yepnope lub RequireJS ..

Jednakże, jeśli chcesz to tylko jeden skrypt z Twojego HTML, możesz połączyć pliki (używając skryptu budowania z Ant lub coś podobnego) lub zhackować JavaScript, aby dołączyć inne skrypty, jak tutaj opisano: How do I include a JavaScript file in another JavaScript file?

Powiązane problemy