首页 > 编程语言 > 详细

JavaScript设计模式(biaoyansu)(2)

时间:2018-10-15 00:16:54      阅读:234      评论:0      收藏:0      [点我收藏+]

单例模式实例 (创建类模式):

 

技术分享图片

let elBalance = document.getElementById(‘balance‘)

function init () {
var a = new Division(‘.page.a‘)
var b = new Dicision(‘.page.b‘)
}

function renderBalance(){
var resource = new Resource()
elBalance.innerText = resource.balance
}

function Division (selector) {

var resource = new Resource()

this.el = document.querySelector(selector)
this.elAdd = this.el.querySelector(‘.add‘)
this.elAdd = this.el.querySelector(‘.sub‘)
this.elInput = this.el.querySelector(‘input‘)
let me = this

this.elAdd.addEventListener(‘click‘, function () {
resource.add(me.elInput.value)
me.elInput.value = ‘‘
renderBalance()
})

this.elSub.addEventListener(‘click‘, function () {
resource.sub(me.elInput.value)
renderBalance()
})
}

function Resource () {
if (Resource.instance) {
return Resource.instance
}
else {
this.balance = 100
Resource.instance = this
}
}

Resource.prototype.add = function (num) {
this.change(num)
}

Resource.prototype.sub = function (num) {
this.change(-num)
}

Resource.prototype.change = function () {
if (!num) return
this.balance += parseFloat(num)
}
 
 
 
 

 

JavaScript设计模式(biaoyansu)(2)

原文:https://www.cnblogs.com/eret9616/p/9788884.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!