Continúe con el artículo anterior "Cómo escribir código JS de alta calidad" Esta vez resolveré los puntos de conocimiento de las funciones de JavaScript.
2. Use funciones
Las funciones proporcionan a los programadores funciones abstractas y mecanismos de implementación. Las funciones pueden implementar de forma independiente múltiples características diferentes en otros idiomas, como procedimientos, métodos, constructores e incluso clases o módulos.
2.1 Comprender las diferencias entre llamadas de función, llamadas de método y llamadas de constructor
Para la programación orientada a objetos, el constructor de funciones, métodos y clases son tres conceptos diferentes.
Modo de uso:
1. Llamada de función
La copia del código es la siguiente:
function hello (nombre de usuario) {
devolver "hola" + nombre de usuario;
}
2. Llamada de método
La copia del código es la siguiente:
var obj = {
Hola: function () {
Regrese "Hola," + this.username;
},
Nombre de usuario: "Floralam"
};
ohj.hello (); // "Hola, Floralam"
Esta variable está vinculada al objeto porque el método Hello se define en el objeto OBJ. También podemos asignar una copia de la misma referencia de función en otro objeto y obtener la misma respuesta.
La copia del código es la siguiente:
var obj2 = {
Hola: obj.hello (),
Nombre de usuario: "Floralam"
};
3. Use el constructor
La copia del código es la siguiente:
Función usuario (nombre, contraseña) {
this.name = name;
this.passwordhash = contraseña;
}
Llamar al usuario que usa el nuevo operador se considera un constructor.
La copia del código es la siguiente:
var u = nuevo usuario ("floralam", "123");
A diferencia de las llamadas de función y las llamadas de método, la llamada de constructor toma un objeto completamente nuevo como el valor de esta variable y devuelve implícitamente este nuevo objeto como resultado de la llamada. La responsabilidad principal del constructor es inicializar el nuevo objeto.
2.2 Competente en funciones avanzadas
Las funciones de orden superior no son más que funciones que toman funciones como parámetros o valores de retorno, y usan funciones como parámetros (generalmente llamadas funciones de devolución de llamada, porque las funciones de orden superior "posteriormente lo llaman") es un idioma particularmente potente y expresivo, y también se usa ampliamente en programas JS.
Considere el método de clasificación estándar de las matrices. Para trabajar para todas las matrices, el método de clasificación requiere que la persona que llama decida cómo comparar dos elementos en la matriz.
La copia del código es la siguiente:
funciones compareNumber (x, y) {
if (x <y) {
regreso -1;
}
if (x> y) {
regresar 1;
}
regresar 0;
}
[3,1,4,1,5,9] .sort (comparación); // [1,1,3,4,5,9]
La copia del código es la siguiente:
[3,1,4,1,5,9] .sort (función (x, y) {
if (x <y) {
regreso -1;
}
if (x> y) {
regresar 1;
}
regresar 0;
}); // [1,1,3,4,5,9]
El ejemplo anterior usa una función anónima para simplificar aún más.
Aprender a usar funciones de orden superior a menudo puede simplificar el código y eliminar el tedioso código de Boilerplate. Para la conversión simple de las matrices de cadenas, podemos usar un bucle para implementarlo así:
La copia del código es la siguiente:
Var nombres = ["Fred", "Wilma", "Pebbles"];
var superior = [];
para (var i = 0, n = names.length; i <n; i ++) {
superior [i] = nombres [i] .ToUpperCase ();
}
superior; // ["Fred", "Wilma", "Pebbles"];
Usando el conveniente método de mapa de matrices, puede eliminar bucles y convertir elementos uno por uno usando solo una función local.
La copia del código es la siguiente:
Var nombres = ["Fred", "Wilma", "Pebbles"];
var superior = names.map (function (nombre) {
name de retorno.ToUpperCase ();
});
superior; // ["Fred", "Wilma", "Pebbles"];
Además, por ejemplo, queremos crear varios métodos para crear diferentes cadenas con una lógica de implementación común, y cada bucle crea una cadena conectando los resultados de cálculo de cada parte independiente.
La copia del código es la siguiente:
función bulidString (n, devolución de llamada) {
resultado var = "";
para (var i = 0; i <n; i ++) {
resultado += devolución de llamada (i);
}
resultado de retorno;
}
var alfabet = bulidString (26, función (i) {
return String.FromCharCode (aindex + i);
});
alfabet; // "ABCDEFGHIJKLMNOPQRXTUVWXYZ";
var digits = buildString (10, function (i) {return i;})
dígitos; // "0123456789"
var random = buildString (9, function () {
Random += String.FromCharcode (Math.Floor (Math.Random ()*26) +Aindex
});
aleatorio; // "yefjmcef" (aleatorio)
Esto brindará a los lectores una comprensión más clara de lo que el código puede hacer sin detalles de implementación en profundidad.
Observación
JavaScript devuelve la fórmula para números aleatorios (entre MN) del rango especificado: Math.Random ()*(NM)+M
Al mismo tiempo, preste atención a los requisitos de la pregunta y si se requiere devolver un entero positivo.
2.3 Modo de llamada
Llamar a una función pausará la ejecución de la función actual y pasará los derechos de control y los parámetros a la nueva función. Además de los parámetros formales definidos en el momento de la declaración, cada función recibe dos nuevos parámetros adicionales: esto y los argumentos.
Este es un parámetro muy importante, y su valor está determinado por el patrón de llamadas.
Aquí hay 4 patrones de llamadas muy importantes en JavaScript:
a. Patrón de invocación de métodos
b. El patrón de invocación de funciones
do. El patrón de invocación del constructor
d. Aplicar patrón de llamada el patrón de invocación de aplicaciones
Hay diferencias en cómo estos patrones inicializan los parámetros clave esto
1. Método Método de invocación
Cuando una función es un método de un objeto, lo llamamos un método. Cuando se llama un método, esto está vinculado al objeto llamado.
La copia del código es la siguiente:
var myobj = {
Val: 0,
incremento: function (inc) {
this.val+= typeof inc === "número"? Inc: 1;
},
get_val: function () {return this.val;}
}
myobj.increment (); // 1
myobj ["increment"] (2); // 3
resumen:
1. El método en el que el contexto del objeto al que pertenecen se puede obtener a través de esto se denomina método público
2. Cuando se usa una función con a. o expresión de subíndice, es el modo de llamada de método y este objeto está vinculado al objeto anterior.
3. Una función puede usar esto para acceder a un objeto, para que pueda recuperar el valor del objeto o cambiar el valor del objeto. Ate esto al objeto ocurre cuando se llama.
2. El patrón de invocación de funciones
Cuando una función no es la propiedad de un objeto, se llama como una función. Cuando se llama una función como un patrón de llamadas de función, esto está vinculado al objeto global. Este es un error de diseño de JavaScript y continúa.
La copia del código es la siguiente:
función add (x, y) {
return x+y;
}
myobj.double = function () {
var que = esto;
var helper = function () {
que.val = add (that.Value, that.Value);
// La forma incorrecta de escribir puede ser así, ¿por qué está mal? Porque cuando la función se llama como una función interna, esto se ha unido al objeto equivocado, y el objeto global no tiene una propiedad Val, por lo que se devuelve el valor incorrecto.
//this.val = this.val+this.val;
}
ayudante();
}
myobj.double (); // 6
3. El patrón de invocación del constructor
JavaScript es un lenguaje basado en la herencia prototipo, lo que significa que los objetos pueden heredar directamente los atributos de otros objetos, y el lenguaje no tiene clase.
Si llama a una función con NUEVO, obtendrá un nuevo objeto que oculta el miembro del prototipo conectado a la función, y esto también estará vinculado al nuevo objeto.
El nuevo prefijo también cambia el comportamiento de la declaración de retorno. Este tampoco es el método de programación recomendado.
La copia del código es la siguiente:
var foo = function (status) {
this.status = status;
}
Foo.prototype.get_status = function () {
devolver esto.status;
}
// Construye una instancia de Foo
var myfoo = new foo ("bar");
myfoo.get_status (); // "bar"
4. Aplicar llame al patrón del patrón de invocación de aplicaciones
Debido a que JavaScript es un lenguaje funcional orientado a objetos, las funciones pueden tener métodos.
El método de aplicación tiene dos parámetros. El primero es unir el valor a esto, y el segundo es la matriz de parámetros. Es decir, el método Aplicar nos permite construir una matriz y usarla para llamar a la función, lo que nos permite seleccionar el valor de esto y también nos permite seleccionar el valor de la matriz.
La copia del código es la siguiente:
varilla var = [3,4];
var sum = add.apply (nulo, array); // 7
var statusOBJ = {status: "ABCDefg"};
Foo.prototype.pro_get_status = function (prefix) {
return prefijo +"-" +this.status;
}
estado var = foo.prototype.get_status.apply (statusObj); // "ABCDEFG"
var pro_status = foo.prototype.get_status.apply (statusobj, ["prefix"]); // "prefix -abcdefg"
Típicamente, el receptor de una función o método (nivel unido al valor de esta palabra clave especial) está determinado por la sintaxis de la persona que llama. En particular, la sintaxis de llamadas de método une el método a esta variable por el objeto de búsqueda. Sin embargo, a veces es necesario llamar a las funciones utilizando un receptor personalizado. En este momento, debe utilizar el método de llamada o el método de enlace para personalizar el receptor para llamar al método
2.4 Extraer métodos con receptores de definición utilizando el método de enlace
Dado que el método no es diferente de los atributos cuyos valores son funciones, también es fácil extraer el método del objeto y extraer la función como una función de devolución de llamada y pasarla directamente a la función de orden superior.
Pero también es fácil olvidar vincular la función extraída al objeto extraído.
La copia del código es la siguiente:
var buffer = {
Entradas: [],
Agregar: función (s) {
this.entries.push (s);
}
}
VAR Source = ["867", "-", "5309"];
Source.ForEach (Butter.add); // Error: las entradas están indefinidas
En este momento, el destinatario de la mantequilla. ADD no es el objeto de mantequilla. El receptor de la función depende de cómo se llama, y el método foreach se llama en el alcance global, por lo que la implementación del método foreach utiliza el objeto global como el receptor predeterminado. Dado que no hay atributo de entradas en el objeto global, este código arroja un error.
El método Foreach permite a la persona que llama proporcionar un parámetro opcional como receptor de la función de devolución de llamada.
La copia del código es la siguiente:
VAR Source = ["867", "-", "5309"];
Source.ForEach (Butter.add, Butter);
Pero no todas las funciones de orden superior son cuidadosos y reflexivos de proporcionar a los usuarios el receptor de funciones de devolución de llamada.
Hay dos soluciones:
1) Cree un método de objeto de búfer explícito para llamar a la función Agregar encapsulación. Independientemente de cómo se llama la función de encapsulación, siempre garantiza que sus parámetros sean empujados a la matriz de destino.
La copia del código es la siguiente:
VAR Source = ["867", "-", "5309"];
Source.ForEach (funciones (s) {
mantequilla.add (s);
});
2) El método de enlace del objeto de función requiere un objeto receptor y genera una función de encapsulación que llama a la función original con el método llamado por el objeto receptor.
La copia del código es la siguiente:
VAR Source = ["867", "-", "5309"];
Source.ForEach (Butter.add.Bind (buffer));
Observación
buffer.add.bind (buffer) crea una nueva función en lugar de modificar la función buffer.add:
buffer.add === buffer.add.bind (buffer); //FALSO
Lo anterior se trata de este artículo, espero que les guste.