core.js && babel 初识

155 阅读2分钟

出现的背景

1.JavaScript每年都有新功能出现,但是使用JS的浏览器却并不是及时同步更新的。同时,
  用户也不会经常更新浏览器版本。所以,如果我们需要使用一些JS新功能时,就必须将
  新功能的JS代码转换为大部分现代浏览器能运行的JS版本。相对的每年js更新可以分为两个版本
  '语法层面''api层面',要将ES6+的JS代码转换为ES5代码。因此语言特性的降级成为刚需。

'语法' + '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 '

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 深度绑定,二者其实是两个东西,但又相互彼此的支持可以应用在一起