设计模式
RainsP
这个作者很懒,什么都没留下…
展开
-
前端JS单例模式
单例模式优点:节约资源,控制入口缺点:拓展困难,不可职责过重// 单例模式类var Single = (function(){ var instance; function init(){ return { command: function(){} } } return { getInstance: function(){ if(!instance){ ...原创 2019-01-26 16:46:17 · 184 阅读 · 0 评论 -
前端JS适配器模式
适配器模式优点:简单,提高复用性缺点:过多使用导致系统层级复杂// 旧的接口function useOldApi(){ // some code}// 适配器function adapter(){ // 适配操作 someAdapterOpration(); // some code return useOldApi();}// 旧系统使用旧接口var oldOS =...原创 2019-01-26 16:55:28 · 522 阅读 · 0 评论 -
前端JS装饰器模式
装饰器模式:在不修改类原来接口的情况下,动态的为对象添加功能优点:扩展对象更灵活,可组合缺点:增加复杂性// 原始类function Milk(){ this.price = 1;}// 加鸡蛋function addEgg(milk){ milk.price += 1;}// 加糖function addSugger(milk){ milk.price += 0.5;...原创 2019-01-26 17:11:12 · 878 阅读 · 0 评论 -
前端JS观察者模式(发布者--订阅者模式)
观察者模式优点:更加解耦,支持广播通信缺点:大量观察者,广播有性能问题举个最简单的例子:其中body是发布者,回调函数function是观察者。document.body.onclick = function(){ console.log('我是一个观察者');}document.body.addEventListener('click',function(){ console....原创 2019-01-26 17:48:06 · 1419 阅读 · 0 评论 -
前端MVC模式
由来:应用复杂性的提高,程序变得臃肿,难以分工开发。通过关注点分离改进程序组织。简单实现:index.html<!DOCTYPE html><!-- saved from url=(0046)https://coding.imweb.io/demo/p7/mvc/index.html --><html lang="en"><head>...原创 2019-01-28 17:30:45 · 1145 阅读 · 2 评论 -
前端MVVM模式
MVVM模式代表:Vue.js、Knockout.js优点:双向绑定使View和Model自动化同步缺点:不适用于简单UI界面三种模式:手动绑定,脏检查机制,数据劫持Object.defineProperty()MVVM示意图:...原创 2019-01-29 16:21:37 · 300 阅读 · 0 评论