Varios métodos de definición de función común en JavaScript

Este artículo describe en detalle varios métodos de definición de función común en JavaScript, y se comparte con usted para su referencia. El análisis específico es el siguiente:

Primero, echemos un vistazo a las cuatro definiciones de funciones más comunes en JavaScript:

La función definida con el constructor de funciones, el código es el siguiente:

 var multiply = nueva función ('x', 'y', 'return x * y;');

Declaración de funciones, este método también es el más común:

 función multiplicar (x, y) {return x * y;}

Las expresiones de funciones, declaradas como función anónima y luego asignadas a una variable, son formas muy comunes:

 var multiply = function (x, y) {return x * y;}

Expresión de la función, pero la declaración de función es una función nombrada y luego asignó un valor a una variable, que se ve exactamente como la misma manera:

 var multiply = function multi (x, y) {return x * y;}

Primero, comparemos el nombre de la función y la relación directa entre la variable de función asignada a la función. Realmente es un poco ... para ser más intuitivo, desde el ejemplo 4 en este momento, es la relación entre la variable de función multiplica y el nombre de la función multi:

Los nombres de las funciones no se pueden modificar, por el contrario, las variables de función se pueden reasignar. Debe ser fácil entender que las variables de función se pueden reasignar. En nuestro cuarto ejemplo, la variable de multiplicación acaba de definir, no es agradable de ver y reasignarla para:

 multiply = function (x, y) {return x + y;}

Inmediatamente me transformé de la multiplicación a la adición. Sin embargo, es imposible cambiar la variable de función múltiple. La definición de función ya está ahí. Mientras aún conserva su referencia, no cambiará. Puede que no sea fácil de entender aquí. Piénselo primero, y mire hacia abajo, y debería poder entenderlo lentamente.

El nombre de la función no se puede usar fuera de la función al mismo tiempo, solo es visible dentro del cuerpo de la función. Un ejemplo muy simple:

 var foo = function bar () {alert ('hola');} foo (); // indicar barra de cadena "hola" (); // ejecutar un error, la barra no está definida

Y obviamente, la barra aquí es de hecho un nombre de función, pero realmente no se puede llamar externamente. En este momento, definitivamente habrá zapatos para niños preguntando por qué este ejemplo todavía se ve tan bien, como el ejemplo 4, ¿por qué no usar el método del ejemplo 2? Buena pregunta, déjame desglosarlo lentamente.

Continuando con el ejemplo 4, podemos ver que el nombre de la función (multi) y la variable de función (multiplicar) no son los mismos, pero de hecho, los dos no tienen ninguna relación, por lo que no es necesario mantener la consistencia. Hablando de esto, creo que los cuatro ejemplos anteriores deberían reducirse a 3, y el ejemplo 2 y el ejemplo 4 deberían ser esencialmente consistentes. ¿Qué, no lo creas? Jeje, tengo que seguir manteniéndolo en silencio ~ Sigue leyendo ~~

Encontramos que en comparación con el Ejemplo 2 y el Ejemplo 4, solo hay menos variables de función VAR, mientras que en comparación con el Ejemplo 3, solo hay menos ese nombre de función. Desde la perspectiva del fenómeno, la esencia del Ejemplo 2 y el Ejemplo 4 es la misma, y ​​la evidencia es la siguiente:

 function foo () {} alert (foo); // solicita el nombre de la función que contiene "foo" var bar = foo; alerta (bar); // solicita el nombre de la función todavía solo contiene "foo", y no tiene relación con Bar

¿Es realmente Ironclad? ¿Es la forma de escribir el código anterior similar al Ejemplo 2 en combinación con los códigos en el Ejemplo 4? Correcto, esto es lo que acabo de decir que los dos deberían ser esencialmente lo mismo. Sin embargo, al definir la función en el caso 2, el motor JS nos ayudó a hacer algo, como declarar una función con el nombre de la función multiplica, y definir silenciosamente una variable también llamada Multiply, y luego asignarla a esta variable, dos exactamente los mismos nombres. Pensamos que al usar el nombre de la función multiplica, en realidad estábamos usando la variable de función multiplica, por lo que estábamos mareados ~ para ser honestos, también estaba mareado ~ en resumen, cuando llamamos, en realidad llamamos la variable de función, y el nombre de la función no podía llamar a la función externamente, por lo que tenía la inferencia anterior.

