js高级程序设计 笔记 --- 高级技巧

一，高级函数

　　1，安全的类型检测

　　　　　Object.prototype.toString.call(value)； 

　　　　　isNativeJson = window.JSON && Object.prototype.toString.call(JSON) == '[object JSON]'

　　2，作用域安全的构造函数

　　　　构造函数如果没用new来调用，里面的this会映射到window对象上。

　　　　作用域安全的构造函数在进行任何更改前，首先确认this对象是不是该构造函数的实例。如果不是则创建新的实例返回。

　　3，惰性载入函数

　　　　函数里面的if 判断，不应该每次调用函数都走一遍流程。可以使用惰性载入让分支只会发生一次。有两种处理的方式，一种是在函数被调用的时候处理。还有一种是在声明的时候就指定适当的函数。

　　4，函数绑定

　　　　使用bind来改变当前函数的作用域和 传递参数。

　　5，函数柯里化

　　　　用于创建已经设置好了一个或者多个参数的函数。原理是使用一个闭包返回一个函数。 es5的bind方法也实现函数柯里化，只要在this的值之后依次传入别的参数。

　　

二，防篡改对象

　　1，不可扩展对象

　　　　Object.preventExtensions( obj )  ：  不能给对象添加新属性和方法

　　2，密封的对象

　　　　使用Object.seal( obj ):   不可扩展，不能删除属性和方法， 属性值是可以修改的。

　　3，冻结的对象

　　　　Object.freeze( obj )

三，高级定时器

　　1，函数节流

　　　　节流的基本思想是指 不可以在没有间隔的情况下连续重复执行。

四，自定义事件

　　

 

五，离线应用与客户端缓存

　　1，离线检测

　　　　navigator.onLine属性。这个属性值为true表示能上网，false为离线。

　　2，应用缓存

　　　　简称Appcache，就是从浏览器的缓存中分出来的一块缓存区。想要在这个区域保存数据，可以使用一个描述文件（manifest file）

　　3，数据存储

　　　　1，cookie： 名称和值都必须是URL编码的。

　　　　　　限制： cookie在性质上是绑定在特定的域名下的。当设定了一个cookie后，再给创建它的域名发送请求时，都会包含这个cookie。

　　　　　　构成 ： 由以下几块信息构成

　　　　　　　　名称：一个唯一确定cookie的名称。不分大小写　

　　　　　　　　值： 存储在cookie中的字符串值，必须被url编码

　　　　　　　　域： cookie对于哪个域是有效的

　　　　　　　　路径： 对于指定域中的那个路径，应该向服务器发送cookie　

　　　　　　　　失效时间： 表示cookie何时应该被删除的时间戳

　　　　　　　　安全标志： 指定后，cookie只有在使用SSL连接的时候才发送到服务器。

　　　　2，js中的cookie

　　　　　　　　document.cookie来获取，返回当前页面可用的所有cookie的字符串，由分号隔开的名值对儿。 必须使用decodeURLComponent来解码

　　　　　　　　

 

新兴的API

　　1，requestAnimationFrame（）

 

 

　　2， File API

　　　　添加了直接访问文件的接口。 h5在DOM中为文件输入元素添加了一个files集合。当选择一个或者多个文件时，files集合中将包含一组File对象。每个File对象对应一个文件。

　　　　FileReader： 是一种异步文件读取机制。有以下几个方法

　　　　　　readAsText（file， encoding） ： 以纯文本形式读取文件。将读取到的文件保存在result属性中

　　　　　　readAsDataURL（file） ： 读取文件并将文件以数据URI的形式保存。

　　　　　　readAsBinaryString（file） ： 读取文件并将一个字符串保存在result中，字符串中的每一个字符表示一字节

　　　　　　readAsArrayBuffer（file） ： 读取文件并将一个包含文件内容的ArrayBuffter保存在result中。

　　　          读取部分内容 ： File对象支持slice（）方法，接收两个参数，起始字节以及要读取的字节数。

　　3，web计时

　　　　window.performance对象。

　　4，web workers

　　　　通过让js在后台运行来解决单线程的问题。

　　　　1，使用worker　

　　　　　　var worker = new Worker（‘abc.js’）

　　　　　　这行代码会下载abc.js，但只有worker接收到消息才会执行文件中的代码。要给worker传递消息可以用postMessage()方法

　　　　　　worker是通过message和error事件与页面通信的。 来自worker的数据保存在event.data中。

　　　　　　worker不能完成给定的任务时会触发error事件。建议在使用web worker时始终都要使用onerror处理程序。

　　　　　　worker.terminate() 用来停止Worker的工作。

 

 

1，剩余参数与分布参数

　　分布参数：  var result = sum（... [1,2,3,4,5]）;   

　　　　　　　　等于   var result = sum.apply(this, [1,2,3,4,5])

2，默认参数

　　js中的参数都是可选的，因为实现不会检查传入的参数个数。