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 ...
随机推荐
- 在Visual Studio中使用层关系图描述系统架构、技术栈
当需要描述项目的架构或技术栈的时候,可以考虑使用层关系图. 在解决方案下添加一个名称为"TailspinToys.DesignModel"的建模项目. 在新建的建模项目下添加一个名 ...
- javascript:currentStyle和getComputedStyle的兼容写法
currentStyle:获取计算后的样式,也叫当前样式.最终样式. 优点:可以获取元素的最终样式,包括浏览器的默认值,而不像style只能获取行间样式,所以更常用到. 注意:不能获取复合样式如bac ...
- mybatis学习之路----批量更新数据两种方法效率对比
原文:https://blog.csdn.net/xu1916659422/article/details/77971696/ 上节探讨了批量新增数据,这节探讨批量更新数据两种写法的效率问题. 实现方 ...
- C#编程(七十一)----------DLR ScriptRuntime
包含DLR ScriptRuntime DLR是微软的一个开源项目.为.NET影城程序提供了动态脚本注入支持.DLR构建的功能包含两个方面,一个是共享的动态类型系统,一个是标准的承载模型.但是VS并没 ...
- 为什么不能用memcached存储Session
Memcached创建者Dormando很早就写过两篇文章[1][2], 告诫开发人员不要用memcached存储Session.他在第一篇文章中给出的理由大致是说,如果用memcached存储Ses ...
- 开源项目PullToRefresh详解(二)——PullToRefreshGridView
这里介绍的是PullToRefreshGridView的使用方法,和之前的PullToRefreshListView方法如出一辙,因为这个开源项目模块化很棒,所以很容易实现.等于说我们可以按照之前使用 ...
- Java命令学习系列(一)——Jps
jps位于jdk的bin目录下,其作用是显示当前系统的java进程情况,及其id号. jps相当于Solaris进程工具ps.不象”pgrep java”或”ps -ef grep java”,jps ...
- 如何解决rar文件解压缩失败
附件经常会是一系列的压缩文件,下载是默认文件名是一个随机数字.因而下载完会出现压缩文件解压缩失败解决方法:下载时重命名为带一定顺序的文件名,如文件1,文件2,文件3等 如何解决单个文件解压失败?论坛中 ...
- Mac下的Docker及Kubernetes(k8s)本地环境搭建与应用部署、管理界面kubernetes-dashboard
mac安装docker: brew cask install docker 当然也可以直接去官网下载docker的pkg文件安装 mac的docker国内镜像:网易的镜像地址:http://hub-m ...
- 洛谷 p1352 没有上司的舞会 题解
P1352 没有上司的舞会 题目描述 某大学有N个职员,编号为1~N.他们之间有从属关系,也就是说他们的关系就像一棵以校长为根的树,父结点就是子结点的直接上司.现在有个周年庆宴会,宴会每邀请来一个职员 ...