javascript高级程序阅读收获(8.4.3)——实例、原型和类成员
2021/7/19 22:05:26
本文主要是介绍javascript高级程序阅读收获(8.4.3)——实例、原型和类成员,对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!
1.实例成员
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(); p2.sayName(); 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();//Jack p2.sayName();//J-Dog
- 在构造函数内部,可以为新创建的实例添加“自有属性”。
- 构造函数执行完毕后,仍然可以给实例继续添加新成员。
- 每个实例都对应一个唯一的成员对象,这意味着所有成员都不会在原型上共享。
2.原型方法与访问器
class Person{ constructor(){ this.locate = () => console.log('instance'); } locate(){ console.log('prototype'); } } let p = new Person(); p.locate();//instance p.prototype.locate();//prototype
- 添加到this中的内容会存在于不同的实例上。
- 在类中定义的所有内容都会定义在类的原型上。
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
- 类定义也支持获取和设置访问器,语法与行为跟普通对象一样。
3.静态类方法
class Person{ constructor(){ 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 {locate: ƒ} Person.prototype.locate();//prototype {constructor: ƒ, locate: ƒ} Person.locate();//class class Person{……}
- 静态类成员在类定义中使用static关键字作为前缀。在静态成员中,this引用类自身。其他所有约定跟原型成员一样。
4.非函数原型和类成员
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引用的数据。
5.迭代器与生成器方法
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);//Jack console.log(jobIter.next().value);//Jake console.log(jobIter.next().value);//J-Dog let p = new Person(); let nicknameIter = p.createNicknameIterator(); console.log(nicknameIter.next().value);//Butcher console.log(nicknameIter.next().value);//Baker console.log(nicknameIter.next().value);//Candlestick maker
- 类定义语法支持在原型和类本身上定义生成器方法。
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
- 可以通过添加一个默认的迭代器,把类实例变成可迭代对象。
这篇关于javascript高级程序阅读收获(8.4.3)——实例、原型和类成员的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!
- 2024-11-16Maven资料入门指南
- 2024-11-16Maven资料入门教程
- 2024-11-16MyBatis Plus资料:新手入门教程与实践指南
- 2024-11-16MyBatis-Plus资料入门教程:快速上手指南
- 2024-11-16Mybatis资料入门教程:新手必看指南
- 2024-11-16MyBatis资料详解:新手入门与初级实战指南
- 2024-11-16MyBatisPlus资料:初学者入门指南与实用教程
- 2024-11-16MybatisPlus资料详解:初学者入门指南
- 2024-11-16MyBatisX资料:新手入门与初级教程
- 2024-11-16RESTful接口资料详解:新手入门指南