本文是我在学习了慕课视频教程之后总结的学习笔记，以前端面试常见考题为方向复习JS。
笔记一共分为四部分：
1、基础知识
原型、原型链
作用域、闭包
异步、单线程
2、JS-API
Dom操作
Ajax
事件绑定
3、开发环境
版本管理
模块化
打包工具
4、运行环境
页面渲染
性能优化
下面直接进入第一部分。
第一章、JS基础知识
一、变量类型与类型转换
题目：
JS中使用typeof能得到哪些类型
何时使用===，何时使用==
JS中有哪些内置函数
JS变量按照存储方式划分有哪些类型，并描述其特点
如何理解JSON
知识点：
1、变量类型
基本数据类型：string 、number 、boolean 、 null 、undefined
引用数据类型：Object、Array、Function、Date
利用 typeof 能检测得到的值：string、number、boolean、undefined、null、function
但是 typeof {} 、typeof[] 、typeof null 得出的结果均为object
也就是说typeof不能准确判断出对象和数组
2、变量计算---类型转换
- number与字符串拼接时，会发生类型转换：
var a = 100 +10 // 值为110
var b = 100 + “10” // 值为字符串“10010”
- ==运算符时会发生类型转换
100==“100” // true
0 == “” // true
null == undefined // true
双等号要慎用，常用===，因为===不会发生自动数据类型转换
- If语句时发生的类型转换
var a =100;
var b = “”;
If (a) {…} // 这里a是数字类型，值不为0，转换为了布尔类型true
If (b) {…} // 这里b是空字符串，转换为布尔类型是false
- 逻辑运算
10 && 0 // 0
“”|| “abc” // “abc”
！window.abc // true window.abc是undefined，！取反将之转换为布尔值
面试题解答：
1、JS中使用typeof能得到哪些类型
对于值类型，typeof能得到： string number boolean undefined
对于引用类型，typeof能得到：object function
注意： typeof [] 输出为 object
typeof null 输出也为 object
2、 何时使用===，何时使用==
==用于判断值是否相等；===会判断值与类型都是否相等
一般为了保险起见，全部用===，因为使用==的时候会面临自动类型转换的问题，例如：
100==“100”；0==“”；null==undefined 都为true
如果设一个条件语句：if（a==100）{…}，想要判断数值a是否等于100，这时传入一个“100”字符串类型，仍能通过if。 所以为了安全起见，全部用===
下列情况可以使用==：
判断一个对象的某属性是否存在 或者判断一个函数某参数是否存在
if（obj.a == null ）{…}
function（a，b）{
if（ a==null ）{…}
}
obj.a == null 相当于 obj.a === null || obj.a === undefined
当对象obj中的a属性，为值类型的时候定义了却未赋值，或者为引用类型时另其为null，都可以通过if执行某操作
3、JS中有哪些内置函数
Object 、 Function、 Array、 Number、 String、 Boolean 、Date 、RegExp、 Error
内置函数时作为构造函数使用的
（Math、JSON 这些是内置对象）
4、JS变量按照存储方式划分有哪些类型，并描述其特点
分为值类型和引用类型
值类型：变量与值 存于栈内存中，赋值不会互相干涉
引用类型：对引用变量的赋值是指针、地址。两个引用类型变量同指向一个对象，修改对象中的值的时候，两个引用变量会互相干涉。
5、如何理解JSON
一方面，JSON就是一种数据格式，一种特殊格式的字符串
另一方面，JSON在JS中，其实和Math一样，是一个JS内置对象，有两个API
JSON.parse (‘ {“a”:10 , “b”: 20} ’); 将JSON字符串转化为JSON对象
JSON.stringify ({ a : 10 , b : 20 }); 将一个对象转化为JSON格式的字符串
二、原型与原型链
题目：
如何准确判断一个变量是数组类型
写一个原型链继承的例子
描述new一个对象的过程
zepto****框架中是如何使用原型链的
知识点：
1、构造函数
构造函数名首字母一定要大写
function Person(name,age,sex) {
this.name = name;
this.age = age;
this.sex = sex;
}
var per = new Person("小明",20,"男");
2、构造函数-扩展
var a ={} 其实是var a = new Object() 的语法糖
var b= [] 其实是var b=new Array() 的语法糖
function fn(){…} 其实是var fn = new Function(…) 的语法糖
什么是语法糖： 在相同功能下，会让代码更加简洁流畅，更加语义自然的写法。写得很爽，看起来也爽，就像吃了糖一样。
3、原型规则5条
所有的引用类型（数组、对象、函数），都具有对象特性，即可以自由扩展属性
所有的引用类型（数组、对象、函数），都有一个proto属性（隐式原型），属性值是一个对象
所有的函数，都有一个prototype属性（显式原型），属性值也是一个对象
所有的引用类型（数组、对象、函数），proto指向它的构造函数的“prototype”的属性值
获取某引用类型的某属性时，如果对象本身没有此属性，会通过proto，到prototype中找
当遍历实例对象内的属性时，我们希望它只拿到自己的属性，不拿prototype中的属性，就要用hasOwnProperty（）方法，此方法用于判断某属性是自身的属性还是继承来的属性，也可以以判断某属性是否存在。
for(var item in stu){
if (stu.hasOwnProperty( item )) {
console.log( item )
}
}
4、原型链
prototype也是一个对象，prototype自身没有此方法，就去自己的隐式原型proto中找。prototype中的proto指向的是Object构造函数的prototype，这个prototype中也有proto，它指向null。
5、instanceof
用于判断一个引用类型是否属于某构造函数。
他的判断逻辑是：
从此引用的proto一层一层顺着原型链往上找，能否找到对应的prototype
stu instanceof Student //true
stu instanceof Object //true
另外， instanceof 还可以在继承关系中用来判断一个实例是否属于它的父类型。
stu instanceof Person //true
和typeof的用法区别：
Typeof在对值类型number、string 、boolean 、null 、 undefined、 以及引用类型的function的反应是精准的；但是，对于 对象{ }、数组[ ] 和null 都会返回object；
为了弥补这一点，可以通过instanceof来判断某引用属于哪个构造函数，从而判定它的数据类型。
面试题解答：
1、如何准确判断一个变量是数组类型
arr instanceof Array 判断引用arr是否是构造函数Array创建的实例。
也可以使用console.log(Object.prototype.toString.call( [1,2,3,4,5,6,7] ) )
不能用typeof arr ，他会返回object 。
2、写一个原型链继承的例子
比较实用的获取元素设置内容的一个例子
function Query(id) {
this.dom = document.getElementById(id);
}
Query.prototype.html = function(val){
var ele = this.dom;
ele.innerHTML = val;
return this; //用于链式编程
}
Query.prototype.setColor = function(stylevalue){
var ele = this.dom;
ele.style.background = stylevalue;
return this;
}
Query.prototype.on = function(type,fn){
var ele = this.dom;
ele.addEventListener(type,fn);
return this;
}
var div = new Query('app');
div.html("标题").setColor('red').on("click",function(){
this.style.background = "green"
})
3、描述new一个对象的过程
（1）创建一个空对象{ };
（2）把{ }j的隐式原型proto指向Animal的显式原型对象prototype，此时便建立了{ }对象的原型链：obj->Animal.prototype->Object.prototype->null
（3）在{ }的执行环境调用Animal函数并传递参数“cat”。
{ Animal.call(obj ,"cat") }
当这句执行完之后， { }便产生了属性name并赋值为"cat"。
（4）将初始化完毕的新对象地址，保存到等号左边的变量中
4、zepto框架中是如何使用原型链的（慕课网免费课程）
日后学过之后再总结
三、作用域与闭包
题目：
说一下对变量提升的理解
说明this的几种不同的使用场景
创建10个标签，点击的时候弹出对应的序号
如何理解作用域
实际开发中闭包的应用
知识点：
1、执行上下文
console.log(a); //undefined
var a =100;
//变量先调用，后声明赋值，输出undefined，不报错
fn('jack'); //jack 20
function fn(name) {
age = 20;
console.log(name,age)
var age;
}
一段