Principiante: Javascript debe estar en el encabezado para ejecutar? ¿Importa el orden de declaración de las funciones?

votos
0

Tengo esta función en mi cabeza:

<head>
      window.onload = function(){
         var x = new Array(0,2,3,4,5,6,7,8);
         var y = new Array(20,10,40,30,60,50,70,10);  
         drawGraph(y,x);
      }
</head>

¿Puedo declarar la función drawGraph () en algún lugar del cuerpo? ¿Debo declararlo antes de que se llame?

Publicado el 09/12/2008 a las 19:45
fuente por usuario
En otros idiomas...                            


3 respuestas

votos
5

El orden sí importa Deberá tener la función drawGraph () declarada antes de que se la llame.

Respondida el 09/12/2008 a las 19:50
fuente por usuario

votos
0

Debería poder tener la drawGraphfunción en cualquier lugar del documento porque no se llama hasta que el documento esté completamente cargado. Eso significa que cualquier <script>etiqueta ya debería haber sido analizada y ejecutada.

Si bien el orden sí importa, también importa la forma en que declaras las funciones. Si usa la sintaxis de declaración, ...

function identifier ( arglist ) { body }

... entonces existirá antes de que el script se ejecute, independientemente de dónde en el guión lo haya declarado (no estoy seguro de si esto es estándar para todos los intérpretes, pero parece aplicarse dentro de Firefox, Chrome e Internet Explorer) . Sin embargo, eso solo se aplica a una sola <script>etiqueta. Las declaraciones en otras etiquetas de secuencia de comandos no existirán hasta que se analicen esas secuencias de comandos, que es posterior a la ejecución de las secuencias de comandos anteriores.

<html>
    <head>
        <script type="text/javascript">
            function check_existance()
            {
                if(!check_existance.i)
                    check_existance.i = 0;

                document.write("<h5>Call : " + ++check_existance.i + "</h5>" +
                      "func1 : " + typeof func1 + "<br />" +
                      "func2 : " + typeof func2 + "<br />" +
                      "func3 : " + typeof func3 + "<br />" +
                      "func4 : " + typeof func4 + "<br />");
            }
        </script>
        <script type="text/javascript">
            check_existance();

            func1 = function()
                    {
                        alert("func1");
                    };

            check_existance();

            function func2()
            {
                alert("func2");
            }
        </script>
    </head>
    <body>
        <script type="text/javascript">
            check_existance();

            func3 = function()
                    {
                        alert("func3");
                    };

            check_existance();

            function func4()
            {
                alert("func4");
            }
        </script>
    </body>
</html>

Salida:

Llamada: 1
func1: indefinido
func2:
func3 func3: undefined
func4: undefined

Llamada: 2
func1: función
func2: función
func3: indefinida
func4: indefinida

Llamada: 3
func1: función
func2: función
func3: indefinida
func4: función

Llamada: 4
func1: función
func2: función
func3: función
func4: función

Creo que YSlow recomienda que las <script>etiquetas se coloquen en la parte inferior del documento (supongo que antes de la </body>etiqueta de cierre ) debido a la forma en que se cargan en los navegadores.

Respondida el 29/09/2009 a las 19:58
fuente por usuario

votos
0

Tenga en cuenta que muchas plataformas web ya usan el método window.onload, y debido a que window.onload solo se puede llamar una vez, puede tener una colisión de script. Puede considerar utilizar un método diferente para cargar el script que crea la ventana. Onload o espera a que se complete la carga de la página.

Un ejemplo sin usar un marco de JavaScript como JQuery se vería así:

function addLoadEvent(func) {
    var oldonload = window.onload;
    if (typeof window.onload != 'function') {
      window.onload = func;
    } 
    else {
      window.onload = function() {
        oldonload();

        var x = new Array(0,2,3,4,5,6,7,8);
        var y = new Array(20,10,40,30,60,50,70,10);  
        drawGraph(y,x);
      }
    }
}

Un ejemplo usando JQuery se vería así:

  $(document).ready(function() {
    var x = new Array(0,2,3,4,5,6,7,8);
    var y = new Array(20,10,40,30,60,50,70,10);  
    drawGraph(y,x);         
  })
Respondida el 03/03/2009 a las 22:27
fuente por usuario

Cookies help us deliver our services. By using our services, you agree to our use of cookies. Learn more