ES6新增的class类

在学习类之前，先明确JS是什么语言。

js是一个基于面向对象设计的单线程的静态脚本语言。

面向对象（类 实例对象 继承 封装 多态）；

基于面向对象设计  本质没有继承 、类、多态等语法，按照自己的语法特征（原型），来模拟其效果；

单线程  代码只能一个业务一个业务的执行；

静态  一段代码中间一行出现错误，不能一开始就出现发现错误，要运行到错误代码才能发现错误，如果是动态语言一开始就会检测到错误；

脚本语言  又称嵌入式语言  灵活

在ES6中为了更好的把js设计成面向对象的语言的语法特征，提出了class类。

class的本质是function，类不可重复声明，类定义不会被提升，让js更像面向对象编程的语法。

类的语法

类名建议大写，在严格要求下必须大写。

声明类：class 类名{} 

匿名类： var fn=class {}

两种方法都可以创建类

<script>
    class People{
    
    }
    var fn=class{
    
    }
</script>

js没有类，是原型的思想设计的类,但是学习和使用这个技术时,心中要用类的思想学习。

类的内部可以写一个constructor方法，用这个类创建对象时就会运行构造函数；不写构造函数系统会默认有一个空的构造运行，一个类有且只有一个方法。

constructor构造方法用于初始化实例化对象。

<script>
    class People{
        constructor(a,b){
            this.a=a
            this.b=b
        }
    }
   var p=new People(1,2)
    console.log(p) //{a=1,b=2}
</script>

 类中不能直接定义变量，变量被定义在construct中，如果要在类中定义变量需要用static修饰符，变成静态属性，只要用了static变量会变成静态变量，方法会变成静态方法，这时不需要创建对象去调用，直接类名.静态方法就可调用。

可以给对象添加属性，直接在类中写属性名=属性值。

注意：静态属性和静态方法在创建的对象中不存在。

<script>
 class People{
            var f=0; //报错
            F=0;//new People所创建的对象的属性
            static c=1; //静态属性
              constructor(a,b){
            this.a=a
            this.b=b
        }
            static say(){ //静态方法
                console.log(111);
            }
    }
            console.log(People.c) //1
            People.say() //111
</script>

 在ES5中，如果我们要给函数所创建的对象的原型上加方法需要函数.prototype.方法名=function(){};

在ES6中，直接在类中写方法，就可以在原型上添加方法。new 类得到的对象的原型上就存在这个方法。

<script>
    //es5在原型上添加方法
    function fn(){
    }
    fn.prototype.add = function(){
        console.log(1)
    }
    var re=new fn()
    re.add() //1

    //es6在原型上添加方法
    class People(){
        //构造方法
        constructor(){}
        //原型方法
        add(){console.log(2)}
    }
    var p=new People()
    p.add() //2
</script>

类的继承

作用：解决代码的复用

注意点：

1、使用extends关键字实现继承

2、子类可以继承父类中所有的方法和属性

3、子类只能继承一个父类（单继承），一个父类可以有多个子类

4、子类的构造方法中必须有super()来指定调用父类的构造方法，并且位于子类构造方法中的第一行

5、子类中如果有与父类相同的方法和属性，将会优先使用子类的（覆盖）

代码演示：

<script>
            class Person {
				constructor(name) {
					this.name = name
					this.drink = function() {
						console.log(this.name + "喝水")
					}
				}
				eat() {
					console.log(this.name + "吃饭")
				}
                //写一个静态属性
				static a = "111"
			}
            //创建实例化对象
			var p1 = new Person("halon")
			var p2 = new Person("lisa")
            p1.drink() //halon喝水
			console.log(p1, p2, Person.a)
            //{name: 'halon', drink: ƒ}  {name: 'lisa', drink: ƒ}  111
            //继承Person
			class Student extends Person {
				constructor(name) {
					super(name) //让Person类的构造函数的逻辑去帮我们构建对象空间
					this.age = 20
					this.horry = "violin"
				}}
			var s1 = new Student("xiaoming")
			console.log(s1, Student.a)
            //{name: 'xiaoming', age: 20, horry: 'violin', drink: ƒ} '111'
</script>

 存在内部类的情况，内部类属于外部类的成员 必须通过“外部类.内部类”访问。