本人平时学习及收集内容，欢迎参入一起讨论。
一个工作八年的草根程序员。
关于canvas用法，请关注相应文章。
关于svg用法，请关注后续相应文章。
window.requestAnimationFrame()告诉浏览器——你希望执行一个动画，并且要求浏览器在下次重绘之前调用指定的回调函数更新动画。该方法需要传入一个回调函数作为参数，该回调函数会在浏览器下一次重绘之前执行
window.requestAnimFrame=(function(){
return window.requestAnimationFrame ||
window.webkitRequestAnimationFrame ||
window.mozRequestAnimationFrame ||
window.oRequestAnimationFrame ||
window.msRequestAnimationFrame ||
function(callback){
window.setTimeout(callback,1000/60);
};
})();
- File 对象
- FileList 对象
- FileReader 对象
File对象代表一个文件，用来读写文件信息。它继承了Blob对象，或者说是一种特殊的Blob对象，所有可以使用Blob对象的场合都可以使用它。
- 构造函数
- 实例属性和实例方法
构造函数
File()构造函数接受三个参数。
- array:一个数组，成员可以是二进制对象或字符串，表示文件的内容。
- name:字符串，表示文件名或文件路径。
- options:配置对象，设置实例的属性。可以设置两个属性。type:字符串，表示实例对象的MIME类型，默认值为空字符串。lastModified：时间戳，表示上次修改的时间，默认为Date.now()。
var file = new File(['foo'],'foo.txt',{type:'text/plain'})
实例属性和实例方法
File 对象有以下实例属性。
- File.lastModified:最后修改时间
- File.name:文件名或文件路径
- File.size:文件大小（单位字节）
- File.type:文件的MIME类型
var myFile = new File([],'file.bin',{
lastModified: new Date(2018, 1, 1)
});
myFile.lastModified
myFile.name // "file.bin"
myFile.size // 0
myFile.type // ""
FileList对象是一个类似数组的对象，代表一组选中的文件，每个成员都是一个 File 实例。它主要出现在两个场合。
- 文件控件节点（<input type="file">）的files属性，返回一个 FileList 实例。
- 拖拉一组文件时，目标区的DataTransfer.files属性，返回一个 FileList 实例。
FileReader提供以下的实例属性：
- FileReader.error：读取文件时产生的错误对象
- FileReader.readyState：整数，表示读取文件时的当前状态。一共有三种可能的状态，0表示尚未加载任何数据，1表示数据正在加载，2表示加载完成。
- FileReader.result：读取完成后的文件内容，有可能是字符串，也可能是一个ArrayBuffer实例。
- FileReader.onabort：abort事件（用户终止读取操作）的监听函数。
- FileReader.onerror：error事件（读取错误）的监听函数。
- FileReader.onload：load事件（读取操作完成）的监听函数，通常在这个函数里面使用result属性，拿到文件内容。
- FileReader.onloadstart：loadstart事件（读取操作开始）的监听函数。
- FileReader.onloadend：loadend事件（读取操作结束）的监听函数。
- FileReader.onprogress：progress事件（读取操作进行中）的监听函数。
FileReader提供了如下几个实例方法：
- readAsText(file,encoding):以纯文本形式读取文件，将读取到的文本保存在result属性中。第二个参数用于指定编码类型，是可选的。
- readAsDataURL(file):读取文件并将文件以数据URI的形式保存在result属性中。
- readAsBinaryString(file):读取文件并将一个字符串保存在result属性中，字符串中的每个字符表示一字节。
- readAsArrayBuffer(file):读取文件并将一个包含文件内容的
Web Worker 的作用，就是为 JavaScript 创造多线程环境，允许主线程创建 Worker 线程，将一些任务分配给后者运行。在主线程运行的同时，Worker 线程在后台运行，两者互不干扰。等到 Worker 线程完成计算任务，再把结果返回给主线程。
Web Worker 有以下几个使用注意点。
- 同源限制
- DOM限制
- 全局对象限制
- 通信联系
- 脚本限制
- 文件限制
Geolocation API这套API，JavaScript代码能够访问到用户的当前位置信息。
Geolocation有以下三个方法：
- getCurrentPosition()确定设备的位置并返回一个携带位置信息的 Position 对象。
- watchPosition()注册一个位置改变监听器，每当设备位置改变时，返回一个 long 类型的该监听器的ID值。
- clearWatch()取消由 watchPosition()注册的位置监听器。
window.history属性指向 History 对象，它表示当前窗口的浏览历史。
History 对象主要有两个属性。
- History.length:当前窗口访问的网址数量（包括当前网页）
- History.state:History堆栈最上层的状态值
- History.back()、History.forward()、History.go()
- History.pushState()
- History.replaceState()
- History.back():移动到上一个网址，等同于点击浏览器的后退键。对于第一个访问的网址，该方法无效果。
- History.forward():移动到下一个网址，等同于点浏览器的前进键。对于最后一个访问的网址，方法无效果。
- History.go():接受一个整数作为参数，以当前网址为基准，移动到参数指定的网址，比如go(1)相当于forward()，go(-1)相当于back()。如果参数超过实际存在的网址范围，该方法无效果；如果不指定参数，默认参数为0，相当于刷新当前页面。
History.pushState()方法用于在历史中添加一条记录。
window.history.pushState(state, title, url)
该方法接受三个参数，依次为：
- state:一个与添加的记录相关联的状态对象，主要用于popstate事件。该事件触发时，该对象会传入回调函数。也就是说，浏览器会将这个对象序列化以后保留在本地，重新载入这个页面的时候，可以拿到这个对象。如果不需要这个对象，此处可以填null。
- title:新页面的标题。但是，现在所有浏览器都忽视这个参数，所以这里可以填空字符串。
- url:新的网址，必须与当前页面处在同一个域。浏览器的地址栏将显示这个网址。
History.replaceState()方法用来修改History对象的当前记录，其他都与pushState()方法一模一样。
每当同一个文档的浏览历史（即history对象）出现变化时，就会触发popstate事件。
window.onpopstate = function (event) {
console.log('location: ' + document.location);
console.log('state: ' + JSON.stringify(event.state));
};
后续文章会详细介绍WebSocket。
平凡世界，贵在坚持。
