前端
2021-12-20
2021-12-20
在原则产问题上,要坚定如磐石;在兴趣问题上,则要顺应潮流。——美国
官方文档:https://www.typescriptlang.org/docs/handbook/typescript-in-5-minutes.html
中文文档:https://www.tslang.cn/docs/handbook/typescript-in-5-minutes.html
下载VScode
:https://visualstudio.microsoft.com/zh-hans/
安装后打开
新建文件
选择语言
写下代码
1 | function greeter(person) { |
顺手安个中文
重启后,我们打开控制台
然后安装typescript
1 | cnpm install -g typescript |
编译ts
文件:
1 | tsc D:\file\projects\hello-typescript\hello-typescript.ts |
我们打开目录:
信任项目,然后可以看到我们编译后的js
看到和ts
一模一样,这说明js
代码在ts
中是支持的
typescript
的一大特性就是它是强类型语言,例如下面这段代码:
1 | function greeter(person: string) { |
我们编译一下,可以看到我们这里指定了person
为string
类型,我们传入了字符串Jane User
,确实可以成功编译,那我们试试传入一个数组呢?
1 | function greeter(person: string) { |
可以看到报了一个错
提示类型错误
但我们的ts
还是成功被编译了,所以就算你的代码里有错误,你仍然可以使用TypeScript
下面试试接口
1 | interface Person { |
此处我们用interface
定义了一个接口Person
因此我们需要传入Person
结构的对象,当然我们也可以用implements
实现该接口
1 | interface Person { |
我们可以在构造参数的变量上加public
,等同于创建了同名的成员变量
1 | class Student { |
我们可以把它编译后的js
引入到一个html
中运行,或者直接使用vscode
运行