1. 程式人生 > >ES6面向對象的淺理解。

ES6面向對象的淺理解。

.sh 添加屬性 con efault 面向 som fine 新人 構造

網上一些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面向對象的淺理解。