Mi comprensión de esto siempre ha sido solo sobre poder usarlo y conocerlo, pero no he profundizado en su esencia. Esta vez, tengo un conocimiento profundo con "JavaScript the Good Parts". (Toda la depuración se puede ver en la consola, la tecla del navegador F12)
Echemos un vistazo a esto juntos.
Cuando declaramos una función, cada función tiene dos parámetros adicionales (parámetros formales) definidos, uno es este y el otro son argumentos. Los argumentos son los parámetros realmente aceptados por la función y son una variedad de clases. Solo daré una breve introducción a los argumentos, y nos centraremos en este puntero.
En la transformación orientada a objetos, esto es muy importante, y su valor depende del patrón de la llamada. En JavaScript, hay 4 patrones de llamadas en total: patrones de llamadas de método, patrones de llamadas de funciones, patrones de llamadas de constructor y aplicar patrones de llamadas.
Modo de llamada de método
Cuando una función es un atributo como objeto, generalmente llamamos a esta función un método de este objeto. Cuando se llama a este método, esto apunta al objeto al que pertenece el método.
La copia del código es la siguiente:
<script type = "text/javaScript">
Var People = {
Nombre: "Yika",
sayname: function () {
console.log (this.name); // "Yika"
// Esto ha estado vinculado al objeto de la gente
}
}
People.sayName ();
</script>
Como se muestra en Chestnut, esto apunta al objeto SayName. Este método para obtener el contexto del objeto a través de este es un método público. (Método Publice)
Modo de llamada de función
Cuando se llama a una función no es un método en un objeto, se llama como una función.
Esta llamada de patrón apuntará al objeto de la ventana, incluso si esta función puede llamarse en una función externa, veamoslo.
La copia del código es la siguiente:
<script type = "text/javaScript">
var name = "window-yika";
Var People = {
Nombre: "People-Yika",
estudiante: function () {
console.log (esto); // Esto une al objeto gente aquí
función dice name () {
var name = "sayname-yika";
console.log (this.name); // Window-Yika
// Incluso si la función SayName en sí misma y el objeto People se encuentra tiene valor de nombre, esto apunta a la ventana
};
SayName ();
}
}
People.student ();
</script>
Desde esta perspectiva, ¿sabe cómo resolver el "error de diseño" de JavaScript?
Sí, solo almacena en caché esto en la función del estudiante, es decir, línea 6. ¡Luego transfiera esto a la función SayName a través de las variables para resolverlo!
La copia del código es la siguiente:
Var People = {
Nombre: "People-Yika",
estudiante: function () {
var self = this; // caché esto
función dice name () {
var name = "sayname-yika";
console.log (self.name); // "People-Yika", en este momento, señala el objeto de la gente
};
SayName ();
}
}
Modo de llamada de constructor
Cuando JavaScript habla sobre constructores, pensará: "¡El nombre de la función está capitalizado! ¡Use el nuevo operador al llamar!" La capitalización del nombre de la función es fácil de entender, para estandarizar el nombre del constructor. Pero, ¿alguna vez ha profundizado por qué necesita usar nuevo? Si llama a una nueva función con nuevo, el fondo de la función creará un nuevo objeto que apunta al prototipo de funciones, y esto también está vinculado al nuevo objeto. JavaScript es un lenguaje basado en la herencia prototipo. Los estudiantes que no son muy claros sobre los prototipos prototipo pueden verificar la información por sí mismos. Me concentro en esto.
Primero veamos cómo se ve el constructor generalmente.
La copia del código es la siguiente:
<script type = "text/javaScript">
Función People (nombre) {
this.name = name; // Esto aquí apunta al nuevo objeto yika después de llamarlo con nuevo
this.sayName = function () {
console.log (this.name); //Producción
}
}
var yika = gente nueva ("yika");
Yika.sayname (); // Salida "Yika" Debido a que Yika se obtiene a través de una nueva llamada, esto está vinculado al objeto Yika.
</script>
A primera vista, parece que no es fácil de entender. ¿Por qué este punto a la ventana de la función en la función ahora, y ahora puede señalar la función de las personas sin caché?
No importa. ¿No acabas de decir que la función hará "hacer cosas malas" en secreto llamando a nuevo? Veamos qué hiciste exactamente.
La copia del código es la siguiente:
<script type = "text/javaScript">
Función People (nombre) {
var that = {}; // lo malo uno: generar un objeto usted mismo
que.name = nombre;
que.sayname = function () {
console.log (that.name);
};
devolver eso; // lo malo 2, cambiarás el comportamiento de la devolución, devolverás el objeto que acaba de generar
}
var yika = personas ("yika"); // Nuevo se puede omitir aquí e imitar la llamada al nuevo operador
Yika.sayname (); // Salida "yika" como ahora
</script>
Puedes ver claramente de esta manera. Nuevo no solo generará un objeto, sino que también devolverá automáticamente el objeto, de modo que esto naturalmente apuntará a este nuevo objeto.
Recuerde usar nuevo para llamar al constructor, de lo contrario no habrá advertencia si algo sale mal, y todos los acuerdos de capital aún son muy necesarios.
Aplicar el modo de llamada
El método de aplicación nos permite construir una matriz de parámetros pasados a la función de llamada, lo que también nos permite cambiar este valor.
function.apply (este valor unido, matriz de parámetros de argumentos)
Hay tantas cosas que puedo decir, solo te daré una castaña aquí para ayudarte a comprender:
La copia del código es la siguiente:
<script type = "text/javaScript">
Función People (nombre) {
this.name = name;
this.sayName = function () {
console.log (this.name); // El método SayName pertenece al constructor de personas
}
}
Function Student (nombre) {
People.apply (esto, argumentos); // El método de integración para tomar prestados constructores es llamar a los constructores de personas aplicando en el constructor estudiantil y cambiar este valor de las personas
// De esta manera, cada vez que se crea una instancia de estudiante, se llamará al constructor de personas
}
Var estudiante = nuevo estudiante ("yika");
student.sayName (); // Salida "Yika"
</script>
Podemos modificar fácilmente la función de este objeto de enlace a través de aplicar. Llamar similar a la aplicación también tiene el mismo efecto. Los estudiantes interesados pueden buscarlo y aprenderlo por sí mismos.
Bueno, finalmente hemos terminado de cambiar los cuatro modos de llamadas de esto. El modo de llamada de método y el modo de llamadas de constructor se utilizarán más, y será más importante. Para el modo de llamadas de funciones, debemos aprender a evitar las trampas en él.
Si hay algún error, repórtelo a tiempo y lo corregiré lo antes posible para evitar que otros engañen a otros. ¡Gracias!