靜態(tài)屬性與靜態(tài)方法
1. 不會(huì)被類實(shí)例所擁有的屬性與方法 只是類自身?yè)碛?br>2. 只能通過(guò)類調(diào)用
靜態(tài)方法與普通方法重名，不會(huì)沖突
static 關(guān)鍵字（靜態(tài)方法）
靜態(tài)屬性
類名.屬性名 = 屬性值;
1、靜態(tài)屬性的聲明，應(yīng)該在類外部，使用“類名.屬性名”的方式聲明。
2、靜態(tài)方法的調(diào)用，應(yīng)該直接在類上調(diào)用，而不是在類的實(shí)例上調(diào)用。
靜態(tài)屬性應(yīng)用舉例：
//職業(yè)類 class Profession{ } class Character { constructor(pfs) { this.pfs = pfs; } } // 靜態(tài)屬性做配置 Character.config = { profession: { '咒術(shù)師': 1, '弓箭手': 2 } } // 創(chuàng)建類的實(shí)例 new Character(Character.config.profession['咒術(shù)師']);
靜態(tài)方法應(yīng)用舉例
class Person { // 靜態(tài)方法 static format(programmer) { programmer.haveGirlFriend = true; programmer.hair = true; } } // 程序員類 class Programmer { constructor() { this.haveGirlFriend = false; this.hair = false; } } // 將程序員類的實(shí)例轉(zhuǎn)為了普通類 const programmer = new Programmer(); Person.format(programmer); console.log(programmer);
類的表達(dá)式
P只能在類的內(nèi)部被訪問(wèn)到
就是類的自身
const Person = class P { constructor() { P.a = 1; console.log(P===Person); console.log('我是鴿手!!咕咕咕!!'); } } new Person(); // 自動(dòng)執(zhí)行 const Person1 = new class P { constructor() { P.a = 1; console.log('我是鴿手!!咕咕咕!!'); } }();
getter setter
類似于給屬性提供鉤子
在獲取屬性值和設(shè)置屬性值的時(shí)候做一些額外的事情
ES5 getter/setter
1. 在對(duì)象字面量中書寫get/set方法
const obj = { _name: '', get name() { console.log('123'); return this._name; }, set name(val) { this._name = val; } } obj.name = 222; console.log(obj);
2. Object.defineProperty
var obj = { _name: '' }; Object.defineProperty(obj, 'name', { get: function() { console.log('正在訪問(wèn)name'); return this._name; }, set: function(val) { console.log('正在修改name'); this._name = val; } }); obj.name = 10; console.log(obj.name);
ES6寫法：
class Person { constructor() { this._name = ''; } get name() { console.log('正在訪問(wèn)name'); return `我的名字是${ this._name }`; } set name(val) { console.log('正在修改name'); this._name = val; } } const person = new Person(); person.name = '鴿王'; console.log(person.name);
class AudioPlayer { constructor() { this._status = 0; this.status = 0; this.init(); } init() { const audio = new Audio(); audio.src = '....'; audio.oncanplay = () => { audio.play(); this.status = 1; } } get status() { return this._status; } set status(val) { const STATUS_MAP = { 0: '暫停', 1: '播放', 2: '加載中' }; //改變按鈕中的文案 document.querySelector('#app .play-btn').innerText = STATUS_MAP[val]; this._status = val; } } const audio = new AudioPlayer();
name 類名
如果類表達(dá)式中，類是有名字的，name是類的名字；類沒(méi)有名字的話，會(huì)是表達(dá)式中變量或者常量的名稱
class Humen { } console.log(Humen.name);//Humen const Humen = class P{ } console.log(Humen.name);//P
new.target 指向new關(guān)鍵字后面的類
class Car { constructor() { console.log(new.target); } } new Car();
語(yǔ)法糖
function Car() { if (!(this instanceof Car)) { throw Error('必須使用new關(guān)鍵字調(diào)用Car'); } } new Car();
在es5中模擬類：
構(gòu)造函數(shù)
1. 創(chuàng)建一個(gè)空的對(duì)象
2. 把構(gòu)造函數(shù)的prototype屬性 作為空對(duì)象的原型
3. this賦值為這個(gè)空對(duì)象
4. 執(zhí)行函數(shù)
5. 如果函數(shù)沒(méi)有返回值 則返回this[返回之前那個(gè)空對(duì)象]
function Person(name, age) { this.name = name; this.age = age; } console.log(new Person('張三', 11));
function Constructor(fn, args) { // 創(chuàng)建的對(duì)象以fn作為原型 var _this = Object.create(fn.prototype); // 執(zhí)行函數(shù)并傳遞參數(shù) var res = fn.apply(_this, args); return res ? res : _this; } function Person(name, age) { this.name = name; this.age = age; } Person.prototype.say = function() { console.log('我叫' + this.name); } var person = Constructor(Person, ['張三', 12]); console.log(person);
聯(lián)系客服
