ES5中的类

1.简单示例

function Person(){
    
    
  this.name = "lily"
}
let p = new Person()
console.log(p.name);

2.构造函数和原型链里面增加方法

原型链上的属性会被多个实例共享,构造函数不会??

function Person(str){
    
    
  this.name = "lily"
  this.sleep = function(){
    
    
    return `${
      
      this.name}在睡觉`
  }
}
let p = new Person()
console.log(p.sleep());

Person.prototype.age = 18
Person.prototype.run = function(){
    
    
  return `${
      
      this.name}在跑步`
}

console.log(p.age);
console.log(p.run());

3.给类添加静态方法

上面Person类中的那个sleep方法是实例方法,需要实例化对象才能够调用

Person.say = function(){
    
       //静态方法不需要实例化,直接通过类调用
  console.log("hello");
}

Person.say()

静态方法使用场景??

4.ES5里的继承

4.1对象冒充实现继承

对象冒充可以继承构造函数里的属性和方法,但是不能继承原型链上的属性和方法

//对象冒充实现继承
function Man(){
    
    
  Person.call(this)  //call改变this指向,让本该指向Man类的this改为指向Person的this,然后盗取这个Person的this,获取Person的属性和方法
  //call把Man的this指向Person,Person的this不能访问Person的原型链,所以Man也不能
}

let m = new Man()
console.log(m.name);
console.log(m.age);
console.log(m.sleep());

4.2原型链实现继承

原型链实现继承可以可以同时继承构造函数和原型链的属性和方法。

function Man(){
    
    
}
Man.prototype = new Person()
let m = new Man()
console.log(m.name);
console.log(m.age);
console.log(m.sleep());
console.log(m.run());

原型链实现继承的问题:
原型链实现继承,实例化子类的时候没法给父类传参

对象冒充继承实例化子类的时候可以给父类传参
function Man(str){
    
    
   Person.call(this,str)
}
let m = new Man("jicheng")
console.log(m.name);
console.log(m.sleep());

4.3原型链+构造函数的组合继承模式

第一种

function Man(str){
    
    
  Person.call(this,str)
}
Man.prototype = new Person()
let m = new Man("jicheng")
console.log(m.name);
console.log(m.age);
console.log(m.sleep());
console.log(m.run());

第二种,对象冒充已经继承了构造函数的属性和方法,所以原型链继承只需要继承父类的原型链

function Man(str){
    
    
  Person.call(this,str)
}
Man.prototype = Person.prototype
let m = new Man("jicheng")

おすすめ

転載: blog.csdn.net/qq_39706777/article/details/121000572