🚀
头像

默永


人生就像骑单车,想保持平衡就得往前走。

Es6面型对象 class类

2022-03-22 15:58:29 64 💗 0 @默永

在js中,function可以看做为方法,构造函数可以看做为类

在Es6中,class(类)作为对象的模板被引用,可以通过class关键字定义;class的本质是function

Es5就支持class概念

贴点:

    1. 类声明不可以重复

    2. 类必须使用new 调用,否则会报错

    3. 类中创建方法,但方法不需要function关键字,方法中的属性,每个方法间不能加逗号

    4. 类定义不会被提升,必须在访问前对类进行定义,否则就会报错

class 类声明

class Person {  //定义了一个名字为Person的类
    constructor(name, age) {    //constructor是一个构造方法,用来接收参数
        this.name = name;   //this代表的是实例对象
        this.age = age;
    }
    say() { //这是一个类的方法,注意千万不要加上function
        return "我的名字叫" + this.name + "今年" + this.age + "岁了";
    }
}
const person = new Person("默永", 20);
console.log(person.name, person.age);   //默永 20
console.log(person.sayName());  //我的名字叫默永今年20岁了

class 继承

class Person {
    constructor(name) {
        this.name = name
    }
    sayName() {
        return "我的名字叫" + this.name + "今年" + this.age + "岁了";
    }
}
// 关键字extends继承
class Son extends Person {
    constructor(name, age) {
        super(name)
        this.age = age
    }
    // 静态方法static
    // 如果一个方法前加上static关键字,就表示是静态方法
    // 静态方法不能被实例调用(在该类之外调用)
    // 用类Son调用静态方法likedog
    static nameAge() {
        return 'static';
    }
}
const son = new Son("默永", 20);
console.log(son.name, son.age); //默永 20
console.log(son.sayName());  //我的名字叫默永今年20岁了
// 用类Son调用静态方法nameAge
console.log(Son.nameAge()); //static

constructor方法如果没有显式定义,会隐式生成一个constructor方法。所以即使你没有添加构造函数,构造函数也是存在的。constructor方法默认返回实例对象this,但是也可以指定constructor方法返回一个全新的对象,让返回的实例对象不是该类的实例。

class Desk{
    constructor(){
        this.xixi="我是一只小小小小鸟!哦";
    }
}
class Box{
    constructor(){
       return new Desk();// 这里没有用this哦,直接返回一个全新的对象
    }
}
var obj=new Box();
console.log(obj.xixi);//我是一只小小小小鸟!哦

构造函数

构造函数

    目录导航