在JavaScript编程中我们用的很多的一个场景就是写模块.可以看成一个简单的封装或者是一个类库的开始,有哪些形式呢,先来一个简单的模块. 简单模块 var foo = (function() { var name = "foo"; function hello() { console.log("hello "+name); } function doWork() { console.log("do work"); } return { hel…

读完还是能学到很多的基础知识,这里记录下,方便回顾与及时查阅. 内容也有自己的一些补充. JavaScript DOM 编程艺术(第二版) 1.JavaScript简史 JavaScript由Netscape公司与Sun公司合作开发,在JavaScript之前,web浏览器只是显示文本文档的软件,JavaScript之后,网页内容不再局限于枯燥的文本,交互性显著改善.在JavaScript的第一个版本,即JavaScript 1.0版本,出现在1995年推出的Netscape Navigator…

数组是一段线性分配的内存,它通过整数计算偏移并访问其中的元素.大多数的语言都会要求一个数组的元素是相同类型,但JavaScript数组可以包含任意类型. var misc = ['string', null, true, 98.4, undefined, NaN,2, { object: true }, Infinity, ['dd', 'ss']]; console.log(misc.length); 长度 数组的length没有上界,如果用大于等于当前length的数字作为下标保存一个元素,…

在JavaScript中继承不像C#那么直接,C#中子类继承父类之后马上获得了父类的属性和方法,但JavaScript需要分步进行. 让Brid 继承 Animal,并扩展自己fly的方法. function Animal(name) { this.name = name; this.type = "animal"; } Animal.prototype= { say:function() { alert("I'm a " + this.type + ",…

四.惰性载入函数 因为浏览器兼容的原因,我们的javascript代码会有大量的if语句,将执行引导到正确的代码中,看如下函数: function createXHR(){ if (typeof XMLHttpRequest != "undefined"){ return new XMLHttpRequest(); } else if (typeof ActiveXObject != "undefined"){ if (typeof arguments.callee…

一.安全的类型检测 javascript内置的类型检测机制并非完全可靠,由于浏览器或者作用域等原因,经常会发生错误.大家知道,在任何值调用toString()方法都会返回一个[object Native ConstructorName]格式的字符串,每个类内部都有一个[class]属性,这个属性就指定了上述字符串中的构造函数名.例如 var value=[1,2,3,4,5] alert(Object.prototype.toString.call(value));//"[object Arra…

javascript 采用设计模式主要有下面的三方面原因: 可维护性:设计模式有助于降低模块之间的耦合程度.这使代码进行重构和换用不同的模块变得容易,也使程序员在大型项目中合作变得容易. 沟通:设计模式为处理不同类型的对象提供了一套通用的术语.程序员可以简洁的描述自己系统的工作方式. 性能:采用一些优化性能的模式,可以大幅度提高程序的执行效率,如享元模式和代理模式等 同时,滥用设计模式也会带来一些后果: 复杂性:代码变得复杂,新手难以理解 性能:多数设计模式会或多或少的降低代码的性能 实现容易,…

本章研究的是一种封装方法调用的方式.命令模式与普通函数有所不同.它可以用来对方法调用进行参数化处理和传送,经过这样处理过的方法调用可以在任何需要的时候执行. 它也可以用来消除调用操作的对象和实现操作的对象之间的耦合.这为各种具体的类的更换带来了极大的灵活性.这种模式可以用在许多不同的场合,不过它在创建用户界面这一方面非常有用,特别是在需要不受限的取消操作的时候.它还可以用来替代回调函数,因为它能够提高在对象之间传递的操作的模块化程度. 命令的结构: 最简形式的命令对象是一个操作和用以调用这个操作…

在事件驱动的环境中,比如浏览器这种持续寻求用户关注的环境中,观察者模式是一种管理人与其任务(确切的讲,是对象及其行为和状态之间的关系)之间的关系的得力工具.用javascript的话来讲,这种模式的实质就是你可以对程序中某个对象的状态进行观察,并且在其发生变化时可以得到通知. 观察者模式中存在俩个角色:观察者和被观察者.也可以叫做发布者和订阅者.这种模式在javascript中有几种不同的实现方法,下面将对其中的一些实现方式进行考察. 模式的实践: 在javascript中有多种方法可以实现发布…

代理(proxy)是一个对象,它可以用来控制对另一对象的访问.它与另外那个对象实现了同样的接口,并且会把任何方法调用传递给那个对象.另外那个对象通常称为本体.代理可以代替本体被实例化,并使其可被远程访问.它还可以把本体的实例化推迟到真正需要的时候,对于实例化比较费时的本体,或者因为尺寸较大以至于不用时不宜保存在内存中的本体,这特别有用.在处理那些需要较长时间才能把数据载入用户界面的类,代理也十分有用. 代理模式最基本的形式就是对访问进行控制,代理对象和本体实现的是同样的接口.实际工作还是本体在做…

本章探讨另一种优化模式-享元模式,它最适合于解决因创建大量类似对象而累及性能的问题.这种模式在javascript中尤其有用,因为复杂的javascript代码很快就会用光浏览器的所有可用内存,通过把大量独立对象转化为少量共享对象,可以降低运行web应用程序所需的资源数量. 享元模式用于减少应用程序所需对象的数量.这是通过对对象的内部状态划分为内在数据和外在数据俩类实现的.内在数据是指类的内部方法所需要的信息,没有这种数据的话类就不能正常运转.外在数据则是可以从类身上剥离并存储在其外部的信息.我…

门面模式有俩个作用: 简化类的接口 消除类与使用它的客户代码之间的耦合 在javascript中,门面模式常常是开发人员最亲密的朋友.它是几乎所有javascript库的核心原则,门面模式可以使库提供的工具更容易理解.使用这种模式,程序员可以间接地与一个子系统打交道,与直接访问子系统相比,这样做更不容易出错. addEvent函数是一个基本的门面,你不用在每次为一个元素添加事件监听器的时候都得针对浏览器间的差异进行检查,有了这个便利,你可以把这个添加事件的底层细节抛在脑后,而把心思集中在如何构建…

单体是一个用来划分命名空间,并将一批相关方法和属性组织在一起的对象,如果它可以被实例化,那么它只能被实例化一次. 单体模式,就是将代码组织为一个逻辑单元,这个逻辑单元中的代码可以通过单一的变量进行访问. 单体基本结构是这样: var Singleton = { attribute1:true, attribute2:, method1:function(){}, method2:function(){} } 借助闭包实现单体: Namespace.Singleton = {} 定义之后立即执行的…

组合模式是一种专为创建Web上的动态用户界面而量身定制的模式,使用这种模式,可以用一条命令在对各对象上激发复杂的或递归的行为. 在组合对象的层次体系中有俩种类型对象:叶对象和组合对象.这是一个递归定义,但这正是组合模式如此有用的原因所在.一个组合对象由一些别的组合对象和叶对象组成,其中只有叶对象不再包含子对象,叶对象是组合对象中最基本的元素,也是各种操作的落实地点. 存在一批组织成某种层次体系的对象(具体的结构在开发期间可能无法得知) 希望这批对象或其中的一部分对象实施一个操作 表单验证实例:…

JavaScript严格意义上分为ECMAScript.DOM.BOM.ECMAScript是一门真正意义上的语言,独立于浏览器,浏览器只是它的一个宿主环境.DOM(文档对象模型),为ECMAScript操作浏览器网页内容提供接口.BOM(浏览器对象模型),用来控制浏览器(宽度.高度.新窗口打开网页……),提供与浏览器交互的接口.以上三种结合起来,才是真正的JavaScript. ECMAScript的变量类型是松散的,即为弱类型,用var声明一个变量以后就可以保存任何类型的数据.如果你是从Ja…

本文首发在我的个人博客:http://muyunyun.cn/ <你不知道的JavaScript>系列丛书给出了很多颠覆以往对JavaScript认知的点, 读完上卷,受益匪浅,于是对其精华的知识点进行了梳理. 什么是作用域 作用域是一套规则,用于确定在何处以及如何查找变量. 编译原理 JavaScript是一门编译语言.在传统编译语言的流程中,程序中一段源代码在执行之前会经历三个步骤,统称为"编译". 分词/词法分析 将字符串分解成有意义的代码块,代码块又称词法单元.比如…

是时候写一写 “继承”了,为什么加引号,因为当你阅读完这篇文章,你会知道,说是 继承 其实是不准确的. 一.类1.传统的面向类的语言中的类:类/继承 描述了一种代码的组织结构形式.举个例子:“汽车”可以被看作是“交通工具”的一种特例.我们可以定义一个 Vehicle 类和一个 Car 类来对这种关系进行描述.Vehicle 的定义可能包含引擎.载人能力等,也就是 所有交通工具,比如飞机.火车和汽车等都有的通用的功能描述.在对 Car 类进行定义的时候,重复定义“载人能力”是没有意义的,我们只需要…

JavaScript严格意义上分为ECMAScript.DOM.BOM.ECMAScript是一门真正意义上的语言,独立于浏览器,浏览器只是它的一个宿主环境.DOM(文档对象模型),为ECMAScript操作浏览器网页内容提供接口.BOM(浏览器对象模型),用来控制浏览器(宽度.高度.新窗口打开网页……),提供与浏览器交互的接口.以上三种结合起来,才是真正的JavaScript. ECMAScript的变量类型是松散的,即为弱类型,用var声明一个变量以后就可以保存任何类型的数据.如果你是从Ja…

一. 数据类型: 1. undefined: 未声明和未初始化的变量,typeof 操作符返回的结果都是 undefined:(建议未初始化的变量进行显式赋值,这样当 typeof 返回 undefined 时就知道是未声明了,帮助定位问题) 2. null:建议,将即将保存但还未真正保存对象的变量,赋值为 null: 3. number: 保存浮点数需要的内存空间是保存整数值的两倍,因此 ECMAScript 会不失时机的将浮点数值转换为整数值: 4. NaN: isNaN() 用于确定其参数…

1. 注释: 在js中,/**/为块注释,//为行注释:但块注释在有些情况下是不安全的.如: /* var rm_a = /a*/.match(s); */ 上面的注释导致了一个语法错误.所以,建议避免使用 /**/ 注释,而用 // 注释代替它. 2. true/false: false:false,null,undefined,空字符串" " ,数字0,数字NaN: true:除以上外所有的值,包括 true,字符串‘false’,以及所有的对象: 3. 对象: (1)对象属性名可…

一个类或者对象中,往往会包含别的对象.在创建这种对象的时候,你可能习惯于使用常规方式,即用 new 关键字和类构造函数. 这会导致相关的俩个类之间产生依赖. 工厂模式,就是消除这俩个类之间的依赖性的一种模式,它使用一种方法来决定究竟实例化那个具体的类. 简单工厂模式 假设你想开几个自行车商店,每个商店都有几种型号的自行车出售,可以用这样一个类来表示: var BicycleShop = function(){} BicycleShop.prototype = { sellBicycle:func…

责任链模式可以用来消除请求的发送者和接收者之间的耦合.这是通过实现一个由隐式地对请求进行处理的对象组成的链而做到的.链中的每个对象可以处理请求,也可以将其传给下一个对象. 责任链的结构: 责任链由多个不同类型的对象组成,发送者是发出请求的对象,而接收者则是链中那些接收这种请求并且对其进行处理或者传递的对象.请求本身有时也是一个对象,它封装着操作有关的所有数据.其典型的运转流程大致如下: 发送者知道链中的第一个接收者.它向这个接收者发出请求. 每一个接收者都对请求进行分析,然后要么处理它,要么将其…

本章讨论的是一种为对象增添特性的技术,它并不使用创建新子类这种手段. 装饰者模式可以透明地把对象包装在具有同样接口的另一对象之中,这样一来,你可以给一些方法添加一些行为,然后将方法调用传递给原始对象.相对于创建子类来说,使用装饰者模式对象是一种更灵活的选择. 装饰者可用于为对象增加功能.它可以用来替代大量子类. 考虑前面的自行车类,你现在可能提供一些配件供用户选择,装饰者模式要求我们只需要创建选件类,这些类与四种自行车类都要实现Bicycle接口,但是他们只被用作这些自行车类的包装类.在这个例子…

适配器模式可以用来在现在接口和不兼容的类之间进行适配. 使用这种模式的对象又叫包装器,因为他们是在用一个新接口包装另一个对象. 在设计类的时候往往遇到有些接口不能与现有api一同使用的情况,借助于适配器,你可以不用直接修改这些类也能使用他们. 适配器的特点: 适配器可以被添加到现有代码中以协调俩个不同的接口.从表面上来看,适配器模式很像门面模式,他们都要对别的对象进行包装并改变其呈现的接口,二者之间的差别在于他们如何改变接口.门面元素展现的是一个简化接口,它并不提供额外的选择,而且有时是为了方便…

> 变量.作用域和内存问题js为弱类型的语言 变量的值和数据类型可以在脚本的生命周期内改变.5种基本类型:string, number, undefined, null, boolean,基本数据类型是按值访问的.引用类型是保存在内存中的对象,js不能直接操作对象的内存空间.引用类型是按引用访问的. 动态的属性对象的属性可以随时添加和删除 delete运算符不能给基本类型添加属性 如:var name = "myname";name.age = 18;console.log(na…

这本<高性能JavaScript>讲述了有关JavaScript性能优化的方方面面,主要围绕以下几个方面: 1> 加载顺序 2> 数据访问(如怎样的数据类型访问最快,怎样的作用域链最优) 3> DOM编程(如怎样的方式访问DOM元素性能是最优的) 4> 字符串和正则 5> Ajax 6> 编程实践(性能测试工具的使用.创建与部署JavaScript应用程序.如何提升程序响应) var script = document.createElement (&quo…

第一章 加载和运行 延迟脚本 defer 该属性表明脚本在执行期间不会影响到页面的构造,脚本会先下载但被延迟到整个页面都解析完毕后再运行.只适用于外部脚本 <script src="js/test.js" defer></script> <div>123</div> <script> alert('script'); window.onload = function(){ alert('loaded'); } </scr…

起因 web编程过程使用javascript时感觉很吃力,效率很低.根本原因在于对javascript整个知识体系不熟,看来需要找些书脑补一下,同时欢迎众网友监督. 大神推荐书籍 看了博客大神们推荐的javascript书籍和推荐的阅读顺序,如下所示: 从头到尾对一遍<<Javascript高级程序设计>>,不懂的地方可以暂时掠过,给自己对javascript有一个大体的印象 认认真真的读完这本书:<<编写可维护的javascript>>,从编码规范,技巧,…

<javascript权威指南>读书笔记——第二篇 金刚 javascript js javascript权威指南 今天是今年的196天,分享今天的读书笔记. 第2章 词法结构 2.1 字符集 JavaScript程序是用Unicode字符集编写. Unicode是ASCII和Latin-1的超集,支持几乎所有语言. ES3 要求支持Unicode 2.1及后续版本 ES5 要求支持Unicode 3及后续版本 2.1.1 区分大小写 JavaScript是区分大小写的. HTML 并不区分大…

<javascript权威指南>读书笔记——第一篇 金刚 javascript js javascript权威指南 由于最近想系统学习下javascript,所以开始在kindle上看这本书来补充下. 今天是今年的196天,由于我之前承诺过,每天分享读书笔记,只是之前分享的是大众读物,所以随手分享到kindle阅读群里了.但是现在读的是技术类书籍,分享到kindle读书群不太合适,所以还是以博客的形式分享.这样子,一个链接,大家感兴趣了就点开看看,不感兴趣了,就不点开. 其实这篇文章应该是昨天…