Jak rozciągnąć przestrzeń nazw javascript na wiele plików?

Zignorowałem javascript na zawsze. Zacząłem używać jQuery kilka lat temu, więc mogłem sobie poradzić. Ale jak już zacząłem robić TDD, postanowiłem wczoraj naprawdę zanurzyć się w javascript (i prawdopodobnie coffeescript po tym).

W mojej aplikacji ASP.NET Web Forms mam wiele stron i obecnie większość tych stron nie ma tony javascript. Jestem w trakcie zmiany tego. Używam Jasmine z Chutzpah do tworzenia testów.

Przeprowadzałem się wraz z testami, które przeszły i zawiodły zgodnie z oczekiwaniami. Ale potem chciałem stworzyć przestrzeń nazw, żeby nie deptać po całym świecie.

Po przeczytaniu tego artykułu:http://enterprisejquery.com/2010/10/how-good-c-habits-can-encourage-bad-javascript-habits-part-1/

Postanowiłem spróbować użyć wzorca z sekcji Self-Executing Anonymous Function: Part 2 (Public & Private) tego artykułu. Wygląda na to, że ma największą elastyczność i wydaje się bardzo dobrze enkapsulować.

Mam folder o nazwie / Skrypty. W tym folderze znajdują się niektóre struktury, których używam, takie jak jQuery, jaśmin, (twitter) bootstrap i modernizr. Mam także podfolder o nazwie / Site, w którym umieszczam mój kod witryny w wielu plikach na podstawie strony. (product.js, billing.js itd.)

Pod / Scripts / Site Dodałem podfolder do / Tests (lub Specs), które mają pliki (test_produktów.js, billing_tests.js itp.).

Bez przestrzeni nazw wszystko jest w porządku. Mam plik utility.js, który utworzyłem za pomocąpadLeft funkcja pomocnicza. Następnie użyłem tego globalnego padLeft w innym pliku .js. Moje testy zadziałały i byłem szczęśliwy. Postanowiłem wtedy znaleźć przestrzeń nazw i zmienić moje Skrypty / Site / utility.js, aby wyglądały tak:

<code>(function (myns, $, undefined) {
    //private property
    var isSomething = true;

    //public property
    myns.something = "something";

    //public method
    myns.padLeft = function (str, len, pad) {
        str = Array(len + 1 - str.length).join(pad) + str;

        return str;
    };


    //check to see if myns exists in global space
    //if not, assign it a new Object Literal
}(window.myns= window.myns|| {}, jQuery ));
</code>

Następnie w moich Skrypty / Site / Tests / utility_test.js mam

<code>/// <reference path="../utility.js" />

describe("Namespace myns with public property something", function () {
    it("Should Equal 'something'", function () {
        expect(myns.something).toEqual('something');
    });
});
</code>

W tym niezwykle prostym teście spodziewałem się, że myns.something powróci z wartością ciągu „coś”.

Tak nie jest. Wracaniezdefiniowany.

Jak więc użyć przestrzeni nazw javascript dla wielu plików?

Przepraszam za długie wprowadzenie, ale pomyślałem, że może to pomóc wyjaśnićczemu mnie robiąc to w ten sposób. Wszystko to również dlatego, że jestem otwarty na słuchanie pomysłów na to, jak ta konfiguracja jest całkowicie błędna lub częściowo błędna lub cokolwiek innego.

Dziękujemy za poświęcenie czasu na przeczytanie tego pytania.

UPDATE: SOLVED Dziękuję wszystkim za pomoc. Najwięcej pomocy przyniósł komentator @ T.J. Crowder. Nie wiedziałem, że istnieje narzędzie jsbin i po przekonaniu, że kod, który umieściłem powyżej, został umieszczony w narzędziu, a wyniki były prawidłowe, wiedziałem, że coś musi być wyłączone w moim środowisku.

Link w zaakceptowanej odpowiedzi również bardzo mi pomógł. Po zobaczeniu, że składnia i logika są spójne i działają, musiałem tylko ustalić, co było nie tak w mojej konfiguracji. Jestem zakłopotany, gdy mówię, że to ja przechodziłem w jQuery, ale w mojej uprzęży testowej, gdzie próbowałem doprowadzić to do pracy, w rzeczywistości nie korzystałem z jQuery. Oznaczało to, że moduł nie był faktycznie ładowany - więc myn nigdy nie został ustawiony.

Dziękuję wszystkim. Mam nadzieję, że może to być pomocne dla kogoś w przyszłości. Jeśli korzystasz z powyższego, upewnij się, że zawierasz obiekt jQuery. Inną opcją jest nie przekazanie jQuery i usunięcie $ z listy parametrów.

questionAnswers(2)

yourAnswerToTheQuestion