Descripción general
ES6 proporciona un método de escritura que está más cerca de un lenguaje orientado a objetos (nota: JavaScript es esencialmente un lenguaje basado en objetos). La clase (clase) se introduce como una plantilla para objetos y las clases se definen mediante la palabra clave clase.
La esencia de la clase es la función.
Puede considerarse como azúcar sintáctico, que hace que la escritura de prototipos de objetos sea más clara y más parecida a la sintaxis de la programación orientada a objetos. La mayoría de sus funciones se pueden lograr con ES5. El nuevo método de escritura de clases solo hace que el método de escritura del prototipo de objeto sea más claro y más parecido a la sintaxis de la programación orientada a objetos.
Sintaxis básica de clases.
// 定义类
class Baby {
constructor(name, age) {
this.name = name;
this.age = age;
}
kill() {
return `${
this .name} like smile`
}
}
//创建对象
var bobi = new Baby("bobi", 1);
console.log(bobi);
// 调用方法
console.log(bobi.kill());
- El código anterior define una "clase" y puede ver que contiene un método constructor, que es el método constructor, y la palabra clave esta representa el objeto de instancia. En otras palabras, el constructor Baby de ES5 corresponde al método constructor de la clase Baby de ES6.
- Puede ver que además del método de construcción, la clase Baby anterior también define un método de eliminación. Tenga en cuenta que al definir el método de la clase, no necesita agregar la palabra clave función, solo ingrese la definición. Además, No agregue comas entre los métodos. Se informará un error .
Como puede ver, el editor informa directamente un error aquí. - Cabe señalar que también necesitamos usar el nuevo método para usar la clase, que es diferente de antes de ES5;
var bobi = new Baby("bobi", 1);//这里正常
var lilm = Baby("lilm", 2)// Uncaught TypeError: Class constructor Baby cannot be invoked without 'new'
Debemos prestar atención para evitar el uso de clases cuando no utilizamos el nuevo método en el proyecto
4. Otra cosa a tener en cuenta es que no debemos declarar clases repetidamente, de lo contrario se informará un error.
class MM {
}
class MM {
}
No se permiten declaraciones duplicadas
. 5. No se promoverán definiciones de clases, lo que significa que la clase debe definirse antes de acceder; de lo contrario, se informará un error.
6. Las clases no son enumerables.
for (var key in Baby) {
console.log(key); // 没有任何内容打印出来
}
método constructor
El método constructor es el método predeterminado de la clase y devuelve una referencia a la función de matriz que creó este objeto. Una clase debe tener un método constructor. Si no está definido explícitamente, se agregará un método constructor vacío de forma predeterminada.
El método constructor devuelve un objeto de instancia de forma predeterminada, pero esto se puede cambiar cuando el método constructor devuelve un tipo complejo .
// 定义类
class Baby {
constructor(name, age) {
this.name = name;
this.age = age;
// return 111; //返回Baby {name: "bobi", age: 1}
// return "asdfasd"; //返回Baby {name: "bobi", age: 1}
// return false; //返回Baby {name: "bobi", age: 1}
// return [1, 2] //返回[1,2]
// return {
// name: "111"
// } //返回{name:"111"}
return function fn() {
console.log(11);
} //返回函数
}
kill() {
return `${
this .name} like smile`
}
}
//创建对象
var bobi = new Baby("bobi", 1);
console.log(bobi);
La diferencia entre Constructor y constructor ordinario: no se puede llamar al constructor de una clase sin usar new y se informará un error. Esta es una gran diferencia con los constructores comunes, que se pueden ejecutar sin necesidad de nuevos.
Hay una demostración arriba pero no aquí;
palabra clave estática
Las clases definen métodos estáticos mediante la palabra clave estática. Los métodos estáticos no se pueden invocar en instancias de una clase, sino que se deben invocar a través de la clase misma.
class Baby {
constructor(name, age) {
this.name = name;
this.age = age;
}
kill() {
return `${
this .name} like smile`
}
static mama = "lucy"
}
//创建对象
var bobi = new Baby("bobi", 1);
console.log(Baby.mama);
console.log(bobi.mama);
Solo se puede usar cuando se llama a la clase en sí. El objeto instanciado llamado desde nuevo está subdefinido;
- Un método estático llama a otros métodos estáticos en la misma clase usando la palabra clave this.
// 定义类
class Baby {
constructor(name, age) {
this.name = name;
this.age = age;
}
kill() {
return `${
this .name} like smile`
}
static mama = "lucy";
static father = this.mama + " honey"
}
console.log(Baby.father);//lucy honey
- En métodos no estáticos, no puede utilizar directamente esta palabra clave para acceder a métodos estáticos. En su lugar, utilice el nombre de la clase para llamar;
class Baby {
constructor(name, age) {
this.name = name;
this.age = age;
console.log(Baby.mama);
console.log(this.constructor.father);
//this指向新new出来的对象 this.constructor指向类
console.log(this.constructor);
}
kill() {
return `${
this .name} like smile`
}
static mama = "lucy";
static father = this.mama + " honey"
}
var boby = new Baby("boby", 1)
Resumir
Este artículo termina aquí. Si tiene alguna adición, agréguela en el área de comentarios. Si es útil, dele me gusta ~