javascript - una - waypoints js jquery 3

funciones dentro o fuera de jquery documento listo

Question

Hasta ahora solo pongo toda mi bondad de jQuery dentro de la función $(document).ready() , incluidas las funciones simples que se usan en ciertas interacciones del usuario.

Pero las funciones que no requieren que se cargue el documento DOM o solo se llaman después de todos modos, también pueden ubicarse fuera de $(document).ready() . Considere por ejemplo una función de validación muy simple como:

function hexvalidate(color) {
// Validates 3-digit or 6-digit hex color codes 
 var reg = /^(#)?([0-9a-fA-F]{3})([0-9a-fA-F]{3})?$/;
 return reg.test(color);
}

Sin embargo, la función solo se llama desde la función $(document).ready() .

¿Cuál es la mejor práctica (sintaxis, velocidad); colocando dicha función dentro o fuera de la función de documento jquery listo?

Answer 1

No creo que debas estar usando ''funciones simples'' en primer lugar. En OOP javascript, una "función" generalmente pertenece a uno de cuatro tipos distintos:

• Constructor o cierre ''init'' anónimo: se usa para construir objetos. El único tipo de función que se permite ser global
• Método: función que es parte de algún objeto
• Utilidad: función interna de un constructor / método, invisible desde el exterior
• Constante: una constante funcional pasada como parámetro

p.ej

 (function() { <- init closure

        function helper1() { <- utility }

        globalSomething = {

              foobar: function() { <- method 
                  xyz.replace(/.../, function() { <- constant })

              }
        }
  )()

En su ejemplo, ''hexvalidate'' es obviamente una parte del objeto Validator, que, a su vez, puede convertirse en un plugin jQuery:

   (function($) {
        $.validate = {
            hexColor: function(color) { ... your code }
            more validators...
        }
     )(jQuery)

Answer 2

Póngalo adentro para que no contamine el espacio de nombres global. También asegura una resolución más rápida del nombre de la función debido a las cadenas de alcance de JavaScript.

Ponlo afuera si se trata de un componente reutilizable, por lo que puedes moverlo fácilmente en un archivo separado y llamar desde diferentes contextos.

Como ya usa JQuery, vale la pena mencionar que, en su caso, puede definir hexvalidate como un complemento de JQuery fuera y luego invocarlo dentro .

Answer 3

Si está creando una función que necesita ser llamada fuera del alcance de la función $ (document) .ready (), manténgala fuera de la función $ (document) .ready ().

De lo contrario, mantenlo interno.

Answer 4

Si todas sus funciones solo se invocan desde el bloque jQuery(function () { }) , colóquelas dentro. De lo contrario, estás contaminando innecesariamente el espacio de nombres global, lo que puede conducir a conflictos en el futuro.

Solo declare funciones globalmente que también sean utilizadas por código en otros ámbitos.

Answer 5

Una ventaja de poner esas funciones dentro de la función de documento listo es que no contaminan su espacio de nombres global ... con el inconveniente de que si los necesita en otro lugar en la página no estarán disponibles.