设计模式:

通过封装、继承、多态、组合等技术的反复使用,提炼出一些可重复使用的面向对象设计技巧。

1.多态(’做什么‘和’谁去做‘分开)

多态指同一个实体同时具有多种形式。

同一操作应用于不同的对象上面,可以产生不同的解释和不同的执行结果(例如不同的动物发出叫声)。将不变的隔离出来。

//对象
var makeSound = function( animal ){
animal.sound();
}
//不同的操作
var Duck = function(){}; Duck.prototype.sound = function(){
console.log('嘎嘎嘎');
}
//不同的行为
var Chicken = function(){}; Chicken.prototype.sound = function(){
console.log('咯咯咯');
} makeSound( new Duck() );
makeSound( new Chicken() );

使用继承得到多态的效果。(一只麻雀在飞,一只喜鹊在飞)可以说 一只鸟在飞。  java使用抽象类继承。

多态与设计模式(命令模式,组合模式,策略模式)

2.封装 (更重要的封装变化,将不变的部分和容易变化的部分分隔出来)

1)封装数据。2)封装实现。(迭代器,each)3)封装类型。4)封装变化。

//封装实现
function $each(jn, fn) {
var len = jn.length;
if ("number" === typeof len) {
for (var i = 0; i < len; i++) {
try {
fn(jn[i], i,jn);
} catch(e) {
if ($break(e)) {
break;
} else {
throw e;
};
}
}
} else {
for (var k in jn) {
try {
fn(jn[k], k,jn);
} catch(e) {
if ($break(e)) {
break;
} else {
throw e;
};
}
}
}
}

3.克隆。

Object.create = Object.create || function( obj ){
var F = function(){};
F.prototype = obj;
return new F();
}

4.开放-封闭原则。

放在过多的 if-else里的逻辑抽离出来放函数里。

5.单一原则。

仅有一个引起它变化的原因。如果有多个变化引起改变,容易将职责耦合在一块,导致耦合脆弱,低内聚。

JS设计模式基础的更多相关文章

  1. JS设计模式(一)

    刚入职时,看过一段时间的设计模式,似懂非懂.不知不觉过去七个月了,对JS的理解更深刻了,数据结构与算法的基础也基本上算是过了一遍了,接下来要把设计模式搞定,然后不再深层次研究JS了,而是学习前端自动化 ...

  2. 前端笔记之JavaScript面向对象(三)初识ES6&underscore.js&EChart.js&设计模式&贪吃蛇开发

    一.ES6语法 ES6中对数组新增了几个函数:map().filter().reduce() ES5新增的forEach(). 都是一些语法糖. 1.1 forEach()遍历数组 forEach() ...

  3. node.js学习(二)--Node.js控制台(REPL)&&Node.js的基础和语法

    1.1.2 Node.js控制台(REPL) Node.js也有自己的虚拟的运行环境:REPL. 我们可以使用它来执行任何的Node.js或者javascript代码.还可以引入模块和使用文件系统. ...

  4. Node.js系列基础学习----安装,实现Hello World, REPL

    Node.js基础学习 简介 简单的说 Node.js 就是运行在服务端的 JavaScript.Node.js 是一个基于Chrome JavaScript 运行时建立的一个平台.Node.js是一 ...

  5. css+js+html基础知识总结

    css+js+html基础知识总结 一.CSS相关 1.css的盒子模型:IE盒子模型.标准W3C盒子模型: 2.CSS优先级机制: 选择器的优先权:!important>style(内联样式) ...

  6. js设计模式(12)---职责链模式

    0.前言 老实讲,看设计模式真得很痛苦,一则阅读过的代码太少:二则从来或者从没意识到使用过这些东西.所以我采用了看书(<js设计模式>)和阅读博客(大叔.alloyteam.聂微东)相结合 ...

  7. JS设计模式——5.单体模式

    JS设计模式——5.单体模式 http://www.cnblogs.com/JChen666/p/3610585.html   单体模式的优势 用了这么久的单体模式,竟全然不知!用它具体有哪些好处呢? ...

  8. JavaScript基础精华02(函数声明,arguments对象,匿名函数,JS面向对象基础)

    函数声明 JavaScript中声明函数的方式:(无需声明返回值类型) function add(i1, i2) {             return i1 + i2;//如果不写return返回 ...

  9. js 设计模式-接口

    js模拟java接口检测函数:确保子类实现接口中的方法:(出自js设计模式) 上代码: <script type="text/javascript" > <%-- ...

随机推荐

  1. JDBC浅析

    今天简单的说一下jdbc,本来这玩意儿也很简单. 大家只需要记住其中的几个重要的类就行了,它们都在sql包里.今天主要是拿mysql来连接.先看一下主要的几个类吧. 1.Conenction 2.St ...

  2. 戴尔笔记本Inspiron 7560(灵越) 加装固态硬盘从选购固态硬盘到系统迁移到设置SSD为第一启动(受不了了,网上的教程就没有完整的)

    菜鸡我的笔记本为戴尔灵越Inpsiron 7560,其实Inspiron 15 7560 和Inspiron 7560是同一个型号. 电脑拆了安过内存条,换过电池,现在又加了一块固态硬盘. 因为不想安 ...

  3. CSS 笔记——文本字体

    5. 文本字体 -> 文本 (1)text-indent 基本语法 text-indent : length 语法取值 length : 百分比数字 | 由浮点数字和单位标识符组成的长度值,允许 ...

  4. 【jzyzoj】【p1320 patrol】 巡逻(网络流最小割例题)

    描述 Description FJ有个农场,其中有n块土地,由m条边连起来.FJ的养牛场在土地1,在土地n有个新开张的雪糕店.Bessie经常偷偷溜到雪糕店,当Bessie去的时候,FJ就要跟上她.但 ...

  5. 【Floyd】POJ2139 -Six Degrees of Cowvin Bacon

    普通的Floyd了分分秒可以水过,结果在submit前删调试段落的时候把程序本体给删了吃了两个WA…… #include<iostream> #include<cstring> ...

  6. Maven打war包时,添加本地jar包

    1.在项目根目录中新建lib文件夹,添加jar包 2.在pom.xml文件中添加dependency <dependency> <groupId>com.oracle</ ...

  7. Problem A: 指针:调用自定义交换函数,完成三个数整从小到大排列

    #include<stdio.h> int swap(int *p1,int *p2) { int flag; if(*p1>*p2) { flag=*p1; *p1=*p2; *p ...

  8. 使 PHP 写的网站看上去像 asp 页面

    # 使 PHP 代码看上去像 asp 页面 更改Apache 的httpd.conf中AddType application/x-httpd-php .php .phtml改为 AddType app ...

  9. 使用参数化查询防止SQL注入漏洞

    参数化查询防止SQL注入漏洞 看别人的登录注册sql语句有没漏洞即可 Where  name=‘admin’ or ‘1=1’ and password=’123’; 可以Or ‘1=1’就是漏洞 h ...

  10. 使用tcp.validnode_checking允许、限制机器访问数据库

         使用tcp.validnode_checking允许.限制机器访问数据库 在$OREACLE_HOME/network/admin下直接修改sqlnet.ora文件,增加如下内容: tcp. ...