theme: fancy

对ts的基本认识

A ts是未来的发展语言，为什么这么说，因为Google的Angular、vue源码、React、微信小程序都开始采用这个语言，这足以看出这个语言的重要性

ts的特点：类型系统和完整的面向对象编程，关于这2点我只有后续的学习再去体会了。

ts的包含了es567，可见ts是js的超集，js学的好，ts可能上手更快吧🍿

搭建ts的环境

ts新增的类型和面向对象的方式，浏览器和node.js是不会识别和执行的，因为浏览器和node.js只能运行js代码

这个时候就需要一个工具将ts转成浏览器和node.js能识别的代码，这个工具就是ts环境

所以需要全局安装

npm install -g typescript

检验安装

tsc -v

浏览器和node.js 运行ts程序

浏览器

// 01-hello.ts
function sayHi(name: string): void {
console.log('hi' + name)
}
let myName: string = 'kvon'
sayHi(myName)

新建一个html文件，引入ts文件，发现控制台会报错，是无法处理这个ts中的代码的，所以需要翻译一步

tsc 01-hello.ts

这个时候会自动生成一个js文件

// 01-hello.js
function sayHi(name) {
    console.log('hi' + name);
}
var myName = 'kvon';
sayHi(myName);

这个时候我们html文件引入的是js文件，而不是ts，控制台也按照预期输出了

node.js

在浏览器运行ts的操作，已经完成了，接下来处理在node.js环境下运行ts

直接运行node 01-hello.ts 是会报错的

但是每次使用tsc去编译就很麻烦。这个时候我们就需要一个插件可以帮我们自动翻译

npm i -g ts-node

之后直接运行ts-node 01-hello.ts就可以在控制台输出值了

但是我在操作这步的时候，遇到了bug 报错

Error: Cannot find module '@types/node/package.json........'

解决方案：

npm install -g tslib @types/node

学习文件目录：