Comparación del constructor y la clase ES5 ES6

El rol del constructor y la clase: puede crear un objeto a través de la nueva palabra clave


La diferencia entre los dos usos básicos

Comparar artículos ES5 (método de escritura del constructor) ES6 (Cómo escribir una clase)
definición función Myobj (x) {} clase Myobj {}
Constructor función Myobj () {} constructor(){}
Propiedad pública esto.x = x constructor (x) {this.x = x}
Método público this.show = function () {} constructor () {this.show = function () {}}
Método estático Myobj.test = function () {} prueba estática = función () {}
Propiedades estáticas Myobj.staticProp = 'Propiedad estática' static staticProp = 'Propiedad estática'
Método privado Defina un método dentro de la función constructora privateMethod () {} Modularizar métodos privados
Propiedad privada Defina una variable dentro del constructor let privateProp = 'propiedad privada' #privateProp = 'Propiedades privadas'

Métodos de herencia ES5 (tres tipos)
herencia de prototipos

function Base(name) {
    
    
	this.name = name
	this.show = function(){
    
    
		console.log('show()')
	}
}
function Sub(){
    
    
	
}
Sub.prototype = new Base()

llamar a aplicar herencia de enlace

//call 继承
function Base(name) {
    
    
	this.name = name
	this.show = function(){
    
    
		console.log('show()')
	}
}
function Sub(name){
    
    
	Base.call(this,name)	
}
//或者apply继承
function Sub(name) {
    
    
	Base.apply(this,[name])// 或者 Base.apply(this,arguments)
}
//或者bind继承
function Sub(name){
    
    
	Base.bind(this,name)()
}

Herencia ES6

class Base{
    
    
	constructor(name) {
    
    //构造函数
	this.name = name
	this.show = function(){
    
    
		console.log('show()')
		}
	}
}
class Sub extends Base{
    
    
	constructor(name,color){
    
    
		super(name)//继承父类的构造函数
		this.color = color//子类新增的属性
		this.addMethod = function(){
    
    
			console.log('子类新增的方法')
		}
	}
}

Cómo definir y escribir varios métodos de atributos de ES5

function Base(name){
    
    
  this.publicProp = name//公有属性
    this.publicMethod = function(){
    
    //公有方法
        console.log('公有方法')
    }
    let privateProp = 10//私有属性
    function privateMethod() {
    
    //私有方法
        console.log('私有方法');
    }
}
Base.staticProp = '静态属性'//静态属性
Base.staticMethod = function() {
    
    //静态方法
    console.log('静态方法')
}

Cómo definir y escribir varios métodos de atributos de ES6

class Base {
    
    
	static staticProp = '静态属性'
	static staticMethod = function () {
    
    
	    console.log('静态方法', '')
	}
	constructor(name) {
    
    /* 构造函数 */
	    this.publicProp = name//公有属性
	    this.publicMethod = function () {
    
    //公有方法
	        console.log('公有方法')
	    }
	}
	callPrivate(args){
    
    
	    privateMethod.call(this,args)
	}
}
	
function privateMethod(args){
    
    
	console.log('私有方法')
}

#property significa que los métodos privados y las propiedades son solo propuestas ahora, reportaré un error cuando lo use en el editor de vscode (usando la curva para salvar el país)

Supongo que te gusta

Origin blog.csdn.net/Chennfengg222/article/details/104699296
Recomendado
Clasificación