>[success] # 出现的背景 ~~~ 1.JavaScript每年都有新功能出现，但是使用JS的浏览器却并不是及时同步更新的。同时， 用户也不会经常更新浏览器版本。所以，如果我们需要使用一些JS新功能时，就必须将 新功能的JS代码转换为大部分现代浏览器能运行的JS版本。相对的每年js更新可以分为两个版本 '语法层面'和'api层面'，要将ES6+的JS代码转换为ES5代码。因此语言特性的降级成为刚需。 ~~~ >[success] # '语法' + 'api' ~~~ 1.js 构成部分可以简单理解成'语法' + 'api',在随着es每年更新也增加了很多对应新的'语法' 和 'api' 1.1.语法类型常见的'const', 'let'这类 1.2.'api' 例如'Set'、'Map' 等 2.对应的为了可以在一些不支持的环境去使用这类'语法' 和'api' js的社区大神们也给出一些方案 2.1.'语法'可以通过一些js 编译器，将js语法解析'AST语法树'并且，当我们拿到'ast语法树'的时候 可以对相应的节点做替换，做到语法转换， 如果你看过本册的 'eslint' 章节你将知道常见对js 转换ast 语法几个编译器解析器： 'esprima'、'espree'、'babel-eslint'、'@babel/eslint-parser'、'@typescript-eslint/parser' 以'babel' 为例注意他只是一个js编译器用来转换'ast 语法树的' 当编写代码 'const a = 1' 可能某些运行的 浏览器环境对其'const' 语法不支持，将其通过编译器转成'ast语法树' 这里还是以'babel' 为例如图,注意 'babel'作为解释器目前仅仅是帮我们对其代码解析语法树的 2.2.'api' 和'语法'不同，'api' 是一套完整的方法将某些东西经行处理，例如数组的'concat'他明确是一个处理数组 的方法，和众多第三方解决方式理解思路相同,我们需要引入具备这些功能的api 包，这种包含js 新api 包叫做 'polyfill(垫片/补丁)',常见的这类库例如'es5-shim 、es6-shim、 core-js ' ~~~ * 语法树[生成地址链接](https://astexplorer.net/)  >[info] ## core.js && babel ~~~ 1.因此'core.js' 和 'babel' 是两件东西 1.1.Babel 官方的介绍'Babel is a JavaScript compiler'也就是说'Babel 其实就是一个 JavaScript 的编译器' 1.2.'core.js' 它是JavaScript标准库的 polyfill 2.core-js 又和 Babel 深度绑定，二者其实是两个东西，但又相互彼此的支持可以应用在一起 ~~~ >[info] ## 工具网站 https://esprima.org/demo/parse.html https://astexplorer.net/