DOM特殊元素获取
document.documentElement //HTML标签
document.head //head标签
document.title //title标签
document.body //body标签
typeof 的那些坑
typeof null 返回Object， 然而null是基本类型值而不是引用类型值，null == null 是成立的。
typeof NaN 返回number，NaN是一个自身不等于自身的数值类型。
typeof Symbol 返回function。
平稳退化和逐渐增强
平稳退化：可让访问者的浏览器在不支持JS的情况下仍能顺利地浏览网站。
逐渐增强：用一些额外的信息层去包裹原始数据，用css，js去包裹html结构。
按照逐渐增强的原则创建出来的网页几乎都符合平稳退化原则。
性能考虑
- 尽量减少访问DOM和标记。查询DOM中的某个元素都会搜索整个DOM树，因此最好将搜索结果保存在变量中后续操作使用。从源头上减少html元素节点以减小DOM树规模也是一点。
- 合并和放置脚本。合并多个脚本为一的原因可以减少加载页面时的请求数量，这是性能优化时首先需要考虑的。合理放置脚本（把script标签置于/body标记前，可先让其他文件并行加载，并在加载JS脚本时window对象的onload事件依然可以执行对文档进行各种操作）。
- 压缩脚本。删除空格注释，用短小的变量函数名替代，以达到精简脚本大小的目的。
var,let 和 const的区别
var 属于ES5的关键词，有变量提升作用，不存在块级作用域，因此容易出现被添加到在外部环境的问题。可以重复声明。在全局环境下声明一个变量会成为顶层对象的属性。
let和const属于ES6的关键词，无变量提升，存在TDZ，存在块级作用域，不可以重复声明。在全局环境下声明不会成为顶层对象的属性。
其中const声明常量，需要在声明的同时赋值，并且变量的值之后不能改变。
HTML元素的动态获取和静态获取
-
动态获取: 获取的变量是一组元素,当其中一个发生改变,第二次操作这组元素时,就会从新获取一次,不在计算改变的那一个 。讲白了就是根据特点的特征来捕获，只要你是美女不管你是不是化了妆都会被选上。
getElementsByClassName/TagName/Name
-
静态获取：获取之后,就制定某一个对象或者节点,和节点的任何变化都没有关系 。讲白了就是就算你改了名整了容，化成灰我都认得你。
getElementsById/querySelector/querySelectorAll
this的指向问题
默认绑定
-
在全局环境或是函数自执行情况下，this指向全局变量window
-
被作为某个对象的方法调用时候，this指向那个对象
-
被嵌套的函数独立调用时this指向window
var a = 0;
var obj = {
a : 2,
foo:function(){
function test(){
console.log(this.a);
}
test();
}
}
obj.foo(); //window
- 闭包中里面函数独立调用,而不是方法调用,this默认绑定到window
隐式绑定
- 一般被直接对象所包含的函数调用时,也称之为方法调用,this隐式绑定到该直接对象
function fun(){
console.log(this.a);
};
var obj1 = {
a : 1,
foo:fun,
obj2:{
a : 2,
foo :fun
}
}
obj1.foo();//1
obj1.obj2.foo();//2
箭头函数
- 箭头函数没有自己的 this，当在内部使用了 this时，它会指向最近一层作用域内的 this
严格模式
- 严格模式下this指向顶层对象window
还有一些奇葩操作。。。
object.getName和（object.getName）定义是相同的，所以返回'My Object'没有问题
(object.getName = object.getName)这里括号内进行了赋值操作，而这个值是函数本身。再赋值完毕后再调用了自身，所以当作函数自执行返回的是全局变量中的name属性。
var name = 'The window';
var object = {
name : 'My Object',
getName : function(){
return this.name;
}
};
object.getName(); //'My Object'
(object.getName)(); //'My Object'
(object.getName = object.getName)(); //'The window'
DOM节点css样式对象的读取
IE：node.currentStyle
非IE： getComputedStyle(node)
兼容: function getCSS(node){ return node.currentStyle || getComputedStyle(node);}