ES6 class类的理解

在传统的js里面是只有对象,没有类的概念的。

要生成一个对象实例,就需要先定义一个构造函数,通过new操作符。

function Person(name,age) {
    this.name = name;
    this.age=age;
}
Person.prototype.say = function(){
    return "我的名字叫" + this.name+"今年"+this.age+"岁了";
}
var obj=new Person("wangz",23);//通过构造函数创建对象,必须使用new 运算符
console.log(obj.say());//我的名字叫wangz今年23岁了

构造函数生成实例的过程:

  1. 当使用了构造函数,并且new 构造函数(),后台会隐式执行new Object()创建对象;
  2. 将构造函数的作用域给新对象,(即new Object()创建出的对象),而函数体内的this就代表new Object()出来的对象。
  3. 执行构造函数的代码。
  4. 返回新对象(后台直接返回);

ES6中引进了Class类的概念

注意点:

  • 在类中声明方法时,不能给该方法加上function关键字
  • 方法之间不要用逗号分隔,会报错

ES6中的类其实就是构造函数的另外一种写法,类自身就是指向构造函数。

将上文代码改为ES6的写法如下:

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

所有的类的方法都定义在类的prototype属性上面。

Person.prototype.say=function(){//定义与类中相同名字的方法。成功实现了覆盖!
    return "我是来证明的,你叫" + this.name+"今年"+this.age+"岁了";
}
var obj=new Person("wangz",23);
console.log(obj.say());//我是来证明的,你叫wagz今年23岁了

construct方法时类的构造函数的默认方法,通过new命令生成对象实例,自动调用。

class Box{
    constructor(){
        console.log("学习很开心");//当实例化对象时该行代码会执行。
    }
}
var obj=new Box();

class不存在变量提升,所以需要先定义再使用。因为ES6不会把类的声明提升到代码头部,但是ES5就不一样,ES5存在变量提升,可以先使用,然后再定义。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值