Discusión sobre objetos JavaScript

Autor：Eve Cole Fecha de actualización：2009-12-12 13:57:32

Debido a la flexibilidad de JavaScript, todos pueden escribir código según sus propios hábitos. Existen métodos de programación funcional y también hay literales de objetos que se utilizan ampliamente en la actualidad. Debido a la aparición de la programación funcional orientada a objetos, JavaScript simplemente. comenzó también ha evolucionado gradualmente hacia la programación de clase. Ahora explicaré brevemente varios hábitos de programación familiares:

1. Objeto literal:

El siguiente es el contenido citado:

var persona = {
nombre: nulo,
setName:función(nombre){
this.nombre = nombre;
devolver este.nombre;
},
getNombre:función(){
alerta(este.nombre);
}
}

Un método de programación con características de JavaScript. Contiene el nombre del atributo, los métodos setName y getName en unidades de clase. Es relativamente sencillo llamar al método person.setname('R'). Los atributos y métodos de la persona no son privados, se pueden llamar.

2.Modo de llamada del constructor de prototipos

El siguiente es el contenido citado:

var Persona = función(){
este.nombre = nulo;
}
Persona.prototipo.setName = función(nombre){
this.nombre = nombre;
}
Persona.prototipo.getName = función(){
alerta(este.nombre);
}

También es un método de programación muy común crear una clase Persona y luego usar un prototipo para extender la clase y agregar métodos. La mayor diferencia con los objetos literales es que al llamar a métodos de esta clase, primero debe usar nuevos (similar a Java). llamando a clases). var p = new Person();p.getName(); Si lo crea directamente sin usar new, se producirá un error y este error no se informará y es difícil de encontrar. proviene de esto que apunta a Person.prototypel, y Person no tiene un método setName.

3. Utilice funciones anónimas para la programación funcional.

El siguiente es el contenido citado:

(función(){
nombre de la variable;

var setName = función(n){
nombre = n;
}
ventana['persona']['establecerNombre'] = establecerNombre;

var getNombre = función(){
alerta(nombre);
}
ventana['persona']['getName'] = getName;
})()

Uno de los mayores beneficios de la aparición de clases es que reduce la aparición de variables globales, pero si todavía está acostumbrado a la programación funcional, no importa, siempre que cree una función anónima y realice un cierre. realice programación funcional en él. No es necesario preocuparse por la apariencia de las variables globales. Como puede ver arriba, el nombre var no se puede llamar fuera de la función anónima. Luego, use variables externas para llamar a funciones internas o variables. crear variables privadas y métodos privados.

4. Programación de clases (no sé cómo llamarla)

El siguiente es el contenido citado:

var persona = función(){
nombre var = nulo;
devolver{
establecerNombre:función(n){
nombre = n;
},
getNombre:función(){
alerta(nombre);
}
}
}

Es muy similar a los literales de objetos, excepto que esto se deja de lado y los métodos y propiedades se pueden hacer privados. Llamar a métodos es básicamente lo mismo que los literales de objetos.

5.Cadena de métodos

El siguiente es el contenido citado:

var Persona = función(){
este.nombre = nulo;
}
Persona.prototipo = {
setName:función(nombre){
this.nombre = nombre;
devolver esto;
},
getNombre:función(){
alerta(este.nombre);
devolver esto;
}
}

jQuery es la biblioteca de encadenamiento de métodos más clásica. Si aún no entiendes qué es el encadenamiento de métodos, mira este ejemplo:

El siguiente es el contenido citado:

var p = nueva Persona();
p.setName('Tom').getName().setName('Ray').getName();

Dado que cada método termina con return this; se crea una clase encadenada de métodos.

Estos son los métodos con los que estoy más familiarizado. Cada uno tiene sus propias características, por lo que existen infinitos métodos. Sin embargo, me gustaría explorar los siguientes temas:

1. Acerca de este puntero

Esto se usa al crear múltiples categorías, pero ¿cuál es su función? De hecho, esto juega un papel importante en la reutilización y la herencia. Primero veamos un ejemplo de herencia:
Primero crea la clase Persona:

El siguiente es el contenido citado:

Luego cree una clase Children e integre todos los métodos y propiedades de Person:

El siguiente es el contenido citado:

