ES6面向对象新特性

ES5之前类的继承是靠原型实现的,而这一过程的实现又涉及到一大堆的原型定义,而SE6为了使得javascript的类继承像java之类的语言一样更加简单纯粹,也推出了class这个定义类的关键字,虽然失去了一点灵活性,但是代码变得更加简单了。

像其他语言一样,SE6用关键字class定义一个类,该类有一个名为constructor()的函数,SE6的类必须有这个函数,如果没设就会默认添加一个,类似于java的构造方法,这个函数中的this指向生成的实例。

ES6
书写格式:
class 类名{
    constructor(...接收实例化时传的实参){
        this.XXX = 形参
    }
    方法名(){函数体}
}
class Person {//语法糖
    constructor(name, age, gender, money) {//构造器
        this.name = name;
        this.age = age;
        this.gender = gender;
        this.money = money;
    }
    say(){
        console.log(`我的姓名是${this.name},我有${this.money}元`);
    }
}
let gf = new Person("z3",28,"female",1000000);
gf.say();//我的姓名是z3,我有1000000元

类的typeof是Function(原因是类就是构造函数)
1、class声明的类,具有暂时性死区,必须先声明再使用
2、class声明的类,不能当做普通函数调用(即必须加new)
3、class声明的类,手动更改返回值(引用值有效,其他类无效)

类中的函数,直接挂载到类的原型上
类的原型添加属性:类.prototype.属性名 = 属性值
注:优化性能的考虑,不要放在construcor

给类添加静态方法
书写格式:
static属性名
static price = “40000”;
static方法名
static say() = function(){}
只可以类来使用,实例无法使用

class Elec {
    constructor(name){
        this.name = name;
    }
    static price = "40000";
    static sale() {
        console.log(`原价:${this.price},折后${this.price*0.75}`);
    }
}
Elec.sale();//原价:40000,折后30000
console.log(Elec.price);//40000

原型上不能定义属性,只能定义get(取值器)和set(设值器),取值器和设值器都是在原型上的

class Animal{
	constructor(color){
		this.color = color;
	};
	get _color(){
		return this.color;
	}
	set _color(value){
		return this.color = value;
	}
}
var am = new Animal();
am._color = 'red';
console.log(am._color);//red
console.log(am.color);//red

定义属性在constructor内部,通过继承得到原型的属性和方法
B类 extends A类,代表A类中所有的方法和属性B类可以使用
super与extends配套使用,super是方法,参数是B类的形参或者变量或值
注:super必写放在B类的constructor的第一行

class Vehicle {
    constructor(name,eng,price){
        this.name = name;
        this.eng = eng;
        this.price = price;
    }
    didi(){
        console.log("didiid");
    }
}
class Car extends Vehicle {
    constructor(name,eng,price,diver){
        // super只能放在constructor的第一行
        super(name,eng,price);
        this.diver = diver;
    }
    dive() {
        if(this.diver){
            console.log(`找代驾`);
        }
    }
}
class Bus extends Vehicle {
    constructor(name,eng,price,pass){
        super(name,eng,price);
        this.pass = pass;
    }
}
let car1 = new Car("BMW","123",4000);
let bus1 = new Bus("BYD","公交",40000,40);
console.log(car1.name); //BMW
car1.didi(); //didiid
console.log(bus1.name,bus1.price);//BYD 40000
上一篇:AP计算机A自学笔记:方法类型


下一篇:3、class类