ES6新特性--Class类

1. Class类概述

ES6 提供了更接近传统语言的写法，引入了 Class（类）这个概念，作为对 象的模板。通过 class 关键字，可以定义类。基本上，ES6 的 class 可以看作只是 一个语法糖，它的绝大部分功能，ES5 都可以做到，新的 class 写法只是让对象 原型的写法更加清晰、更像面向对象编程的语法而已。

1. ES5中的对象创建/ES6中的对象创建

//创建学生对象
function stu(name,age){
  this.name = name;
  this.age = age;
}
            
//添加方法
stu.prototype.study = function(){
   console.log("学生爱学习！")
}
            
//实例化对象
let xiaoming = new stu("小明",12);
//调用方法
xiaoming.study();
            
console.log(xiaoming)

class stu{
   //构造方法是固定写法，就直接写:constructor
   constructor(name,age) {
          this.name = name;
          this.age = age;
    }
                
   //方法定义
   study(){
       console.log("学生爱学习！")
   }
 }
            
//实例化
let  xiaoming = new stu("小明",12);
xiaoming.study();
 console.log(xiaoming)

1. Class中的静态成员

//注意，静态的成员内容是属于类的，而不是属于实例化对象的

class stu{
     //定义静态的属性
     static name = '张三';
     static study(){
       console.log("学生是要学习的！")
     }
}
            
//实例化对象
let xiaoming = new stu();
            
//调用测试
console.log(xiaoming.name);//undifined
console.log(stu.name);//张三

1. ES5中的构造函数继承

       //定义父级对象
        function stu(name,age){
            this.name = name;
            this.age = age;
        }
        
        //设置父类级别构造函数的原型
        stu.prototype.call = function(){
            console.log("学生就是需要多学习！")
        }
        
        //定义子类级别的对象
        function cmpStu(name,age,major,school){
            //引用父类构造(继承)
            stu.call(this,name,age);
            this.major = major;
            this.school = school;
        }
        
        //设置子类级别的构造函数原型
        cmpStu.prototype = new stu;
        cmpStu.prototype.constructor = cmpStu;//矫正
        
        //声明子类的方法
        cmpStu.prototype.playGame = function(){
            console.log("我游戏打得好！")
        }
        
        cmpStu.prototype.playBasketball = function(){
            console.log("我篮球打得好")
        }
        
        //实例化
        const zsan = new cmpStu("张三",12,"计算机应用技术","电科大")
        console.log(zsan)

1. 使用Class实现类的继承

       //父类声明
        class stu{
            constructor(name,age) {
                this.name = name;
                this.age = age;
            }
            
            //定义父类的成员属性
            study(){
                console.log("学生要学习!")
            }
        }
        
        //定义子类
        class cmpStu extends stu{
            //定义构造方法
            constructor(name,age,major,school) {
                super(name,age);//stu.call(this,name,age)
                this.major = major;
                this.school = school;
            }
            
            //定义特有的方法
            playCame(){
                console.log("学生游戏打得好!");
            }
            
            playBasketball(){
                console.log("学生篮球打得好!");
            }
        }
        
        //实例化
        const zsan = new cmpStu('张三',12,'计算机应用技术','电科大');
        console.log(zsan);
        //调用定义的方法
        zsan.playCame();
        zsan.study();

1. 使用Class实现类的继承中子类重写父类方法

//注意子类不能够直接调用父类的同名方法

       //父类声明
        class stu{
            constructor(name,age) {
                this.name = name;
                this.age = age;
            }
            
            //定义父类的成员属性
            study(){
                console.log("学生要学习!")
            }
        }
        
        //定义子类
        class cmpStu extends stu{
            //定义构造方法
            constructor(name,age,major,school) {
                super(name,age);//stu.call(this,name,age)
                this.major = major;
                this.school = school;
            }
            
            //重写父类方法
            study(){
                console.log("学生要好好的学习")
            }
            
        }
        
        //实例化
        const zsan = new cmpStu('张三',12,'计算机应用技术','电科大');
        console.log(zsan);
        //调用定义的方法
        zsan.study();

1. Class中的getXXX和SetXXX方法

       //get/set方法的设置
        class stu{
            get name(){
                console.log("名字被获取了")
                return 'setName'
            }
            
            set name(s_name){
                console.log("名字被设置了")
            }
        }
        
        //实例化
        let s = new stu();
        
        //设置名字
        s.name = '张三';
        console.log(s.name);