Jestem średnio wprawnym programistą używającym JavaScript, ale nie jestem guru. Wiem, że potrafisz zrobić z nim całkiem potężne rzeczy, po prostu nie widziałem zbyt wiele poza zwykłą manipulacją DOM. Zastanawiam się, czy ludzie mogą podać przykłady tradycyjnych koncepcji wzorniczych, takich jak Metoda Fabryki, Singleton, itp., Używając JavaScript. W jakich przypadkach te wzorce byłyby używane w Internecie?Jakie są przykłady implementacji wzorców projektowych przy użyciu JavaScript?
Odpowiedz
Po prostu chciałem dodać mój ulubiony wzór JavaScript, którego nauczyłem się od Pro JavaScript Design Patterns, które już polecił Jonathan Rauch.
Jest to wzór singleton przestrzeni nazw. Zasadniczo tworzysz przestrzenie nazw za pomocą singletonów, które pozwalają ukrywać metody i zmienne przed zewnętrznym użyciem. Ukryte/odkryte metody są faktycznie ukryte, ponieważ są zdefiniowane w zamknięciu.
var com = window.com || {};
com.mynamespace = com.mynamespace || {};
com.mynamespace.newpackage = (function() {
var myPrivateVariable = "hidden";
var myPublicVariable = "exposed";
function myPrivateMethod() {
return "also hidden";
}
function myPublicMethod() {
return "also exposed";
}
return {
myPublicMethod: myPublicMethod,
myPublicVariable: myPublicVariable
};
})();
Podejrzewam, że może - oto przykład Singleton:
@jamting:
Oh my god. Nie wiem co powiedzieć.
To OP: tak, oczywiście możesz w pewnym sensie, ale niektóre wzorce, jak przyzwyczaiłeś się do nich, nie są tak widoczne, jak w Javie. Na przykład, Singleton musiałby być jedynie przedmiotem:
var singleton = {
sayHello: function() {
alert("Hello!")
}
};
Wikipedia ma przykład Factory w JS.
Dzięki, poprawiono link . – Nickolay
Oczywiście, że mogą. Oto książka na ten temat:
Pro JavaScript Design Patterns
Oto przykład wzorca fabryczne:
Factory pattern in Javascript
Nickolay poruszył, ale wzorce projektowe nie są zgodne między językami, które drastyczne różnice. Czytałem wcześniej (i zgadzam się z), że wzorzec projektu często jest oznaką brakujących funkcji w języku.
Jako doskonały przykład, „Fabryka” wzór jest zupełnie niepotrzebne w niektórych językach Ruby jako przykład mam na myśli (bo budowa obiektu jest tylko metoda na przykład klasa):
# create a factory for MyObject
my_factory = MyObject
instance_1 = my_factory.new
# change the factory to another class
my_factory = MyOtherObject
instance_2 = my_factory.new
Zawsze, gdy stosujesz wzorzec projektowy do innego języka, niż został pierwotnie opracowany, upewnij się, że rozważasz, czy jest to NAPRAWDĘ konieczne i jakie sposoby możesz ulepszyć dzięki nowym dostępnym funkcjom językowym. Wzorce projektowe są tylko wskazówką, należy zawsze zastanowić się, czy zamierzone użycie naprawdę wymaga wzoru, lub czy można go w lepszy sposób adoptować w twoim przypadku.
Niedawno używane Bernie's Better Animation Class sprawia, że szerokie wykorzystanie Wzorca Strategy projektu. Bernie wykonuje świetną robotę opisując, dlaczego należy stosować Wzór Strategiczny, ale niestety nie wyjaśnia dokładnie, jak działa kod. Z drugiej strony, korzystając z odwołania do wzorców projektowych, zapoznaj się z kodem i komentarzami w pliku animator.js, aby uzyskać dobry przykład użycia wzorca strategii.
Przykład:
// This object controls the progress of the animation
ex1 = new Animator();
// The Animator's subjects define its behaviour
ex1.addSubject(updateButton);
function updateButton(value) {
$('ex1Button').innerHTML = "Progress: " + Math.round(value * 100) + "%";
}
// now click below: each click to the button calls ex1.toggle()
Chciałbym dodać tu co ja badali jako grupa z dyskusji na temat wzorców projektowych zarówno w C# i JavaScript. To, co mi się wydaje podczas spotkania, to to, że facet z C# pisze kody w JavaScript i to samo dla faceta JavaScript. Po opuszczeniu spotkania próbuję dowiedzieć się więcej w domu i robić blogi tutaj http://tech.wowkhmer.com/category/Design-Patterns.aspx zarówno dla języka C#, jak i JavaScript.
Szkoda: 404. –
Link w odpowiedzi jest martwy. – Pang
Listen do Justina Diaza mówiący o wzorze dla Javascript. Dyskusja opiera się również na wspomnianej wyżej książce Pro Javascript Techniques. Rozmowa jest około 45 min w Google I/O
What is this practice called in JavaScript?
To samo wezwanie Pattern Design. Nigdy go nie widziałem, dopóki nie zacząłem JavaScriptingu.
Jest dobry darmo rezerwuj przez Addy Osmani, wprowadzenie wzorców projektowych javascript: Essential JavaScript Design Patterns For Beginners, Volume 1
On również odnosi się tutaj w swojej książce. – inetphantom
- 1. Użycie wzorców projektowych w R
- 2. Java 6: Przykłady implementacji własnego języka skryptowego przy użyciu javax.script?
- 3. Jakie są dobre przykłady bibliotek klientów REST API w JavaScript
- 4. Jakie są przykłady użycia Nokogiri?
- 5. Jakie są przykłady interfejsów Go?
- 6. Jak uczyć wzorców projektowych dla zespołu
- 7. Komunikacja między widokami wzorców projektowych a zdarzeniami
- 8. Najlepsze strony internetowe dla wzorców projektowych?
- 9. Banda czterech wzorców projektowych - kod przykładowy C?
- 10. Rzeczywiste przykłady wzorców metod fabryki
- 11. Jakie są rzeczywiste przykłady wykresu zależności Gradle'a?
- 12. Jakie są przykłady barier pamięci w C++?
- 13. Jakie są imponujące przykłady kodu funkcjonalnego?
- 14. Jakie są parametry "printto" przy użyciu shellexecute?
- 15. Uzyskiwanie wzorców projektowych jsdoc i Crockford, aby się dogadać
- 16. Czy są jakieś przykłady aplikacji iOS napisanych przy użyciu PyObjC?
- 17. Jakie są ograniczenia implementacji Klastra NDB MySQL?
- 18. Krótkie przykłady implementacji interpretacji abstrakcyjnej
- 19. Awesome C# Code do nauki wzorców projektowych i najlepszych praktyk?
- 20. Jak się nazywa, gdy ludzie próbują nadużywać wzorców projektowych?
- 21. Przykłady projektów JavaScript API
- 22. Nie można zrozumieć SOLIDNYCH zasad i wzorców projektowych
- 23. Odsyłacz do dobrych wzorców projektowych UI z interfejsem użytkownika
- 24. Co to jest OSGi i jakie są przykłady jego użycia?
- 25. Jakie są przykłady aktualnie opracowywanych aplikacji/bibliotek tłumaczenia maszynowego?
- 26. Jakie aplikacje w Google Play są zbudowane przy użyciu Qt?
- 27. Jakie są szczegóły implementacji i uzasadnienie AntiForgeryToken programu ASP.NET MVC3?
- 28. Tworzenie sekwencji numerycznych w R przy użyciu wzorców standardowych
- 29. Najlepszy sposób implementacji asynchronicznej metody "loadData" przy użyciu wzorca MVVM
- 30. Książki, które będą dotyczyć TDD, DDD i wzorców projektowych w .NET
Czy powinien to być "com.mynamespace.newpackage = (function() {...}())"? Po prostu ciekawy, ponieważ JSLint narzeka. :) –
@ Brian M. Hunt: Zawsze widziałem to tak, jak to napisałem, ale twój sposób wydaje się działać w Chrome i Firefox, nie wiem jednak o IE i innych. Bez względu na to, niektóre pareny są potrzebne, w przeciwnym razie pareny stosujące funkcję są zgłaszane jako błędy składniowe. –
@Brian To naprawdę zależy od stylu, możesz to zrobić w dowolny sposób. – nyuszika7h