TypeScript ｜ 青训营笔记

这是我参与「第五届青训营 」伴学笔记创作活动的第 4 天

一、本堂课重点内容：

1. 什么是TypeScript?
2. 为什么选择TypeScript?
3. 如何用TypeScript?

二、详细知识点介绍：

(1)认识TypeScript

TypeScript 的发展历史:

• 2012-10: 微软发布了 TypeScript 第一个版本 (0.8)
• 2014-10: Angular 发布了基于 TypeScript 的 2.0 版本
• 2015-04:微软发布了 Visual Studio Code
• 2016-05: @types/react 发布，TypeScript 可开发 React
• 2020-09: Vue 发布了 3.0 版本，官方支持 TypeScript
• 2021-11: 4.5版本发布

TypeScript 是由微软开发的一款开源的编程语言，遵循ES6、ES5 规范，TypeScript 是对JavaScript 语法的扩展。

js里本来就有的(基本)类型：number、string、boolean、null、undefined、Symbol

ts里新增的类型：void、any、never、联合、函数、数组类型、类 …

(2)为什么要选择TypeScript?

TypeScript源于JavaScript,JavaScript 只是一个脚本语言并非设计用于开发大型 Web 应用，JavaScript 没有提供类和模块的概念，而 TypeScript** 扩展了** JavaScript 实现了这些特性。

JavaScript与TypeScript的区别:

JavaScript:动态类型 弱类型语言

TypeScript:静态类型 弱类型语言

TypeScript静态类型的优点:

• 可读性增强:基于语法解析TSDoc，ide增强
• 可维护性增强:在编译阶段暴露大部分错误
• 多人合作的大型项目中，获得更好的稳定性和开发效率
• 包含于兼容所有Js特性，支持共存
• 支持渐进式引入与升级

3. 如何用TypeScript?

(1)编译器推荐: Visual Studio Code TypeScript官网在线编译器(编辑器推荐使用vscode，因为vscode对ts的提示非常好)

(2)基本语法:

变量定义

const 变量名: 变量类型 = 初始化值;

举个例子:

const a:string="hello,TypeScript";
console.log(a);

运行结果:

函数定义

function 函数名(参数列表): 返回值类型 {
    函数体 ...
    return 返回值;
}

举个例子:

function Add(x:number,y:number):number{
    return x+y;
}
console.log(Add(2,3));

运行结果:

数组定义:

const arr: number[] = [1, 2, 3, 4, 5, 6, 7, 8, 9, 0];