# ES6 物件導向 Class 類別 在開始講class之前,先看一下之前es5的寫法: 這是一個狗的建構子,裡面可以定義名字與顏色,並且有一個playwidth的功能 ``` ES5的寫法: function Dog({name:name,color:color}){ this.name = name; this.color = color; this.playWidth = function(someone){ console.log(`${this.name}跟${someone}一起玩`) } } let dog1 = new Dog({name:'小白', color:'白色'}); ``` ### Class 在es6多了一個Class的定義,將屬性的部分定義在constrctor內,constrctor的意思就像是在創造object之前,要先把描述、藍圖定義好。 在Class內也可以定義一些methods function專門給這個Class用。 ES6的寫法: ``` Class Dog { constructor({name:name,color:color}){ this.name = name; this.color = color } playWidth(someone){ console.log(`${this.name}跟${someone}一起玩`) } } let dog = new Dog({name:'小白', color:'白色'}); ``` ### static class 只是一個藍圖,在沒有使用new關鍵字之前,就只是一個宣告與描述,用來描述要被建造的object要有什麼屬性及功能,是不能被直接使用的。 若需要單獨使用 class內的功能,就要用 static 關鍵字 在function前,就會被表示成可以直接從class被使用的function,提升成一個class級別的功能。 ``` Class Dog { constructor({name:name,color:color}){ this.name = name; this.color = color } static playWidth(someone){ console.log(`${this.name}跟${someone}一起玩`) } } Dog.playWidth('貓咪'); ``` 但一旦提升之後,就不能用當作建構子內的功能使用了。 ``` //不能這樣用 會出現 dog.playWidth is not a function let dog = new Dog(); dog.playWidth('貓咪') ```