TypeScript 入门 | 青训营笔记

这是我参与「第四届青训营 」笔记创作活动的的第9天。

今天简单入门一下TypeScript

感兴趣的可以看看我之前的文章：红包算法之如何助你抢到大红包 | 青训营笔记 - 掘金 (juejin.cn)

TypeScript

• TypeScript是JavaScript的超集，静态类型和面向对象编程
• TypeScript适合大型应用或者多人协作

对于JavaScript来说，TypeScript更适合变成应用程序，并且跨平台、开源，在Vue、Node、React中都可以使用TypeScript。

环境配置

npm install typescript -g tsc 
--init 初始化 
npm install @types/node --dev-save

TypeScript基础类型

• Number

// ES5：var count = 10;
let count: number = 10; 

• Boolean

// ES5：var isDone = false;
let isDone: boolean = false;

• String

// ES5：var name = 'Semlinker';
let name: string = "Semliker";

• Array

let list: number[] = [1, 2, 3]; // ES5：var list = [1,2,3]; let list: Array<number> = [1, 2, 3]; // Array<number>泛型语法 // ES5：var list = [1,2,3];

• 其他

类型	例子	描述
number	1,-33,2.5	任意数字
string	'hi',"hi"	任意字符串
boolean	true,false	布尔值
字面量	其本身	限制变量的值就是该字面量的值
any	*	任意类型
unknown	*	类型安全的any
void	空值(undefined)	没有值(或undefined)
never	没有值	不能是任何值
object	{name:'小明'}	任意的JS对象
array	[1,2,3]	任意JS数组
tuple	[4,5]	元素，TS新增类型，固定长度数组
enum	enum{A,B}	枚举，TS中新增类型

函数的三种声明方式

• 函数声明法

  // 最常用 
function add( n1:number, n2:number ): number{
    return n1 + n2 
} 
console.log( add( 1, 2 ) )

• 函数表达式法

var add = function( n1:number, n2:number ): number{
    return n1 + n2 
} 
console.log( add( 1, 2 ) )

• 箭头函数声明

// 箭头函数声明
var add = (n1:number,n2:number):number =>{
    return n1 + n2 
}
console.log(add(1,5))

• 日期声明

// 不传递任何参数
let d:Date = new Date()
console.log(d)
// 传递一个整数 
let d1:Date = new Date(1000) // 1970-01-01 00:00:00 
let d2:Date = new Date(2000) // 1970-01-01 00:00:00 
console.log(d1) 
console.log(d2) 
// 传递一个字符串 
let d3:Date = new Date('2020/08/24 00:00:00') 
let d4:Date = new Date('2020-08-24 00:00:00')
console.log(d3) 
console.log(d4)

• 正则表达式

// 正则表达式 
// RegExp 
// 构造函数声明法 
let reg1:RegExp = new RegExp('Joseph') 
console.log(reg1) 
let reg2:RegExp = new RegExp('Joseph','Elas') 
console.log(reg2) 

// 字面量声明 
let reg3:RegExp = /joseph/i 
let reg4:RegExp = /joseph/Elas 

// 两个常用的方法 
// test(string) -- 返回true\false 
// exec(string ) --- 返回数组

面对对象

面向对象是一种对现实世界理解和抽象的方法。TypeScript 是一种面向对象的编程语言。

面向对象主要有两个概念：对象和类

• 对象 : 对象是类的一个实例,有状态和行为.
• 类 : 类是一个模板，它描述一类对象的行为和状态.
• 方法 : 方法是类的操作的实现步骤

tsc常用编译参数

–help显示帮助信息
–module载入扩展模块
–target设置 ECMA 版本
–declaration额外生成一个 .d.ts 扩展名的文件。tsc ts-hw.ts --declaration ,以上命令会生成 ts-hw.d.ts、ts-hw.js 两个文件。
–removeComments删除文件的注释
–out编译多个文件并合并到一个输出的文件
–sourcemap生成一个 sourcemap (.map) 文件。sourcemap 是一个存储源代码与编译代码对应位置映射的信息文件。
–module noImplicitAny在表达式和声明上有隐含的 any 类型时报错
–watch在监视模式下运行编译器。会监视输出文件，在它们改变时重新编译。

---

以上便是TypeScript的一些基本知识，如有不对之处，欢迎指出