JavaScript常用设计模式
单例模式:确保类只能被实例化一次。
var obj = {}
2、函数返回值
var func = function () {return {}}
var obj = func();
3、构造函数初始化
var obj = (function () {return {}})()
装饰者模式:装饰者用用于包装同接口的对象。
var obj = obj || {}
obj.set = function(){}
obj.get = function(){}
obj.……= function(){}
模块模式:该模式使用闭包封装私有状态和组织。
var module = (function(obj){})({});
观察者模式:它定义了一种一对多的关系,让多个观察者对象同时监听某一个主题对象。
function func() {}
func.prototype.set = function(opt){}
func.prototype.get = function(opt){}
var obj = new func();
obj.set({});
obj.get({});
构造函数模式:自定义自己的构造函数,然后在里面声明自定义类型对象的属性或方法。
1、构造函数
function func(name,age){
this.id = 0;
//code……
}
func.prototype.pro = function(){}
2、构造函数强制实例化
function func(title) {
if (!(this instanceof func)) {
return new func(title);
}
this.title = title;
}
func.prototype.get = function () { return this.title; }
console.log(obj.get());
工厂模式:工厂模式就好比现实生活中的工厂可以产生大量相似的产品。
function func(opt){
var obj = {
id:0,
title:''
}
return $.extend(obj,opt);
}
var f1 = func({id:1,title:'标题1'});
var f2 = func({id:2,title:'标题2'});
对象创建模式:对象中创建对象
模式1:命名空间(namespace)
var obj = obj || {};
obj.app = obj.app || {};
obj.app.ios = obj.app.ios || {};
obj.app.android = obj.app.android || {};
模式2:通过自执行函数创建对象
var obj;
(function () {
obj = {}
})
模式3:链模式
var obj = {
func1: function () {return this;},
func2: function () {return this;},
……: function () {return this;}
}
// 链方法调用
obj.func1().func2().……();
模式4:函数语法糖
函数语法糖是为一个对象快速添加方法(函数)的扩展,这个主要是利用prototype的特性
if (typeof Function.prototype.method !== "function") {
Function.prototype.method = function (name, implementation) {
this.prototype[name] = implementation;
return this;
};
}
var func = function (name) {
this.name = name;
}.method('set', function (name) {
this.name = name;
}).method('get', function () {
return this.name;
});
var a = new func('a');
a.set('b');
console.log(a.get());
沙盒模式
JavaScript常用设计模式的更多相关文章
- 7 种 Javascript 常用设计模式学习笔记
7 种 Javascript 常用设计模式学习笔记 由于 JS 或者前端的场景限制,并不是 23 种设计模式都常用. 有的是没有使用场景,有的模式使用场景非常少,所以只是列举 7 个常见的模式 本文的 ...
- Javascript 常用设计模式
转载自:https://blog.csdn.net/buptlyz/article/details/52018193 单例模式(模块模式):确保始终只创建一个实例的对象时使用的设计模式. 为什么需要采 ...
- Javascript常用的设计模式详解
Javascript常用的设计模式详解 阅读目录 一:理解工厂模式 二:理解单体模式 三:理解模块模式 四:理解代理模式 五:理解职责链模式 六:命令模式的理解: 七:模板方法模式 八:理解javas ...
- JavaScript 常用功能总结
小编吐血整理加上翻译,太辛苦了~求赞! 本文主要总结了JavaScript 常用功能总结,如一些常用的JS 对象,基本数据结构,功能函数等,还有一些常用的设计模式. 目录: 众所周知,JavaScri ...
- select元素javascript常用操作 转
/*------------------------------------------------------ *作者:xieyu @ 2007-08-14 *语言:JavaScript *说明:s ...
- Android常用设计模式(二)
Android常用设计模式之观察者模式 观察者设计模式在Android应用中会经常用到,模式原理类似于这样的场景: 用户订报纸,然后在报社登记,报社来统计用户(添加用户),用户也可以取消订阅,报社删除 ...
- 代码重构 & 常用设计模式
代码重构 重构目的 相同的代码最好只出现一次 主次方法 主方法 只包含实现完整逻辑的子方法 思维清楚,便于阅读 次方法 实现具体逻辑功能 测试通过后,后续几乎不用维护 重构的步骤 1 新建一个方法 ...
- IOS开发常用设计模式
IOS开发常用设计模式 说起设计模式,感觉自己把握不了笔头,所以单拿出iOS开发中的几种常用设计模式谈一下. 单例模式(Singleton) 概念:整个应用或系统只能有该类的一个实例 在iOS开发我们 ...
- 第二篇、JavaScript常用的API
下面是我整理的一些JavaScript常用的API清单. 目录 元素查找 class操作 节点操作 属性操作 内容操作 css操作 位置大小 事件 DOM加载完毕 绑定上下文 去除空格 Ajax JS ...
随机推荐
- C#编程(小结)---------- 小总结
总结 概括 委托是寻址方法的.NET版本,类似于C++中的指针.委托可以理解为指向函数的指针,它是类型安全的,定义了具体的参数和返回值. 定义一个委托,实际上是定义一个类,委托是对方法的引用,如方法F ...
- 手工Ghost安装系统
(1)其实手工ghost很简单,正确操作的话是不会有什么问题的,在PE下,打开ghost程序 (2)按任意键进入ghost操作界面,出现ghost菜单,我们现在只用到Local菜单项,下面有三个子项: ...
- 【Centos】centos查看磁盘使用情况
1.查看分区和磁盘 lsblk 查看分区和磁盘 2.查看空间使用情况 df -h 查看空间使用情况 3.分区工具查看分区信息 fdisk -l 分区工具查看分区信息 4.查看分区 cfdisk /de ...
- HDU 4888 Redraw Beautiful Drawings 网络流 建图
题意: 给定n, m, k 以下n个整数 a[n] 以下m个整数 b[n] 用数字[0,k]构造一个n*m的矩阵 若有唯一解则输出这个矩阵.若有多解输出Not Unique,若无解输出Impossib ...
- mybatis大于号,小于号,去地址符,单引号,双引号转义说明
在mybatis中,使用到大于号,小于号,与在SQL编辑器中是不一样的. SELECT * FROM test WHERE 1 = 1 AND start_date <= CURRENT_DAT ...
- JQuery攻略(五)表单验证
表单验证,字段空白,输入合法,数据合法....... 此章节有 1.1字段验证 1.2正则表达式验证 1.3复选框的勾选 1.1字段验证 1.字段非空 $(document).ready(functi ...
- Java命令学习系列(四)——jstat
jstat(JVM Statistics Monitoring Tool)是用于监控虚拟机各种运行状态信息的命令行工具.他可以显示本地或远程虚拟机进程中的类装载.内存.垃圾收集.JIT编译等运行数据, ...
- [转]Haproxy 1.5.0 正式发布,Web 负载均衡
From : http://www.oschina.net/news/53070/haproxy-1-5-0 经过 4 年的不懈努力,HAProxy 1.5.0 终于发布了! 相对于 1.4 版本来说 ...
- mybatis中sql标签、where标签、foreach标签用法
<sql id="query_user_where"> <!-- 如果 userQueryVo中传入查询条件,再进行sql拼接--> <!-- tes ...
- IE11 F12工具报错
系统环境 win7+IE11 报错描述: Exception in window.onload: Error: An error has ocurredJSPlugin.3005 Stack Trac ...