JavaScript几个重要概念

1、执行上下文：JavaScript代码被解析和执行时所在环境。

全局执行上下文：只有一个，this指向浏览器全局对象window

函数执行上下文：无数个，只有在函数被调用后才会被创建，每调用一次函数都会创建一个新的

变量对象：在函数被调用，但未执行的时刻被创建。定义了执行上下文的所有变量、函数、函数参数列表，函数执行后变量对象会变成活动对象AO

2、变量：基本类型（Null、Undefined、Number、String、Boolean、Symbol，内存大小固定，保存在栈-后进先出-内存中）和引用类型（内存大小不固定，保存在堆内存中，查询时先从栈中读取访问地址，然后通过地址找到堆中的值）

3、异步：不会阻塞主线程，会被放到队列（先进先出）中，等待主线程的代码全部执行完才会执行

回调事件、事件监听、发布/订阅、promise/async

4、事件循环(event loop)：在一次事件循环中，首先会执行宏任务，然后执行微任务列表，列表为空后执行下一个宏任务。

5、原型链：JavaScript对象都有自己的原型对象，通过__proto__指向原型prototype，原型有可能还有自己的原型，最终指向为null

6、作用域链：在查找某个变量的时候，如果在当前函数作用域内没有找到，就去上层作用域找，直到全局

7、闭包：闭包函数的外层函数调用后出栈，他的活动对象AO正常会被JavaScript的垃圾回收机制回收，但由于被闭包函数的作用域链牵引着，导致无法被释放，闭包函数即可以通过作用域链访问到变量（保存在堆当中）

8、事件流：捕获事件流从根节点开始执行，一直往子节点开始查找，直到找到目标节点，及处于目标节点阶段；事件冒泡从目标节点开始查找执行，直到根节点；事件委托即利用冒泡

9、this:指向最后调用函数的对象，闭包函数从外层函数作用域来继承this，可以通过return this实现链式操作

class testOn {
    constructor() {}
    on() {
        return this
    }
}
new testOn.on().on()..

10、bind：创建一个函数，调用时this绑定第一个参数，传入bind方法的第二个以及以后的参数加上绑定函数运行时本身的参数按照顺序作为原函数的参数来调用原函数，最后返回一个绑定上下文的函数（可以通过new创建实例）call/apply则直接执行了函数

11、构造函数:通过new（创建一个空对象，将对象的__proto__属性指向构造函数的原型prototype，绑定this实现继承，使其可以访问构造函数的属性）来生成实例的函数

function mynew() {
    let arg = Array.from(arguments), con = arg.shift()
    let result = Object.create(con.prototype)
    con.apply(result, arg)
    return result
}

12、内存泄漏：全局变量（use strict）、脱离dom的引用、闭包、事件监听/回调函数、定时器，页面销毁前将其移除

window.removeEventListener(handle, fn, false)   // 要移除事件的引用
clearTimeout(timer)

13、防抖：定义一段时间，如果某事件在这段时间内触发多次，会重置时间，直到这段时间内再不触发为止，通过闭包解决

debounce() {
                let time = null
                return () => {
                    clearTimeout(time)
                    time = setTimeout(() => {
                        overlayEcharts.resize()
                    }, 500)
                }
            }
window.addEventListener('resize', debounce())

14、节流：定义一段时间，如果某事件在这段时间内触发多次，只会触发第一次，通过闭包解决

function throttle(fn) {
      let canRun = true;
      return function () {
        if (!canRun) return;
        canRun = false; 
        setTimeout(() => {
          fn.apply(this, arguments);
          canRun = true;
        }, 500);
      };
    }
    function sayHi(e) {
      console.log(e.target.innerWidth, e.target.innerHeight);
    }
    window.addEventListener('resize', throttle(sayHi));

15、浏览器渲染页面过程：render进程解析css tree和dom tree，解析dom tree是自上而下的，css tree是异步加载的（通常会把link标签放在页面顶部，因为css在加载的过程中会影响render tree的生成，进而影响layout，所以要使两者尽可能并行，加快render tree的生成速度）遇到link、script、img等标签，浏览器会下载这些内容，遇到缓存的使用缓存，否则重新下载（js脚本应放在页面底部，因为js线程与渲染进程是互斥的，下载执行js的时候，会影响渲染线程绘制页面，而js的作用是处理页面交互，所以要保证页面绘制出来）

16、数据类型判断

1、typeof可以判断基本数据类型，无法判断null和对象的具体类型
2、Object.prototype.toString.call
   不可以使用Object.toString，因为要使用原型链终点的方法。Array，Function，Date也不可以，虽然他 
   们是通过Object创建的，但也是继承Object.toString
3、instanceof可以判断对象类型，无法判断基本类型
4、Array.isArray判断数组类型
5、constructor.name 无法判断null、undefined