建设网站科目,广州最新通知,网页设计是干嘛的,wordpress 评论api类
之前的几个继承模式#xff0c;只使用 ECMAScript 5 的特性来模拟类似于类#xff08;class-like#xff09;的行为。不难看出#xff0c;各种策略都有自己的问题#xff0c;也有相应的妥协#xff0c;而且代码又丑又长。 为了解决这些问题#xff0c;ECMAScript 6 …类
之前的几个继承模式只使用 ECMAScript 5 的特性来模拟类似于类class-like的行为。不难看出各种策略都有自己的问题也有相应的妥协而且代码又丑又长。 为了解决这些问题ECMAScript 6 新引入的 class 关键字具有正式定义类的能力。类class是ECMAScript 中新的基础性语法糖结构因此刚开始接触时可能会不太习惯。虽然 ECMAScript 6 类表面上看起来可以支持正式的面向对象编程但实际上它背后使用的仍然是原型和构造函数的概念。
类的定义 与函数类型相似定义类也有两种主要方式类声明和类表达式。这两种方式都使用 class 关键字加大括号
// 类声明
class Person {}
// 类表达式
const Animal class {};注意类不会像变量一样提升 类的构成 包含构造函数方法、实例方法、获取函数、设置函数和静态类方法但这些都不是必需的。空的类定义照样有效。默认情况下类定义中的代码都在严格模式下执行。
// 空类定义有效
class Foo {}
// 有构造函数的类有效
class Bar { constructor() {}
}
// 有获取函数的类有效
class Baz { get myBaz() {}
}
// 有静态方法的类有效
class Qux { static myQux() {}
}类构造函数 constructor 关键字用于在类定义块内部创建类的构造函数。方法名 constructor 会告诉解释器在使用 new 操作符创建类的新实例时应该调用这个函数。构造函数的定义不是必需的不定义构造函数相当于将构造函数定义为空函数。 类构造函数与构造函数的主要区别是调用类构造函数必须使用 new 操作符。而普通构造函数如果不使用 new 调用那么就会以全局的 this通常是 window作为内部对象。调用类构造函数时如果忘了使用 new 则会抛出错误
function Person() {}
class Animal {}
// 把 window 作为 this 来构建实例
let p Person();
let a Animal();
// TypeError: class constructor Animal cannot be invoked without new把类当成特殊函数 ECMAScript 中没有正式的类这个类型。从各方面来看ECMAScript 类就是一种特殊函数。声明一个类之后通过 typeof 操作符检测类标识符表明它是一个函数
class Person {}
console.log(Person); // class Person {}
console.log(typeof Person); // function实例、原型和类成员
实例成员 每个实例都对应一个唯一的成员对象这意味着所有成员都不会在原型上共享
class Person { constructor() { // 这个例子先使用对象包装类型定义一个字符串// 为的是在下面测试两个对象的相等性this.name new String(Jack); this.sayName () console.log(this.name); this.nicknames [Jake, J-Dog] }
}
let p1 new Person(), p2 new Person();
p1.sayName(); // Jack
p2.sayName(); // Jack
console.log(p1.name p2.name); // false
console.log(p1.sayName p2.sayName); // false
console.log(p1.nicknames p2.nicknames); // false
p1.name p1.nicknames[0];
p2.name p2.nicknames[1];
p1.sayName(); // Jake
p2.sayName(); // J-Dog原型方法与访问器 为了在实例间共享方法类定义语法把在类块中定义的方法作为原型方法。
class Person { constructor() { // 添加到 this 的所有内容都会存在于不同的实例上this.locate () console.log(instance); }// 在类块中定义的所有内容都会定义在类的原型上locate() { console.log(prototype); }
}
let p new Person();
p.locate(); // instance
Person.prototype.locate(); // prototype可以把方法定义在类构造函数中或者类块中但不能在类块中给原型添加原始值或对象作为成员数据
class Person { name: Jake
}
// Uncaught SyntaxError: Unexpected token类方法等同于对象属性因此可以使用字符串、符号或计算的值作为键
const symbolKey Symbol(symbolKey);
class Person { stringKey() { console.log(invoked stringKey); } [symbolKey]() { console.log(invoked symbolKey); } [computed Key]() { console.log(invoked computedKey); }
}
let p new Person();
p.stringKey(); // invoked stringKey
p[symbolKey](); // invoked symbolKey
p.computedKey(); // invoked computedKey类定义也支持获取和设置访问器。语法与行为跟普通对象一样
class Person { set name(newName) { this.name_ newName; } get name() { return this.name_; }
}
let p new Person();
p.name Jake;
console.log(p.name); // Jake静态类方法 可以在类上定义静态方法。这些方法通常用于执行不特定于实例的操作也不要求存在类的实例。与原型成员类似静态成员每个类上只能有一个。 静态类成员在类定义中使用 static 关键字作为前缀。在静态成员中this 引用类自身。其他所有约定跟原型成员一样
class Person { constructor() { // 添加到 this 的所有内容都会存在于不同的实例上this.locate () console.log(instance, this); } // 定义在类的原型对象上locate() { console.log(prototype, this); } // 定义在类本身上static locate() { console.log(class, this); }
}
let p new Person();
p.locate(); // instance, Person {}
Person.prototype.locate(); // prototype, {constructor: ... }
Person.locate(); // class, class Person {}静态类方法非常适合作为实例工厂
class Person { constructor(age) { this.age_ age; } sayAge() { console.log(this.age_); } static create() { // 使用随机年龄创建并返回一个 Person 实例return new Person(Math.floor(Math.random()*100)); }
}
console.log(Person.create()); // Person { age_: ... }非函数原型和类成员 虽然类定义并不显式支持在原型或类上添加成员数据但在类定义外部可以手动添加
class Person { sayName() { console.log(${Person.greeting} ${this.name}); }
}
// 在类上定义数据成员
Person.greeting My name is;
// 在原型上定义数据成员
Person.prototype.name Jake;
let p new Person();
p.sayName(); // My name is Jake注意 类定义中之所以没有显式支持添加数据成员是因为在共享目标原型和类上添加可变可修改数据成员是一种反模式。一般来说对象实例应该独自拥有通过 this引用的数据。 迭代器与生成器方法 类定义语法支持在原型和类本身上定义生成器方法
class Person { // 在原型上定义生成器方法*createNicknameIterator() { yield Jack; yield Jake; yield J-Dog; } // 在类上定义生成器方法static *createJobIterator() { yield Butcher; yield Baker; yield Candlestick maker; }
}
let jobIter Person.createJobIterator();
console.log(jobIter.next().value); // Butcher
console.log(jobIter.next().value); // Baker
console.log(jobIter.next().value); // Candlestick maker
let p new Person();
let nicknameIter p.createNicknameIterator();
console.log(nicknameIter.next().value); // Jack
console.log(nicknameIter.next().value); // Jake
console.log(nicknameIter.next().value); // J-Dog因为支持生成器方法所以可以通过添加一个默认的迭代器把类实例变成可迭代对象
class Person { constructor() { this.nicknames [Jack, Jake, J-Dog]; } *[Symbol.iterator]() { yield *this.nicknames.entries(); }
}
let p new Person();
for (let [idx, nickname] of p) { console.log(nickname);
}
// Jack
// Jake
// J-Dog也可以只返回迭代器实例
class Person { constructor() { this.nicknames [Jack, Jake, J-Dog]; } [Symbol.iterator]() { return this.nicknames.entries(); }
}
let p new Person();
for (let [idx, nickname] of p) { console.log(nickname);
}
// Jack
// Jake
// J-Dog最近又有点偷懒罪过罪过下接抄继承 最近带娃徒步了几座古道古道上很少商业化这可能也是徒步古道的重要原因背上点露营餐拿上登山杖一路攀登眼睛看到的是山的原貌耳朵听到的是各种鸟的叫声美~欣赏一首 醉眠 唐庚·宋 山静似太古日长如小年。 馀花犹可醉好鸟不妨眠。 世味门常掩时光簟已变。 梦中频得句捻笔又忘筌。
