JavaScript 设计模式之迭代器模式

什么是迭代器模式?迭代器模式是指提供一种方法顺序访问一个聚合对象中的各个元素,而又不需要暴露该对象的内部表示。迭代器模式可以把迭代的过程从业务逻辑中分离出来,在使用迭代器模式之后,即使不关心对象的内部构造,也可以按顺序访问其中的每个元素。jQuery中的迭代器迭代器模式无非就是循环访问聚合对象中的各个元素。比如jQuery中的$.each函数,其中回调函数中的参数i为当前索引,n为当前元素,代码如

- 阅读全文 -

JavaScript 设计模式之代理模式

什么是代理模式?首先我们先看一个有趣的例子在四月一个晴朗的早晨,小明遇见了他的百分百女孩,我们暂且称呼小明的女神为A。两天之后,小明决定给A送一束花来表白。刚好小明打听到A和他有一个共同的朋友B,于是内向的小明决定让B来代替自己完成送花这件事情。虽然小明的故事必然以悲剧收场,因为追MM更好的方式是送一辆宝马。不管怎样,我们还是先用代码来描述一下小明追女神的过程,先看看不用代理模式的情况:// 首先

- 阅读全文 -

JavaScript 设计模式之策略模式

什么是策略模式?策略模式的定义是:定义一系列的算法,把它们一个个封装起来,并且使它们可以相互替换。使用策略模式计算奖金很多公司的年终奖是根据员工的工资基数和年底绩效情况来发放的。例如,绩效为S的人年终奖有4倍工资,绩效为A的人年终奖有3倍工资,而绩效为B的人年终奖是2倍工资。假设财务部要求我们提供一段代码,来方便他们计算员工的年终奖。不使用策略模式我们可以编写一个名为calculateBonus的

- 阅读全文 -

JavaScript 设计模式之js中的单例模式

javascript是一门无类语言,也正是因为如此,生搬硬套单例模式的概念毫无意义。在Javascript中创建对象的方法非常简单,既然我们只需要一个唯一的“对象”,为什么要为它先创建一个“类呢”?单例模式的核心是:确保只有一个实例,并且提供全局访问全局模式不是单例模式,但在Javascript开发中,我们经常会把全局变量当作单例来使用。例如:var a={};当用这种方式创建对象a的时候,对象a

- 阅读全文 -

JavaScript 设计模式之单例模式

什么是单例模式?单例模式的定义是:保证一个类仅有一个实例,并提供一个访问它的全局访问点单例模式是一种常用的模式,有一些对象往往我们只需要哦一个,比如线程池,全局缓存,浏览器中的Windows对象等。在JavaScript中,单例模式的用途非常广泛,试想一下,当我们单击登陆按钮的时候,页面上会出现一个悬浮框,并且这个悬浮框是唯一的,无论点击多少次登陆按钮,这个悬浮窗只会出现一次,那么这个登陆浮窗就适

- 阅读全文 -

JavaScript 第二十七篇 性能篇

避免全局查找可能优化脚本性能最重要的就是注意全局查找。使用全局变量和函数肯定要比局部的开销更大,因为要涉及作用域链上的查找。将在一个函数中会用到多次的全局对象存储为局部变量总是没错的。 特别是使用链式操作的时候,如果涉及到全局变量,应把全局变量赋予给局部变量避免 with 语句在性能非常重要的地方必须避免使用 with 语句。和函数类似,with 语句会创建自己的作用域,因此会增加其中执行的代码的

- 阅读全文 -

JavaScript 第二十六篇 Web存储机制

Web Storage 最早是在 Web 超文本应用技术工作组(WHAT-WG)的 Web 应用 1.0 规范中描述的。这个规范的最初的工作最终成为了 HTML5 的一部分。Web Storage 的目的是克服由 cookie 带来的一些限制,当数据需要被严格控制在客户端上时,无须持续地将数据发回服务器。Web Storage 的两个主要目标是:提供一种在 cookie 之外存储会话数据的途径;提

- 阅读全文 -

JavaScript 第二十五篇 数据存储之cookie

CookieHTTP Cookie,通常直接叫做 cookie,最初是在客户端用于存储会话信息的。该标准要求服务器对任意 HTTP 请求发送 Set-Cookie HTTP 头作为响应的一部分,其中包含会话信息。例如,这种服务器响应的头可能如下:HTTP/1.1 200 OK Content-type: text/html Set-Cookie: name=value Other-header:

- 阅读全文 -

JavaScript第二十四篇 高级定时器(下)

数组分块所谓数组分块,就是当你发现某个循环占用了大量时间,同时对于上述两个问题,你的回答都是“否”,那么你就可以使用定时器分割这个循环。思路是结合定时器进行递归调用定时器基本示例如下:setTimeout(function(){ //取出下一个条目并处理 var item = array.shift(); process(item); //若还有条目,再设置

- 阅读全文 -

JavaScript第二十四篇 高级定时器(上)

使用 setTimeout()和 setInterval()创建的定时器可以用于实现有趣且有用的功能。虽然人们对 JavaScript 的定时器存在普遍的误解,认为它们是线程,其实 JavaScript 是运行于单线程的环境中的,而定时器仅仅只是计划代码在未来的某个时间执行。执行时机是不能保证的,因为在页面的生命周期中,不同时间可能有其他代码在控制 JavaScript 进程。在页面下载完后的代码

- 阅读全文 -