首页 > 代码库 > ES6面向对象的浅理解。
ES6面向对象的浅理解。
网上一些es6资源还是很多的在对于es6面向这块比较少,所以新人在学习的时候做了一些总结。
因本人并不资深也能看懂,直接贴代码。
class Person{ //为对象添加属性 constructor(name=‘default‘,age=0){ //给参数传默认值,防止调用时忘记传实参而报错 this.name=name; this.age=age; } //为对象添加方法 showName(){ alert(this.name); } showAge(){ alert(this.age); } sayAll(){ alert(`My name is ${this.name} My age is ${this.age} My job is ${this.job}`) } } //继承 class SomeBody extends Person{ //这里即可实现子类的继承 //继承之后,添加子类特有的属性 constructor(name,age,job){ super(name,age); //使用super()将父类的属性继承过来,同时添加子类自己的新属性。 //如果不加,这个constructor将会把从父类继承的constructor中的属性和方法覆盖,从而使子类没有继承name,age属性,而报错 this.job=job; } //继承之后,添加子类特有的方法 showJob(){ alert(this.job); } } const person1 =new Person(‘JavaScript‘,20,‘Programer‘); person1.showName(); //JavaScript person1.showAge(); //20 person1.sayAll(); //虽然sayAll方法中有提到 this.job。 但是构造函数Person参数只有name和age,也未定义job所以会弹出“My job is undefined”。 const person2=new SomeBody(‘Milo‘,18,‘monkey‘); person2.showName(); //Milo person2.showAge(); //32 person2.showJob(); //monkey person2.sayAll(); //相当于sayAll方法写入 子类 SomeBody 中 所以 this.job 不会undefined
相对于es5的面向对象,es6更易理解,刚刚接触js的同学们的福音呢。
最后欢迎大神的评论,以及发表一些指点和看法。
ES6面向对象的浅理解。
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。