practicas - Mis patrones/prácticas de JavaScript apestan. ¿Dónde debo buscar ayuda?
pattern en javascript (7)
He estado trabajando casi exclusivamente en tareas de back-end durante los últimos años, y me he dado cuenta de que la mayoría de los proyectos de JavaScript (y de CoffeeScript) tienen mucho más belleza en mi ausencia.
Trabajo principalmente en un entorno de rieles, y casi todo mi JavaScript / jQuery solía tener este aspecto:
$(an_element).an_event(function() {
stuff_i_want_to_do;
})
$(another_element).some_other_event(function() {
some_other_stuff_i_want_to_do;
})
Dejando de lado las devoluciones de llamada, eso es todo.
De todos modos, solo estaba navegando a través del código de otras personas y noté que muchos javascripters se han vuelto mucho más bonitos en mi ausencia. Esto no es complejo, pero es típico del enfoque nuevo / mejor de JavaScript que he estado viendo:
jQuery ->
if $(''#products'').length
new ProductsPager()
class ProductsPager
constructor: (@page = 1) ->
$(window).scroll(@check)
check: =>
if @nearBottom()
@page++
$(window).unbind(''scroll'', @check)
$.getJSON($(''#products'').data(''json-url''), page: @page, @render)
#
nearBottom: =>
$(window).scrollTop() > $(document).height() - $(window).height() - 50
render: (products) =>
for product in products
$(''#products'').append Mustache.to_html($(''#product_template'').html(), product)
$(window).scroll(@check) if products.length > 0
He estado buscando recursos sobre las mejores prácticas / patrones modernos para JavaScript (y / o CoffeeScript), pero no he tenido mucha suerte. Así que, en resumen, ¿dónde debo buscar la actualización: los mejores patrones y prácticas modernas de javascript / coffeescript?
Recursos de JavaScript
Patrones para la arquitectura de aplicaciones de JavaScript a gran escala
Patrones esenciales de diseño de JavaScript para principiantes, volumen 1.
jQuery especifico
Herramientas para la arquitectura de aplicaciones jQuery
CoffeeScript
Aquí hay algunos enlaces que he recogido:
General
http://eloquentjavascript.net/
Patrones
http://addyosmani.com/resources/essentialjsdesignpatterns/book/
Herencia
http://blog.vjeux.com/2011/javascript/how-prototypal-inheritance-really-works.html
Patrón de módulo
http://www.adequatelygood.com/2010/3/JavaScript-Module-Pattern-In-Depth http://ajaxian.com/archives/a-javascript-module-pattern http://edspencer.net/2009/10/javascript-module-pattern-overused-dangerous-and-bloody-annoying.html
Nueva palabra clave
¿Es la nueva palabra clave de JavaScript considerada dañina? http://ejohn.org/blog/simple-class-instantiation
Cierres
¿Cómo funcionan los cierres de JavaScript? http://skilldrick.co.uk/2011/04/closures-explained-with-javascript/
Pase por referencia / valor
http://snook.ca/archives/javascript/javascript_pass
Enseñanza de JavaScript
http://concisionandconcinnity.blogspot.com/2010/03/notes-on-teaching-javascript.html
Esta palabra clave
http://alebelcor.blogspot.com/2011/07/this-keyword-in-javascript.html http://yehudakatz.com/2011/08/11/understanding-javascript-function-invocation-and-this/
Objeto Literal
http://blog.rebeccamurphey.com/2009/10/15/using-objects-to-organize-your-code
Prototipo
http://yehudakatz.com/2011/08/12/understanding-prototypes-in-javascript/
Me gusta el libro de cocina CoffeeScript . Se explica mucho y contiene muchos ejemplos.
Probablemente te guste el capítulo 12 llamado Patrones de diseño.
Necesita un buen libro como " Patrones de JavaScript " acompañado de un id / ambiente igualmente bueno como " Fiddle " para practicar.
No creo que leer sobre patrones comunes te ayude a escribir código realmente bueno. Código moderadamente bueno, pero no código realmente bueno. Inicia sesión en irc.freenode.net y pregunto en ## javascript y #coffeescript para obtener ayuda; al menos en #coffeescript, hay muchas personas que lo ayudarán a mejorar el código que usted gist .
No veo el problema con tu código anterior. O con el código más nuevo. Básicamente, simplemente siga los mismos principios que seguiría con Ruby: refactorice sin piedad y deje que emerja una buena arquitectura de la refactorización.
Si necesita jugar con una implementación completa de una arquitectura de referencia de javascript a gran escala, eche un vistazo a:
Es una colección de patrones e integración de algunas bibliotecas buenas con la aplicación de ejemplo de readymade para comenzar. Lo escribí para compartir mi experiencia después de trabajar en un par de grandes proyectos de JS.