标签：targe stat init 构造 form 创建 tar object val
静态属性与静态方法
1. 不会被类实例所拥有的属性与方法 只是类自身拥有
2. 只能通过类调用
静态方法与普通方法重名，不会冲突
static 关键字（静态方法）
静态属性
类名.属性名 = 属性值;
静态属性应用举例：
//职业类 class Profession{ } class Character { constructor(pfs) { this.pfs = pfs; } } // 静态属性做配置 Character.config = { profession: { ‘咒术师‘: 1, ‘弓箭手‘: 2 } } // 创建类的实例 new Character(Character.config.profession[‘咒术师‘]);
静态方法应用举例
class Person { // 静态方法 static format(programmer) { programmer.haveGirlFriend = true; programmer.hair = true; } } // 程序员类 class Programmer { constructor() { this.haveGirlFriend = false; this.hair = false; } } // 将程序员类的实例转为了普通类 const programmer = new Programmer(); Person.format(programmer); console.log(programmer);
类的表达式
P只能在类的内部被访问到
就是类的自身
const Person = class P { constructor() { P.a = 1; console.log(P===Person); console.log(‘我是鸽手!!咕咕咕!!‘); } } new Person(); // 自动执行 const Person1 = new class P { constructor() { P.a = 1; console.log(‘我是鸽手!!咕咕咕!!‘); } }();
getter setter
类似于给属性提供钩子
在获取属性值和设置属性值的时候做一些额外的事情
ES5 getter/setter
1. 在对象字面量中书写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(‘正在访问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 类名
class Humen { } console.log(Humen.name);//Humen const Humen = class P{ } console.log(Humen.name);//P
new.target 指向new关键字后面的类
class Car { constructor() { console.log(new.target); } } new Car();
语法糖
function Car() { if (!(this instanceof Car)) { throw Error(‘必须使用new关键字调用Car‘); } } new Car();
在es5中模拟类：
构造函数
1. 创建一个空的对象
2. 把构造函数的prototype属性 作为空对象的原型
3. this赋值为这个空对象
4. 执行函数
5. 如果函数没有返回值 则返回this[返回之前那个空对象]
function Person(name, age) { this.name = name; this.age = age; } console.log(new Person(‘张三‘, 11));
function Constructor(fn, args) { // 创建的对象以fn作为原型 var _this = Object.create(fn.prototype); // 执行函数并传递参数 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);
标签：targe stat init 构造 form 创建 tar object val
原文地址：https://www.cnblogs.com/chenyingying0/p/12164093.html
