走进“前端的未来”TS——了解TS的工作流程
文章简介
本文是我在学习TS课程中，对于TS工作流程相关知识的整理。学习TS，我们必须要了解TS是如何工作的，它的工作流程是怎样的。在文章中，我会一步步带着看到本文的小伙伴们了解TS的工作流程。内容详细！值得学习！
主要内容
1 TypeScript工作流程
1.1 图示+简单解释
简单解释：写好TS代码 => 用tsc编译器编译为JS => 由浏览器调用并执行JS文件
1.2 理顺区分JS与其他语言
JavaScript的名字想必大家一定都很熟悉，但是在后续学习中，可能会碰到很多稀奇古怪的名字。比如ES6，ECMAScript，ES，ES7/8等等。
这个时候，我们只需要搞清楚这些名词之间的关系就可以了。
JavaScript命名梳理：（也可参照下图）
- 其实这么多的名词，都是在描述同一个语言——JavaScript。
- ECMAScript简称ES，后面的数字是为了区分版本。
- JavaScript与Java没有任何关系。
当时发明JavaScript这门语言时，用当时最流行的语言——Java作为命名。
JavaScript版本梳理： - ES3、ES5支持目前所有的主流浏览器，能够在浏览器上无障碍运行。
- ES6其实就是ES2015（往后的版本ES7就是ES2016…以此类推ES11就是ES2022）。但是ES6目前在浏览器不支持，但未来一定会支持。（所以ES6的运行也必须要通过Babel来转化为ES5或者ES3）
- ES6这个版本可以说是颠覆性的改版，第一次从语言层面上真正开始支持面对对象，同时还吸收了TS的特性，支持const和let两个关键词，并且引入了模块的概念。
ES6相关内容可以参考ECMAScript6专栏的内容。
点击直接进入ECMAScript6专栏
2 如何用TypeScript运行web
2.1 为项目添加html文件
为了让js/ts类型的文件在浏览器中运行，就得在项目中创建html文件。这里命名为index.html
用vs code创建快捷模板——在文件中输入html，选择:5，vs code会自动生成html项目模板。
- html部分
<!DOCTYPE html>
最低0.47元/天 解锁文章
扫一扫
5701
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
