2018年10月_优资园

原创 css中如何使图标的旋转

css中如何使图标的旋转例如：使用的是阿里的icon <i class="iconfont icon-xiangshangjiantou icon-select"></i>//icon-xiangshangjiantou 向上的箭头实现其旋转向下：使用css3的transform属性旋转180度如下，是无效的：.icon-select{ trans...

2018-10-21 15:01:33 15204 2

原创 javascript观察者模式

javascript观察者模式观察者模式又称“发布-订阅（Publish/Subscribe）模式”，订阅者也称为观察者，而补观察的对象称为发布者或主题。当发生了一个重要的事件时，发布者将会通知（调用）所有订阅者并且可能经常以事件对象的形式传递消息。例如:(只做简单的说明观察者模式)几个程序员小朋友要从某网站订阅相关书籍,js编程全解这本书但现在没货,等有货再通知他们,去购买,其中王五同...

2018-10-10 11:02:10 534 1

原创 javascript组合模式

javascript 组合模式需求:一个学校有两个班级，每个班级有两个组，小组分着上课，一起考试不使用组合模式: /* * 需求， * 一个学校有两个班级，每个班级有两个组，小组分着上课，一起考试 * *不使用组合模式 * */ var school = function (name...

2018-10-09 11:59:27 437

原创 javascript 享元模式

javascript 享元模式享元模式（Flyweight Pattern）主要用于减少创建对象的数量，以减少内存占用和提高性能。这种类型的设计模式属于结构型模式，它提供了减少对象数量从而改善应用所需的对象结构的方式。例如:需求 : 在开学季,家里蹲大学,有大量的同学需要入学登记方式1: 不使用享元模式 var student = function (school,professio...

2018-10-09 11:57:15 555

原创 javascript 代理模式

javascript 代理模式通过图来讲解什么是惰性代理(第二个案例)普通代理模式(用处不大,基本不用,主要做案例说明代理模式是什么) /* * 普通代理模式 * */ //图书类 var Book = function (bid,bName,bPrice) { this.bid = bid; ...

2018-10-09 11:47:26 303

原创 javascript 适配器模式

javascript 适配器模式适配器模式：将一个类的接口转换成客户希望的另一个接口。适配器模式让那些接口不兼容的类可以一起工作例如, 我以前做了个api库,其中有个add函数,之前传递两个参数,先在呢,我想传递三个参数,但我依然想兼容以前的api库接口请参考前面文章 /* * 适配器模式 * */ //以前的api 库 var fun = new Interfa...

2018-10-09 11:42:01 190

原创 javascript装饰者模式

javascript装饰者模式装饰者模式，动态地将责任附加到对象上。若要扩展功能，装饰者提供了比继承更加有弹性的替代方案。实例讲解:刚出售的一栋楼有100套清水房现有冰箱，床，空调，根据每套房主人的需要来决定是否安装，或是安装几个 /* * 刚出售的一栋楼有100套清水房 * * 现有冰箱，床，空调，根据每套房主人的需要来决定是否...

2018-10-09 11:36:00 216

原创 javascript 简单工厂

简单工厂简单工厂模式(Simple Factory Pattern)：又称为静态工厂方法(Static Factory Method)模式，它属于类创建型模式。在简单工厂模式中，可以根据参数的不同返回不同类的实例。简单工厂模式专门定义一个类来负责创建其他类的实例，被创建的实例通常都具有共同的父类。例如:自行车商店 ,客户要求不同的类型(编号)的车,返回不同自行车的实例 //定义一个接...

2018-10-09 11:13:29 360

原创理解javscript 桥接模式

理解javascript 桥接模式桥接模式是指：将抽象和行为划分开来，从而将各个可能变化的维度分离开来，各自独立成一个类，但是能够动态的组合。举个例子：实现每个角色的功能（简单说明，不做实际使用）人分为学生和老师两个角色，每个角色都有吃，跑，玩等功能类，如果实现每个角色有哪些功能常规的做法：为了简单说明问题，使用ES6来说明这个问题： var role = function()...

2018-10-05 14:25:35 204

原创深入理解javascript 对象原型和构造函数

深入理解javascript 对象原型和构造函数对象的创建过程当你使用new操作符调用F构造函数时，会经历以下步骤：1.创建一个空对象，作为将要返回的实例对象2.将空对象的原型指向构造函数的prototype属性，也就是F构造函数的prototype属性。3.将空对象赋值给构造函数内部的this关键字，也就是this关键字会指向实例对象。4.开始执行构造函数内部的代码。var st...

2018-10-03 16:29:11 259

zshsats博客