词法作用域和动态作用域
作用域：
- 作用域是指程序源代码中定义变量的区域；作用域规定了如何查找变量，也就是确定当前执行代码对变量的访问权限；
- JavaScript 采用词法作用域(lexical scoping)，也就是静态作用域。
词法作用域
函数的作用域在函数定义的时候就决定了。JavaScript 采用的是词法作用域。
动态作用域
函数的作用域是在函数调用的时候才决定
例子：
var name ="logic"
function getName(){
return name;
}
function getNameWrap(){
var name = 'wind'
return getName()
}
console.log(getNameWrap()) // 输出 logic 。因为 JavaScript 是词法作用域，在函数定义时就确定了变量的访问。
作用域链
定义：当查找变量的时候，会先从当前上下文的变量查找，如果没有找到，就从父级（词法层面的父级）执行上下文的变量对象查找，一直找到全局上下文的变量对象，也就是全局对象。由多个执行上下文的变量对象构成的链，就是作用域链。
作用：保证对执行环境有权访问的所有变量和函数的有序访问
js执行上下文和执行上下文栈
执行上下文
概念：当 JavaScript 代码执行一段可执行代码(executable code)时，会创建对应的执行上下文(execution context)
执行上下有三个重要属性(也就是前面 3 题所说的内容) ：变量对象；作用域链；this
执行上下文栈
每个函数都会创建执行上下文，执行上下文栈（Execution context stack，ECS）就是 JavaScript 引擎创建出来管理执行上下文的
执行上下文栈是有全局上下文初始化，由于执行代码首先是全局代码。全局上下文永远在执行上下文栈中的最底下，只有等程序关闭才释放。
函数声明和函数表达式的区别
f1: 声明式创建的函数 f1 可以在 f1 定义之前就进行调用；
f2: 函数表达式创建的函数 f2 不能在 f2 被赋值之前进行调用
出现这个陷阱的本质原因体现在这两种类型在Javascript function hoisting(函数提升）和运行时机（解析时/运行时）上的差异。
函数声明在JS解析时进行函数提升，因此在同一个作用域内，不管函数声明在哪里定义，该函数都可以进行调用
函数表达式的值是在JS运行时确定，并且在表达式赋值完成后，该函数才能调用。
this 几种不同场景的取值
显示绑定
call，apply，bind可以显示的修改this的指向
隐式绑定
- 全局上下文：this 指向 window,严格模式下为 undefined
- 直接调用函数：this 指向 window,严格模式下为 undefined
- 作为对象的方法调用：那个对象调用，this指向那个对象；obj.foo()。 this 指向对象 obj
- DOM 事件的绑定：onclick和addEventerListener中 this 默认指向绑定事件的元素；
setTimeout的函数内this是window(非严格模式下) - new 构造函数绑定：构造函数中的 this 指向实例对象
- 箭头函数：
箭头函数没有 this, 因此也不能绑定
在箭头函数里的 this 会指向 外层的非箭头函数的 this。
闭包
当函数可以记住并访问所在的词法作用域时，就产生了闭包，即使函数是在当前词法作用域之外执行（通俗一点： 即使创建它的上下文已经销毁，它仍然存在（比如，内部函数从父函数中返回） 在代码中引用了自由变量）
通过例子来了解闭包
例子1：
function fn1() {
var name = 'iceman';
function fn2() {
console.log(name);
}
return fn2;
}
var fn3 = fn1();
fn3();
正常来说，当fn1函数执行完毕之后，其作用域是会被销毁的，然后垃圾回收器会释放那段内存空间。而闭包却很神奇的将fn1的作用域存活了下来，fn2的词法作用域能访问fn1的作用域。fn2依然持有该作用域的引用，这个引用就是闭包。
总结：某个函数在定义时的词法作用域之外的地方被调用，闭包可以使该函数极限访问定义时的词法作用域
例子2：
function waitSomeTime(msg, time) {
setTimeout(function () {
console.log(msg)
}, time);
}
waitSomeTime('hello', 1000);
定时器中有一个匿名函数，该匿名函数就有涵盖waitSomeTime函数作用域的闭包，因此当1秒之后，该匿名函数能输出msg
例子3：
for (var i = 1; i <= 10; i++) {
setTimeout(function () {
console.log(i);
}, 1000);
}
// 输出了 10个 11
i是声明在全局作用中的，定时器中的匿名函数也是执行在全局作用域中，那当然是每次都输出11了。
解决方案:我们可以让i在每次迭代的时候，都产生一个私有的作用域，在这个私有的作用域中保存当前i的值。
for (var i = 1; i <= 10; i++) {
(function (j) {
setTimeout(function () {
console.log(j);
}, 1000);
})(i);
}
闭包的应用场景
https://juejin.im/post/5d7747185188254dc43a610a
https://juejin.im/post/5d50c6ef6fb9a06b1d21358d
什么是堆栈溢出？什么是内存泄漏？那些操作会造成内存泄漏？怎么样防止内存泄漏？
堆栈溢出：代码执行前都会进行编译和创建执行上下文。而管理执行上下文的叫做执行上下文栈。栈有个特点就是后进先出。同时执行上下文栈是有大小限制的。当执行上下文栈大小超过限制就会产生栈溢出错误。经常发生在递归中。
内存泄漏：JavaScript是在创建变量（对象，字符串等）时自动进行了分配内存，并且在不使用它们时“自动”释放。 释放的过程称为垃圾回收。不在使用，没有释放的内存，称为内存泄漏
造成内存泄漏的原因：闭包，意外的全局变量，循环（在两个对象彼此引用且彼此保留时，就会产生一个循环），脱离 DOM 的引用
示例：
// 意外全局变量
function foo(arg) {
bar = "this is a hidden global variable";
}
// 脱离 DOM 的引用
const button = document.getElementById('button');
document.body.removeChild(button);
// 此时，仍旧存在一个全局的 #button 的引用,button 元素仍旧在内存中，不能被 GC 回收。
// 闭包
(function (){
let num = 1;
return function add(a,b){
return a+b;
}
})()
如何处理循环的异步操作
先上一段代码
function getMoney(){
var money=[100,200,300]
for( let i=0; i<money.length; i++){
compute.exec().then(()=>{
console.log(money[i])
//alert(i)
})
}
}
//compute.exec()这是个异步方法,在里面处理一些实际业务
//这时候打印出来的很可能就是300,300,300（因为异步for循环还没有等异步操作返回Promise对象过来i值已经改变）
正确处理思路
关键字async/await async告诉getMoney方法里面存在异步的操作，await放在具体异步操作（方法）前面，意思是等待该异步返回Promise才会继续后面的操作
async function getMoney(){
var money=[100,200,300]
for( let i=0; i<money.length; i++){
await compute.exec().then(()=>{
console.log(money[i])
//alert(i)
})
}
}
另外一种处理思路：使用递归
用递归来实现自我循环（具体循环在then里面，可以确保前面的compute.exec()的异步操作完成）.then()是返回了Promise对象为resolve后才进行的（可以了解一下Promise对象）
function getMoney(i) {
var money=[100,200,300]
compute.exec().then(() => {
if ( i < money.length ) {
console.log(money[i]);
i++;
getMoney(i);
}
});
}
getMoney(0);//开始调用
网友评论