虽然早有准备,但还是被无情按在地上摩擦摩擦

作用域

作用域是指程序源代码中定义变量的区域。
作用域规定了如何查找变量,也就是确定当前执行代码对变量的访问权限
JavaScript 采用词法作用域(lexical scoping),也就是静态作用域

词法作用域(需要安静的理解下)

词法作用域就是定义在词法阶段的作用域。换句话说,词法作用域是由你在写代码时将变量和块作用域写在哪里来决定的,不是在执行它们的作用域里运行,因此当词法分析器处理代码时会保持作用域不变(大部分情况下是这样的)。而JavaScript采用的就是词法作用域,也称为静态作用域
词法作用域意味着作用域是由书写代码时函数声明的位置来决定的。编译的词法分析阶段基本能够完全知道全部标识符在哪里以及如何声明的,从而能够预测在执行过程中如何对他们进行查找

因为 JavaScript 采用的是词法作用域,函数的作用域在函数定义的时候就决定了。

而与词法作用域相对的是动态作用域,函数的作用域是在函数调用的时候才决定的。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
var name = 'Mr.Han';
function test(){
alert(name);//undefined
var name = 'Mrs.Han';
alert(name);//'Mrs.Han'
}
test();

var value = 1;
function foo() {
console.log(value);
}

function bar() {
var value = 2;
foo();
}

bar();//1
  • 假设JavaScript采用静态作用域,让我们分析下执行过程:

执行 foo 函数,先从 foo 函数内部查找是否有局部变量 value,如果没有,就根据书写的位置,查找上面一层的代码,也就是 value 等于 1,所以结果会打印 1。

假设JavaScript采用动态作用域,让我们分析下执行过程:

执行 foo 函数,依然是从 foo 函数内部查找是否有局部变量 value。如果没有,就从调用函数的作用域,也就是 bar 函数内部查找 value 变量,所以结果会打印 2。

前面我们已经说了,JavaScript采用的是静态作用域,所以这个例子的结果是 1。

闭包特性

事件委托

利用js计算,最后一次性修改DOM,大大减少DOM交互,减少回流和重绘,提升网页性能,还能减少内存占用,使用事件委托,只要对元素的父级指定事件处理函数即可

事件委托原理

依赖事件冒泡原理实现的,事件冒泡指的是事件会从最深的节点处开始逐步往上传播事件,由于有这样的机制,我们可以只给最外面的元素添加事件,当内层的标签触发了某个事件,该事件会通过事件冒泡传播到最外层标签,从而触发真正的事件处理函数。这也就是事件委托的过程,子元素委托父级元素代为执行事件。

如何阻止冒泡 && 取消默认事件

w3c是event.stopPropagation,IE则是event.cancelBulle,事件的一个方法,作用是阻止目标元素的事件冒泡,但是不会阻止事件的默认行为,

W3c是event.preventDefault,IE则是event.rerturnValuee = false, 作用是取消一个目标元素的默认行为。只有元素本身有默认行为取消才有意义,什么元素具有默认行为呢?
比如 提交按钮