Sin embargo, una pequeña diferencia a mencionar aquí es que la función definida por el método de declaración de función es diferente de la declaración del constructor o la declaración de expresión de la función, el método de declaración de función se puede llamar antes de la definición de la función ... sin mencionarlo, solo mire el código:

 foo (); // tip foofunction foo () {alert ('foo');} bar (); // amigo, es realmente diferente de lo anterior, así que no presiones. ¿No es esto un error? La barra de inmediato no está definida var bar = function () {alert ('bar');}

Hablemos de las funciones declaradas por el constructor. Las funciones declaradas no heredarán el alcance de la ubicación declarada actual. Solo tendrán un alcance global por defecto. Sin embargo, esto es lo mismo en otros métodos de declaración de funciones, como sigue:

 función foo () {var hi = 'hello'; // return function () {// alerta (HI); //}; Función de retorno ('return Hi;');} foo () (); // Para el efecto de ejecución, ejecute y vea usted mismo

Se puede imaginar que la ejecución de la función devuelta mediante el uso de la declaración del constructor inevitablemente informará un error porque la variable HI no está en su alcance (es decir, alcance global).

Otro punto es que las personas a menudo dicen que las funciones declaradas en el modo constructor son ineficientes. ¿Por qué es esto? Hoy aprendí del documento que las funciones declaradas en las otras tres maneras solo se analizarán una vez. De hecho, existen en el cierre, pero eso solo está relacionado con la cadena de alcance, y el cuerpo de la función solo se analizará una vez. Pero el método del constructor es que cada vez que se ejecuta una función, su cuerpo de función se analizará una vez. Podemos pensar que la función declarada de esta manera es un objeto, que almacena los parámetros y el cuerpo de la función. Cada vez que se ejecuta, debe analizarse una vez, y los parámetros y el cuerpo de la función se ejecutarán, lo que inevitablemente será ineficiente. ¿No sabes cómo hacer el experimento específico?

Finalmente, hablemos de algo a lo que nadie presta atención. ¿Cuándo parece la forma de las declaraciones de funciones, no la forma de la vida de la función (todavía está tan inclinado a decirlo simplemente, cuando el camino del ejemplo 2 se convierte en otra forma inadvertidamente):

Cuando se convierte en parte de la expresión, es como el ejemplo 3 y el ejemplo 4.

Ya no es el "elemento fuente" del script en sí o la función. ¿Cuál es el elemento fuente? Es decir, una declaración no anidada en el script o en un cuerpo de funciones, como:

 var x = 0; // Elemento de origen if (x == 0) {// Elemento de origen x = 10; // no es un elemento fuente, porque está anidado en la función de instrucción if boo () {} // no es un elemento fuente, porque está anidado en la función if} foo () {// elemento fuente var y = 20; // El elemento fuente de la función Bar () {} // El elemento de origen mientras (y == 10) {// Función de elemento fuente blah () {} // no es un elemento fuente, porque está anidado en la declaración while y ++; // no es un elemento fuente, porque está anidado en una declaración de tiempo}}

He entendido aproximadamente el concepto de elementos de origen. Continuaré con la declaración de función que acabo de mencionar. Consulte:

 // Función Declaración Función foo () {} // Expression de function (function bar () {}) // Expression de function x = function hello () {} if (x) {// function Expression function world () {}} // función de la función de instrucción A () {// función de la función b () {} if (0) {// function function c () {{{}}}}}}}}}}}}}}}}}}}}}}}}}}}}}}

Finalmente, déjame hablar sobre mi propia comprensión. La razón para distinguir entre la declaración de función y la declaración de no función es que, en mi opinión, la definición de función del método de declaración de función se declarará de antemano cuando el motor JS lo ejecute. Es decir, como acabamos de decir anteriormente, se puede usar antes de la definición de la función. De hecho, el motor de análisis lo ha analizado antes de usarlo. Sin embargo, la declaración de función de expresión sin función, como la función de expresión, el motor de análisis JS solo definirá la variable declarada por VAR por adelantado. En este momento, el valor variable no está definido, y la asignación real a esta variable está en la ubicación real del código. Por lo tanto, los errores mencionados anteriormente están todos indefinidos. La variable real se ha definido, pero aún no se ha asignado. El motor de análisis JS no sabe que es una función.

Creo que la descripción en este artículo tiene cierto valor de referencia para el diseño de programación web JavaScript de todos.