javascript - programacion - mostrar loading mientras carga pagina jquery

¿Por qué encuentro Javascript/jQuery tan difícil de hacer bien?

Question

Mi fondo está en C y he recogido PHP, mySQL, HTML, CSS sin demasiados problemas.

Pero me parece que Javascript / jQuery es sorprendentemente difícil de hacer bien. Muy frustrante. ¿Por qué?

1. Parece violar una serie de principios de programación tradicionales (por ejemplo, alcance variable)

2. Las variables no definidas parecen aparecer de la nada y ya tienen valores asociados con ellas. Por ejemplo (de los documentos de jQuery):

   $("a").click(function(event) {
       event.preventDefault();
       $(''<div/>'')
             .append(''default '' + event.type + '' prevented'')
             .appendTo(''#log'');
   });

   ¿Qué es exactamente el "evento"? ¿Tengo que usar este nombre de variable? ¿Debo suponer que este objeto está mágicamente creado con las cosas correctas y puedo usar cualquiera de los métodos de la lista en la API de JQuery ?

3. Parece que hay un montón de reglas aleatorias (por ejemplo, devolver falso para detener una acción predeterminada, ¿pero a veces esto no funciona?)

4. Comportamiento no determinista al depurar. (Por ejemplo, actualizo el navegador, intento algo y obtengo el resultado X para las variables JS que estoy viendo en Firebug. ¿Actualizo nuevamente y obtengo el resultado Y?)

5. Código de aspecto muy desordenado que es difícil de seguir. ¿Que pasa cuando? Estoy usando Firebug y Chrome Developer Tools, pero no estoy obteniendo suficiente visibilidad.

Parece que todos los días aparece una "regla" aleatoria de JS que nunca he visto en ninguno de mis libros o tutoriales de JS.

¿Qué debo hacer para que Javascript / jQuery sea más determinista, controlado y lógico para mí?

¿Hay recursos que expliquen las peculiaridades / errores de Javascript?

¡Gracias!

Answer 1

1) Parece violar una serie de principios de programación tradicionales (por ejemplo, alcance variable)

Necesita declarar variables usando var , de lo contrario entrará en el ámbito global.

2) Las variables no definidas parecen aparecer de la nada y ya tienen valores asociados con ellas (¿cómo sucedió esto?)

Esto posiblemente está relacionado con 1) y / o 4).

3) Parece que hay un montón de reglas aleatorias (por ejemplo, devolver falso para detener una acción predeterminada, ¿pero a veces esto no funciona?)

Necesitas dejar que el manejador también devuelva falso. Por ejemplo, form onsubmit="return functionname()" . También debe regresar de la función "principal", no solo de un cierre (una función dentro de una función), refiriéndose a su pregunta anterior . Solo volvería a la función "principal" y continuaría.

4) Comportamiento no determinista al depurar. (Por ejemplo, actualizo el navegador, intento algo y obtengo el resultado X para las variables JS que estoy viendo en Firebug. ¿Actualizo nuevamente y obtengo el resultado Y?)

Probablemente el código se ejecutó antes de que se completara el DOM de HTML. window.onload enganchar en window.onload o $(document).ready() siempre que quiera ejecutar cosas durante la carga de la página.

5) Código de aspecto muy desordenado que es difícil de seguir. ¿Que pasa cuando? Estoy usando Firebug y Chrome Developer Tools, pero no estoy obteniendo suficiente visibilidad.

Apuesto a que estás hablando de la fuente de jQuery? Es sólo una gran biblioteca. Después de todo, no debes preocuparte por esto al depurar. Más bien preocuparse por su propio código. Sin embargo, asegúrese de que está viendo la versión no certificada del código fuente de jQuery.

Ver también:

• JavaScript: las partes malas
• ¿Qué debe saber cada programador de JavaScript?

Answer 2

1. Es un lenguaje basado en la herencia prototípica y está influenciado por los lenguajes de programación funcionales y el paradigma, por lo que no es completamente OO / procedimiento como otros lenguajes. Las variables son globales implícitas a menos que se declaren con var .

2. Por favor incluya un ejemplo?

3. return false salidas return false fuera de la función como con la declaración de devolución de cualquier idioma. preventDefault() sería el método DOM para cancelar el comportamiento predeterminado de un enlace

4. Javascript se utiliza principalmente en el lado del cliente. Como hay muchos agentes de usuario, cada uno de ellos tiene una implementación diferente del DOM, que es muy inconsistente, más que la propia JS. De nuevo, incluya un ejemplo real para obtener una respuesta definitiva.

5. Encontrará el código de aspecto desordenado en cualquier idioma, y ​​tal vez su falta de comprensión lo perciba como un desorden, cuando en realidad no es tan malo. O tal vez estás mirando un código minificado / ofuscado.

Recomiendo http://eloquentjavascript.net/ para aprender aspectos de Javascript.

Cosas que aprenderás del enlace de arriba.

• lambdas
• cierres
• Herencia prototípica
• Programación basada en eventos
• Depuración
• DOM

Answer 3

" Javascript: The Good Parts " de Crockford ofrece algunos patrones comunes de JS que ayudan con la privatización variable y el alcance. Esto es para javascript en general. Para jQuery solo uso la API. También los videos de Yui Theatre en Javascript son bastante buenos.

Answer 4

" Javascript: The Good Parts " de Douglas Crockford fue un recurso invaluable. Javascript juega mucho más como Lua, Lisp, o Python que C, simplemente parece que se parece a C.

