|
靜態(tài)屬性與靜態(tài)方法 1. 不會被類實(shí)例所擁有的屬性與方法 只是類自身擁有 靜態(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á)式 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
ES5 getter/setter 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('正在訪問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('正在訪問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是類的名字；類沒有名字的話，會是表達(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(); 語法糖 function Car() { if (!(this instanceof Car)) { throw Error('必須使用new關(guān)鍵字調(diào)用Car'); } } new Car(); 在es5中模擬類： function Person(name, age) { this.name = name; this.age = age; } console.log(new Person('張三', 11)); function Constructor(fn, args) { // 創(chuàng)建的對象以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); |
|
|
