类

在ES6之前通过构造函数+原型实现面向对象编程

构造函数主要有以下四点
1.构造函数有原型对象prototype
2.构造函数原型对象prototype 里面有 constructor 指向构造函数本身
3.构造函数可以通过原型对象添加方法
4.构造函数创建的实例对象有__proto__原型指向 构造函数的原型对象

ES6 通过 类 实现面向对象编程

class Star { } 
console.log(typeof Star); // function
// 说明类的本质其实还是一个函数，我们也可以简单的认为 类就是 构造函数的另外一种写法
console.log(Star.prototype) // 1.类有原型对象
console.log(Star.prototype.constructor) //2.类原型对象prototype 里面有constructor 指向 类本身
Star.prototype.sing = function() {
  console.log(‘冰雨’)
  }
var ldh = new Star()
console.dir(ldh) // 3.类可以通过原型对象添加方法
console.log(ldh.__proto__=== Star.prototype) // true // 4.类创建的实例对象有__proto__原型 指向类的原型对象

所以es6的类，它的绝大部分功能，es5都能实现，class写法只是让对象原型的写法更加清晰，更像面向对象编程的语法而已
类其实就是语法糖
语法糖:语法糖就是一种便捷写法，简单理解，有两种方法可以实现同样的功能，但是一种写法更加清晰，方便，那么这个方法就是语法糖

创建类

语法：

class 类名 {
}
创建实例:
var xx = new 类名()

注意：类必须使用 new 实例化对象

类constructor构造函数

constructor()方法是类的构造函数（默认方法），用于传递参数，返回实例对象（我们就可以不用return了），通过new命令生成对象实例时，自动调用该方法，如果没有显示定义，类内部会自动给我们创建一个constructor()

// 1.先创建一个类
class Star {
  constructor(uname) {
       this.uname = uname
      }
   }
  
// 2.利用类创建对象 new
var ldh = new Star(‘刘德华’)
console.log(ldh.uname) // 刘德华

使用类要注意一下几点

1.通过class关键字创建类，类名我们还是习惯性定义首字母大写
2.类里面有个constructor函数，可以接受传递过来参数，同时返回实例对象
3.constructor函数 只要 new 生成实例时，就会自动调用这个函数，如果我们不写这个函数，类也会自动生成这个函数
4.生成实例 new 不能省略
5.最后注意语法规范，创建类 类名后面不加小括号，生成实例 类名后面加小括号，构造函数不需要加function

类添加方法

class Person {
      constructor(name, age) {
           this.name = name;
           this.age = age;
}
say () {  // 添加say 方法，不需要写function，多个函数之间不需要添加逗号分割
  console.log(this.name + ‘你好’);
}
}
ldh.say()

类的继承

// 使用extends关键字可以继承父类
class Father {
     constructor() { }
     money() {
      console.log(100);
      }
   }
class Son extends Father { // 子类继承父类
  }
var son = new Son();
son.money(); // 100

super关键字

子类想向父类里面传递参数可以使用super关键字

// super 关键字用于访问和调用对象父类上的函数，可以调用父类的构造函数和普通函数
class Father {
     constructor(x, y) { 
              this.x=x
              this.y=y
            }
     sum() {
      console.log(this.x+this,y);
}
}
class Son extends Father {
     constructor(x, y) {
        // this.x = x;  this y= y // 报错，这里的this指向的是son的constructor的实例，父类里面没有得到，这两个值，
         super(x,y) // 调用了父类中的构造函数
       }
     }
var son = new Son(1, 2);
son.sum(); // 3
// 使用super还得注意
// super必须在子类this之前调用
class Father {
     constructor(x, y) { 
              this.x=x
              this.y=y
            }
     sum() {
      console.log(this.x+this,y);
}
}
class Son extends Father {
     constructor(x, y) {
        super(x,y) // 调用了父类中的构造函数，必须在子类this之前调用
        this.x=x
        this.y=y
}
subttract() { // 定义子类独有的属性
    console.log(this.x - this.y) 
        }
var son = new Son(5, 2);
son.subtract() // 3
son.sum(); // 7

super调用父类的普通函数

class Father {
      say() {
       return '我是爸爸'
       }
class Son extends Father {
        say () {
        reurn super.say() + '的儿子'  // super 调用父类的方法
        }
    }
var  demo  =  new Son()
console.log(demo.say()) // 我是爸爸的儿子

继承中属性或者方法的查找原则（就近原则）

继承中，如果实例化子类输出一个方法，先看子类有没有这个方法，如果有就先执行子类的
如果子类里面没有，就去查找父类有没有这个方法，如果有，就执行父类的这个方法

类的三个注意点

1.在ES6中没有变量提升，所以必须先定义类，才能通过类实例化对象
2.类里面的共有的属性和方法一定要加this使用
3.this的指向问题

• constructor 里面的this 指向的是 实例对象
• 方法里面的this 指向的是这个方法的调用者

本文地址：https://blog.csdn.net/weixin_47451403/article/details/107851114