Enlace proporcionado a Amazon; Agarré la mía de O''Reilly.

Answer 5

"JavaScript: The Good Parts" de Douglas Crockford es un buen comienzo

En su caso, los apéndices ("las partes malas" y "las partes horribles") podrían ser las más interesantes :)

Answer 6

En términos de alcance variable, existen variables locales y globales. Uno de los gotchyas de alcance variable se puede ver en este ejemplo:

var thisIsAGlobalVariable
function anon () { 
   var thisIsALocalVariable
   thisIsAGlobalVariable = 5; //if you don''t use the var prefix inside a fn, it becomes global
}

Answer 7

Javascript es complicado No tienes un compilador mirando tu espalda. Para compensar, la prueba unitaria se vuelve más importante. He estado haciendo la prueba de mi unidad con jQuery / QUnit, pero recientemente comencé a usar Jasmine ( http://github.com/pivotal/jasmine ) y lo recomiendo al 200%. Es un gran marco de prueba.

Si no está familiarizado con las pruebas o con las pruebas con javascript, le recomiendo encontrar pruebas unitarias para otros proyectos de OSS con javascript (con suerte para el código que podría usar) y ver cómo lo prueban.

Con las pruebas unitarias, cometerás los mismos errores, pero los atraparás mucho antes y con menos dolor. Y si sus pruebas son buenas, los errores no volverán después de que usted los arregle.

Answer 8

Javascript puede ser un poco complicado y algunos de sus aspectos funcionales confunden a las personas. Si realmente aprendes y entiendes el idioma, lo encontrarás realmente útil, la mayoría de las personas simplemente comienzan a usarlo y luego odian.

Lea javascript las partes buenas de crockford, es muy útil: http://javascript.crockford.com/

También asegúrese de entender el closure . Es un elemento fundamental que las personas no entienden pero a menudo usan.

Answer 9

Lo encuentras difícil porque:

• javascript tiene otro tipo de sintaxis.
• JavaScript es dificil de depurar
• javascript no tiene autocompletado como c # etc) o lo hace
• javascript tiene reglas ilógicas (se vuelven lógicas una vez que te conocen)
• todo se puede hacer de 1000 maneras, y cuando busque una solución, encontrará 2000 respuestas :) donde c #, php en su mayoría tienen una función de buena práctica u "debería / podría" usar

Sin embargo, comencé a usar js / jquery hace medio año, con el mismo razonamiento que tú, y me ceñí a él, y ahora lo uso a diario para mejorar mis aplicaciones web.

Me encanta (especialmente jquery). Es un salvavidas, sé qué y dónde mirar, puedo hacer cualquier cosa con él.

Todo parece lógico.

Si puedo darte un consejo: javascript / jquery es una manzana agridulce, pero simplemente agárrate allí, poco más y no te arrepentirás.

también, un montón de gente lo usa y siempre está dispuesto a echar una mano si es necesario (lo sé)

Answer 10

No sé cuánto diseño de UI ha hecho en C, pero la variable de evento solo aparece cuando la persona que llama la envía y el manejador necesita, bueno, manejar el objeto. Si lee sobre un objeto de evento, la confusión en q # 2 debería desaparecer.

No hay manejo de eventos en PHP, por lo que creo que no se ha encontrado con este problema en el pasado. JavaScript es un lenguaje de programación con su propio propósito, por lo que fue diseñado para funcionar para ese propósito específico.

Answer 11

Para ser honesto, creo que tienes un buen entendimiento. Algunos de mis complejos eran similares. La forma en que he estado avanzando es "bueno, si así es como es, entonces es como es". Solo acepta las idiosincrasias y sigue adelante. PHP hace algunas de las mismas cosas (las variables pueden aparecer de la nada, etc ...). Simplemente codifique la forma en que desea codificar y si funciona, ¡entonces genial!

Luego, después de llegar a ese punto, comience a desglosar el generador de perfiles y vea si hay algo que pueda optimizar.

Aquí hay un par de cosas:

Si entiendes CSS, entonces los selectores jQuery deberían ser fáciles. En lo que respecta al código, eso también es sencillo si puedes lidiar con el chaining y JSON. EDITAR: también, la documentación jQuery en todo es excelente! Y no hay escasez de expertos en jQuery aquí en SO para ayudarnos a los noobs (y esperamos poder devolver el favor a los noobs más nuevos).

Hay un ámbito para trabajar. (Básicamente) cualquier cosa escrita fuera de una función u objeto está en el alcance global. Si estás dentro de un objeto o función y usas var , eso establece el alcance de la variable

Javascript no es como un lenguaje basado en C (incluso C ++ o PHP). Utiliza prototipos para tratar las relaciones de clase / objeto en lugar de un esquema de subclasificación.

La cosa # 1 que me lanzó a un bucle es que cualquier JS que aparezca en cualquier lugar de la página o que esté incluido en las etiquetas <script> es un juego justo. Si tiene una variable global en un script, puede usar esa misma variable en un script completamente diferente y funcionará. Eso puede ser lo que quieres decir con las variables que aparecen de la nada. Además, hay algunas variables basadas en DOM que pueden simplemente "aparecer" también.

De todos modos, creo que si solo sigues adelante, obtendrás algunos momentos "AHA". Soy un novato relativo a la programación, pero continuo creciendo siempre y cuando no cuelgue algo que no tenga demasiado impacto en hacer que el código se ejecute.

Answer 12

Tal vez tenga que vincular su código a un botón onclick="event()" HTML para onclick="event()" como el evento.