1 工厂模式

简单的工厂模式可以理解为解决多个相似的问题;

function CreatePerson(name,age,sex) {
var obj = new Object();
obj.name = name;
obj.age = age;
obj.sex = sex;
obj.sayName = function(){
return this.name;
}
return obj;
}
var p1 = new CreatePerson("longen",'28','男');
var p2 = new CreatePerson("tugenhua",'27','女');
console.log(p1.name); // longen
console.log(p1.age); //
console.log(p1.sex); // 男
console.log(p1.sayName()); // longen console.log(p2.name); // tugenhua
console.log(p2.age); //
console.log(p2.sex); // 女
console.log(p2.sayName()); // tugenhua

2单例模式

只能被实例化(构造函数给实例添加属性与方法)一次

// 单体模式
var Singleton = function(name){
this.name = name;
};
Singleton.prototype.getName = function(){
return this.name;
}
// 获取实例对象
var getInstance = (function() {
var instance = null;
return function(name) {
if(!instance) {//相当于一个一次性阀门,只能实例化一次
instance = new Singleton(name);
}
return instance;
}
})();
// 测试单体模式的实例,所以a===b
var a = getInstance("aa");
var b = getInstance("bb");

3 沙箱模式

将一些函数放到自执行函数里面,但要用闭包暴露接口,用变量接收暴露的接口,再调用里面的值,否则无法使用里面的值

let sandboxModel=(function(){
function sayName(){};
function sayAge(){};
return{
sayName:sayName,
sayAge:sayAge
}
})()

4 发布者订阅模式

就例如如我们关注了某一个公众号,然后他对应的有新的消息就会给你推送,

//发布者与订阅模式
var shoeObj = {}; // 定义发布者
shoeObj.list = []; // 缓存列表 存放订阅者回调函数 // 增加订阅者
shoeObj.listen = function(fn) {
shoeObj.list.push(fn); // 订阅消息添加到缓存列表
} // 发布消息
shoeObj.trigger = function() {
for (var i = 0, fn; fn = this.list[i++];) {
fn.apply(this, arguments);//第一个参数只是改变fn的this,
}
}
// 小红订阅如下消息
shoeObj.listen(function(color, size) {
console.log("颜色是:" + color);
console.log("尺码是:" + size);
}); // 小花订阅如下消息
shoeObj.listen(function(color, size) {
console.log("再次打印颜色是:" + color);
console.log("再次打印尺码是:" + size);
});
shoeObj.trigger("红色", 40);
shoeObj.trigger("黑色", 42);

代码实现逻辑是用数组存贮订阅者, 发布者回调函数里面通知的方式是遍历订阅者数组,并将发布者内容传入订阅者数组

更多设计模式请戳:Javascript常用的设计模式详解

JS常见的四种设计模式的更多相关文章

  1. js常见的几种设计模式

    一.单例模式 单例模式也称作为单子模式,更多的也叫做单体模式.为软件设计中较为简单但是最为常用的一种设计模式. 在JavaScript里,实现单例的方式有很多种,其中最简单的一个方式是使用对象字面量的 ...

  2. JS函数的四种调用模式

    函数在js中具有四种身份,分别为函数.方法.构造函数.apply或call调用 函数调用    函数调用模式中this指全局对象(window) var f1 = function() { alert ...

  3. 下面给出了四种设计模式的作用: 外观(F

    下面给出了四种设计模式的作用: 外观(Fa?ade :为子系统中的一组功能调用提供一个一致的接口,这个接口使得这一子系统更加容易使用: 装饰(Decorate):当不能采用生成子类的方法进行扩充时,动 ...

  4. 判断数组的方法/判断JS数据类型的四种方法

    参考文: 以下 3 个判断数组的方法,请分别介绍它们之间的区别和优劣Object.prototype.toString.call() . instanceof 以及 Array.isArray() h ...

  5. js检测数据类型四种办法

    面试题中经常会考js数据类型检测,今天我来分享一下js中常用的四种方法判断数据类型,欢迎指点更正. 废话不多说,直入正题. 1.typeof console.log(typeof "&quo ...

  6. 判断js数据类型的四种方法,以及各自的优缺点(转)

    转载地址:https://blog.csdn.net/lhjuejiang/article/details/79623973 数据类型分为基本类型和引用类型: 基本类型:String.Number.B ...

  7. HttpRequest中常见的四种Content-Type(转)

    add by zhj: Content-Type用于说明request body的编码格式的,对于没有request body的http method如GET,HEAD没有必要设置这个参数,当然,你设 ...

  8. Robot Framework--接口测试中常见的四种POST方式

    写接口测试用例时,遇到以json格式提交数据时,报错,Request如下图: Response如下图: 改成form格式提交,可以正常运行,如下图: 代码如下: ------------------- ...

  9. Android下常见的四种对话框

    摘要:在实际开发过程有时为了能够和用户进行很好的交互,需要使用到对话框,在Android中常用的对话框有四种:普通对话框.单选对话框.多选对话框.进度对话框. 一.普度对话框 public void ...

随机推荐

  1. 微信获得access-token

    微信获得access-token RestTemplate template = new RestTemplate(); String appid = "aa"; String s ...

  2. IOS6.0自带下拉刷新控件UIRefreshControl

    1.UIRefreshControl必需要在IOS6.0以后才干使用,同一时候他仅仅能在UITableViewController类中才干够使用 2.使用比較简单 self.refreshContro ...

  3. 关于oracle 11g导出数据时 报 ORA 1455错误的处理

    因为导出的该用户的表可能存在空数据表,那么可能就会出现此其异常. 首先:  查看:     SQL>show parameter deferred_segment_creation;  假设为T ...

  4. 20170322js面向对象

    <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...

  5. P1043 数字游戏

    P1043 数字游戏 题目描述 丁丁最近沉迷于一个数字游戏之中.这个游戏看似简单,但丁丁在研究了许多天之后却发觉原来在简单的规则下想要赢得这个游戏并不那么容易.游戏是这样的,在你面前有一圈整数(一共n ...

  6. Error-MySQL:2005 - Unknown MySQL server host 'localhost'(0)

    ylbtech-Error-MySQL:2005 - Unknown MySQL server host 'localhost'(0) 1.返回顶部 1. 今天在外面开navicat for mysq ...

  7. 603E

    LCT维护MST+子树信息 看了好长时间题解 editorial 结论:像做最小生成树一样,当每个连通块都是偶数个点就停下来. 每次复杂度mlogm 口胡 首先我们发现奇数个点是不满足每个点度数为奇数 ...

  8. Android多级目录树

    本例中目录树的菜单数据是从json数据中获取,首先建立一个菜单实体类  MenuTree package com.gao.tree; /** * 菜单树的各级菜单实体类 * * @author tjs ...

  9. 《疯狂Python讲义》重要笔记--变量

    一个Python解释器 接下来的旅程——你需要下载好Python,Python解释器通常放在 /usr/local/bin/python3.7 ; 在Unix系统的bash中输入 where pyth ...

  10. C#之考勤系统

    闲来无聊,搞搞C#,下面就是我写的一个Demo 员工类 using System; using System.Collections.Generic; using System.Linq; using ...