电话约建设网站 客户不用模板 网站
【TypeScript】TS入门级基础学习（一）
一、前言
TypeScript 是一种用于应用程序规模的 JavaScript 语言。 TypeScript 向 JavaScript 添加了可选类型，支持用于任何浏览器、任何主机、任何操作系统的大规模 JavaScript 应用程序的工具。
TypeScript 可编译为可读的、基于标准的 JavaScript。TypeScript属于强类型语言，JavaScript属于弱类型语言，强类型语言支持静态语言和动态语言，弱类型语言支持动态语言。
这里是TypeScript官方仓库 TypeScript ,有兴趣的可以更深层次了解其本质。
二、基本概念
1.强类型语言和弱类型语言
- 强类型语言：强类型语言不允许改变变量的数据类型，除非进行强制类型转换。比如C++、Java、C#。
- 弱类型语言：定义与强类型语言相反，一个变量可以被赋予不同数据类型的值。PHP、Ruby、Python。
2.动态语言和静态语言
- 静态语言：编译时确定变量的数据类型，运行期间不可以改变其结构，比如C++、Java、C#。
- 动态语言：运行时才确定数据结构和类型，变量使用之前不需要类型声明，比如：JavaScript、PHP、Ruby、Python。
三、TypeScript与JavaScript的区别
| TypeScript | JavaScript |
|---|---|
| 强类型语言，支持动态语言和静态语言 | 弱类型语言，支持动态语言 |
| 用于解决大型项目的代码复杂性 | 脚本语言，创建动态网页 |
| 可以在编译期间发现并纠正错误 | 只能在运行时发现错误 |
| 先被浏览器编译成js语言 | 在浏览器可以直接使用 |
| 支持模块、泛型、接口 | 不支持模块、泛型、接口 |
四、环境搭建及演练准备
对于TypeScript，不能像JavaScript直接在浏览器可以运行，因此我们需要安装编译环境，有两种方案进行练习与演练，其一就是直接安装到本地练习，另一种就是使用官方提供的在线环境进行演练。
4.1 安装到本地
- 安装
yarn add typescript -g 或者 npm install typescript -g - 查看版本
tsc -V
-
编译ts文件，编译后生成以ts结尾的文件
tsc xxx.ts
我们创建 hellowworld.ts , 添加内容如下，针对 userName 进行了类型定义，定义为基本数据类型string， 然后通过 tsc 命令进行编译，编译成浏览器可直接运行的代码
var userName:string = '我是suwu150';console.log(userName);
编译后，能够发现在同文件夹下生成同名JavaScript代码 hellowworld.js ，其内容是编译之后的JavaScript代码，可直接在浏览器运行。
var userName = '我是suwu150';console.log(userName);
4.2 在线运行
这个是官方提供的一个在线演练的环境，后面有很多演练的例子，我们会在此基础上进行演示
官方在线演示环境的地址： https://www.typescriptlang.org/play/
同样的，我们将 TypeScript 代码编写到左侧编辑器，能够同步在右侧看到编译之后的结果
var userName:string = '我是suwu150';console.log(userName);
编译后结果
以上就是TypeScript基础知识及环境准备。希望喜欢的同学能够点赞关注。
