js的十个小知识

1、闭包

闭包：能够读取其他函数内部变量的函数，闭包是指有权范围另一个函数作用域中变量的函数

闭包特性：函数内再嵌套函数；内部函数可以引用外层的参数和变量；参数和变量不会被垃圾回收机制回收

闭包主要是为了设计私有的方法和变量

2、作用域、自由变量和作用域链

作用域分为全局作用域、函数作用域和块级作用域

自由变量：在当前作用域中查找所需变量，但是该作用域没有这个变量，那这个变量就是自由变量

如果在自己作用域找不到该变量就去父级作用域查找，依次向上级作用域查找，直到访问到window对象就被终止，这一层层的关系就是作用域链

作用域链的作用是保证对执行环境有权访问的所有变量和函数的有序访问，通过作用域链，可以访问到外层环境的变量和函数

3、原型和原型链

每个对象都会在其内部初始化一个属性，就是prototype(原型)

当我们访问一个对象的属性时，如果对象内部不存在这个属性，那么它就会去prototype里找这个属性，prototype又会有自己的prototype，于是一直这样找下去，这就是我们平时说的原型链的概念

4、事件代理（事件委托）

把原本需要绑定的事件委托给父元素，原理：DOM元素的事件冒泡

5、事件模型

W3C中定义事件会经历三个阶段：捕获阶段、目标阶段、冒泡阶段

捕获：父级元素先触发，子级元素后触发

冒泡：子级元素先触发吗，父级元素后触发

阻⽌冒泡：在 W3c 中，使⽤ stopPropagation() ⽅法；在IE下设置 cancelBubble =
true
阻⽌捕获：阻⽌事件的默认⾏为，例如 click后的跳转。在 W3c 中，使⽤
preventDefault() ⽅法，在 IE 下设置 window.event.returnValue = false

6、AJAX

原理：用户 在服务器之间加了一个中间层（AJAX引擎），通过XmlHttpRequest对象来向服务器发异步请求，从服务器获得数据，然后用JavaScript来操作DOM而更新页面，使用户操作与服务器响应异步化

// 创建连接
let xhr=null;
xhr=new XMLHttpRequest();
// 连接服务器
xhr.open('get',url,true);
// 发送请求
xhr.send(null);
// 接收请求
xhr.onreadystatechange=function(){
  if(xhr.readyState==4){
    if(xhr.status==200){
      success(xhr.responseText);
    }else{
      fail&&fail(xhr.status)
    }
  }
}

7、DOM操作

1. 创建新节点
   createDocumentFragment() // 创建一个 DOM 片段
   createElement() // 创建一个具体的元素
   createTextNode() // 创建一个文本节点
2. 添加、移除、替换、插入
   appendChild()
   removeChild()
   replaceChild()
   insertBefore() // 在已有的子节点前插入一个新的子节点
3. 查找
   getElementsByTagName() // 通过标签名称
   getElementsByName() // 通过元素的 Name 属性的值(IE 容错能力较强，会得到一个数组，
   其中包括 id 等于 name 值的)
   getElementById() // 通过元素 Id，唯一性

8、js延迟加载

1. defer 和 async
2. 动态创建 DOM 方式（创建 script，插入到 DOM 中，加载完毕后 callBack）
3. 按需异步载入 js

9、BOM对象

1、window 对象 ，是 JS 的最顶层对象，其他的 BOM 对象都是 window 对象的 属性；

2、document 对象，文档对象；

3、location 对象，浏览器当前 URL 信息；

4、navigator 对象，浏览器本身信息；

5、screen 对象，客户端屏幕信息；

6、history 对象，浏览器访问历史信息；

10、let、const、var的区别

1、let和const具有块级作用域

2、var会变量提升

3、var给全局添加属性

4、var可以重复声明，后声明的会覆盖之前的

5、暂时性死区：使用let、const命令声明变量之前，该变量式不可用的

6、const必须设置初始值，const不允许改变指针的指向