es6实现单例模式 class类静态方法

95 阅读 0 评论 63 点赞

我是靠谱客的博主稳重皮卡丘，这篇文章主要介绍es6实现单例模式 class类静态方法，现在分享给大家，希望可以做个参考。

es6的 class类又被叫做es5 构造函数的语法糖

先看看es5怎么用构造函数实现类：

复制代码

1
2
3
4
5
6
7
8
9
10
11
function Person(name, gender) {
this.name = name
this.gender = gender
}
Person.prototype.say = function() {
console.log('I am the say function inside Person')
}
let person1 = new Person('Dean', 'male')
console.log(person1.name)
person1.say()

在这里插入图片描述

再看看es6怎么实现类：

复制代码

1
2
3
4
5
6
7
8
9
10
11
12
13
class Person {
constructor(name, gender) {
this.name = name
this.gender = gender
}
say() {
console.log('I am the say function inside class Person')
}
}
let person1 = new Person('Jing', 'female')
console.log(person1.name)
person1.say()

在这里插入图片描述

我们再看一下这行代码：
在这里插入图片描述

说明es6 class类确实是es5构造函数的语法糖

接着我们看看es6如何实现单例模式

这里不得不引入一个概念，静态方法static：

静态方法static通俗的说就是只有类自己可以调用的方法，类的实例对象是不能调用类的静态方法static的

复制代码

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
class WarMachine {
constructor(name, attackValue, type) {
this.name = name
this.attackValue = attackValue
this.type = type
}
static getInstance(name, attackValue, type) {
if (!this.instance) {
this.instance = new WarMachine(name, attackValue, type)
}
return this.instance
}
}
let wm1 = WarMachine.getInstance('TropperD', 100, 'aircraft')
let wm2 = WarMachine.getInstance('StormBreaker', 199, 'submarine')
console.log(61, wm1 === wm2)
console.log('wm1', wm1)
console.log('wm2', wm2)
console.log(64, wm1 === wm2)
console.log('----------')
let wm3 = new WarMachine('oops..', 50, 'lolipop')
console.log('wm3', wm3)