TypeScript的初认识

概述

JavaScript概述

• 是一种运行在客户端中的编辑语言;
• 它的运行环境有 浏览器 和node.js ;
• 当应用于浏览器时, 为网站提高动态交互特性,让网页"动"起来;
• node.js让js摆脱了浏览器的束缚,可以实现服务端/桌面端等;

TypeScript概述

• 是JavaScript的超集,支持es6标准;
• TypeScript = type + JavaScript;
• TypeScript 是微软开发的自由的开源编程语言
• 它的设计目标是 开发大型应用, 可以再任何浏览器,任何计算机,任何操作系统上运行

---

TypeScript特点

• 类型思维方式,使得开发更严谨, 提前发现错误 , bug更少
• 提高了代码可读性, 使维护和重构代码更容易
• 补充了js缺失的功能
• 更友好
• 增加开发的幸福感

---

语言特性

typeScript 是一种给 JavaScript 添加特性的语言扩展.

增加的功能有: 类型批注和编译时类型检查, 类型推断, 类型擦除, 接口, 枚举, mixin, 泛型编程, 名字空间, 元组, await

---

安装解析TS的工具包

原因

• node.js/浏览器 , 只认识JS代码, 不认识TS代码
• 需要先将TS代码转化为JS, 然后可以再node.js/浏览器中运行了

安装

1. 在vscode的终端里面输入 npm i -g typescript命令来全局安装解析TS的工具包;
2. 然后在终端输入 tsc -v 来查看版本号

---

第一个TS文件

第一种方法

1. 在文件夹中 创建一个index.ts文件

2. 在这个index.ts中写入代码console.log("Hello TS");

   注意: TS代码不能直接在node.js里面运行

3. 然后在当前目录打开终端,输入命令 tsc index.ts,然后回车就生成了一个index.js文件

4. 接着在终端输入 node index.js命令来执行这个js文件中的代码

简化的方法

1. 在终端输入 npm i -g ts-node 命令安装
2. 修改完ts文件里面的内容后,直接在终端输入 ts-node index.ts 命令来执行

更方便的方法

1. tsc --watch index.ts

   解释: --watch表示启用监听模式,只要重新保存了ts文件就会自动调用tsc将ts转化为js

---

注释

概念:

是对代码的解释说明,用来帮助阅读和理解代码

注意: 注释的内容是不会执行的.

推荐在写代码时,添加代码注释,增加代码的可读性

两种形式: 单行注释 和 多行注释

• 单行注释

  // 两个斜线,表示单行注释,只能注释这一行内容

  // 快捷键: ctrl + /

• 多行注释

  /*

  ​ 多行注释, 可以注释多行内容

  ​ 快捷键: shift + alt + a

  */

---

输出语句

作用

在终端中打印信息

代码

console.log()

---

变量

概念