var Niños = función(edad){
este.nombre = nulo;
this.age = edad;
}
Children.prototype = new Person(); //Hereda las propiedades y métodos de Person
Children.prototype.ageJudge = function(){ //También agrega un nuevo método para Niños
si(esta.edad > 18){
alerta('adulto~');
} demás {
alert('Menores de 18 años~');
}
}
Children.prototype.getName = function(){ //Anula el método getName
var acerca de = este.nombre + ' ' + esta.edad;
alerta(acerca de);
}
var tom = nuevos Niños(12);
var edades = tom.getAge(); //12
var juez = tom.ageJudge(); //Menores de 18 años~
var setN = tom.setName('Tom');
var get = tom.getName(); //Tom 12

Esto es herencia, y luego veremos una reutilización de funciones simple:

El siguiente es el contenido citado:

var SetColor = función(){
this.style.backgroundColor = '#000'; //esto apunta a la ventana
}
document.body.onclick = SetColor; //Esto apunta al cuerpo en este momento
documnet.getElementById('color').onmouseout = SetColor; //esto apunta a documnet.getElementById('color')

Después de ver la función de esto, debo tener una nueva comprensión de esto. Ahora tengo una pregunta, es decir, si esto debería usarse o no, veamos un ejemplo simple:

var establecerColor = {
inicio:función(obj){
this.obj = obj; //esto apunta a setColor
this.obj.onclick = este.color;
},
color:función(){
this.style.backgroundColor = '#000'; //esto apunta a obj
}
}

En solo una clase, esto apunta a dos lugares, lo que a veces confunde a las personas que recién están aprendiendo y cambiará ligeramente la forma de escribir código.

El siguiente es el contenido citado:

De esta manera, el código puede ser más claro. Por lo tanto, al escribir código, debe considerar su uso futuro y si se puede reutilizar. Si está claro que no se debe heredar o reutilizar, personalmente creo que debería hacerlo. Evite usar esto tanto como sea posible. Hay otro problema más común que es el siguiente.

El siguiente es el contenido citado:

var Persona = función(){
este.nombre = nulo;
}
Persona.prototipo.setName = función(nombre){
this.nombre = nombre;
}
Person.setName('tom'); // Manera incorrecta: esto en el método setName apuntará a Person.prototypel, Person no tiene un método setName

Como se mencionó anteriormente, si no está escrito como var p = new Person();p.setName('tom'); esto en esta clase apuntará directamente a Person.prototypel. Este error no ocurrirá durante la compilación o el tiempo de ejecución. Se informará un error. A veces causará dolores de cabeza. Por eso, cuando escribo código, siempre elijo esto con cuidado.

2. Encapsulación de clases

En Java, los métodos o propiedades de una clase se pueden configurar como privados, para evitar llamadas externas, pero JavaScript no tiene dicha configuración. Mire el siguiente código:.

El siguiente es el contenido citado:

var persona = {
nombre: nulo,
init:función(nombre){
this.setName(nombre);
},
setName:función(nombre){
this.nombre = nombre;
devolver este.nombre;
}
}
persona.init('tom'); //tom

En esta clase, hay un total de 2 métodos, a saber, init y setName, y solo queremos ejecutar setName desde init, o varios métodos que se le agregarán en el futuro y no queremos que aparezcan:

persona.setName('tom'); //tom

Llame al método setName directamente. Para ser precisos, desea que el método setName sea privado y que el atributo de nombre sea privado. Esto evita que otros programadores llamen a métodos que no desea que sean llamados cuando usan su clase.
Entonces, ¿cómo deberíamos encapsular bien las clases? Pruebe otro método de programación y vea cómo va la versión revisada:

El siguiente es el contenido citado:

var persona = función(){
nombre var = nulo;
var setName = función(n){
nombre = n;
nombre de retorno;
}
devolver{
inicio:función(n){
establecerNombre(n);
}
}
}

De esta manera, los métodos y propiedades que originalmente estaban destinados a ser privatizados se pueden privatizar y no se pueden llamar directamente desde el exterior. Sin embargo, este método de programación no es fácil de leer, especialmente para los principiantes. Será muy difícil ver este tipo de código y además ocupará más memoria que los normales.
Bien, eso es todo por ahora, hablaré sobre cierres y alcance la próxima vez que tenga tiempo.