HarmonyOS4.0 TypeScript基础

一、TypeScript概述

https://www.tslang.cn/index.html

TypeScript是JavaScript类型的超集，可以编译成纯JavaScript，TypeScript可以在任何浏览器、任何计算机和任何操作系统上运行，并且是开源的

JavaScript和TypeScript区别？

1. 类型系统
   1. JavaScript是一种动态类型语言，变量可以随时赋值不同的类型，而TypeScript是一种静态类型语言，它需要在编译时明确声明变量的类型，这种类型检查可以减少代码中的错误，并提高代码的可读性和可维护性
2. 执行环境
   1. JavaScript可以在浏览器和服务器端执行，而TypeScript需要在编译为JavaScript后才能执行
3. 代码结构
   1. TypeScript扩展了JavaScript，添加了类、接口、命名空间等概念，使代码结构更加清晰和易于组织
4. 开发体验
   1. TypeScript具有更好的开发工具支持，例如代码自动补全、错误提示等功能，这些功能可以大大提高开发效率

总结：TypeScript相对于JavaScript更加安全、稳定、易于维护和开发，但在学习和使用上需要花费更多的时间和精力，而JavaScript更加简单易用，适合快速开发小型项目

二、安装TypeScript

1、练习场

可以采用typescript给我们提供的练习场。

https://www.typescriptlang.org/play?#code/DYUwLgBArgziBOA7AhgWxALhmeBLRA5hALwQBEyAJqvmQNwBQAxgPaIwugB0wLBAFLAQp0ASjpA

2、编辑器

TypeScript最大的优势之一是增强了编辑器和IDE的功能，包括代码补全、接口提示、跳转到定义、重构等。 主流的编辑器都支持TypeScript，推荐使用VSCode，它是一款开源、跨终端的轻量级编辑器，内置了对TypeScript的支持，本身也是用TypeScript编写的 通过命令行工具运行ts比较繁琐。

2.1、下载

下载typescript

npm install typescript -g

编译TypeScript文件

tsc demo.ts

对demo.ts文件进行编译，生成demo.js文件

运行JavaScript文件

node demo.js

2.2、VSCode自动化编译TS

初始化项目

通过tsc命令对项目进行初始化，生成tsconfig.json

tsc --init

更改配置

更改自动化编译后输出的js文件地址及严格模式

运行任务

运行任务监视TS文件，自动编译

vscode终端>>>运行任务>>>显示所有任务>>>tsc:监视 - ts/tsconfig.json

2.3、VSCode直接运行TS

安装插件

这个时候文件上会有运行的按钮

安装ts包

npm i ts-node @types/node@* -g

运行ts

扩展

如果不想点击按钮运行，想要通过命令直接运行ts，那么通过ts-node

ts-node demo.ts

四、TypeScript入门程序

创建hello.ts文件

编写代码

声明变量

let userName:string = "admin";
console.log(userName);

编译TS文件

tsc hello.ts

编译ts文件，会生成hello.js文件

var userName = "admin";
console.log(userName);
文件**

```PowerShell
tsc hello.ts

编译ts文件，会生成hello.js文件

var userName = "admin";
console.log(userName);