TypeScript 入门

开发环境

1.安装Node.js

https://nodejs.org/zh-cn/

通过 node -v 命令查看本机是否安装,如果没有安装,参考node.js安装指南 根据电脑系统环境进行安装

2.初始化一个 TypeScript 项目

mkdir project && cd project
npm init -y
npm install -save-dev typescript

3.创建 tsconfig.json 文件

方法一:在vscode 中,点击右下角版本号
在这里插入图片描述

方法二:

node_modules/.bin/tsc --init --locale zg-CN

通过这种方法创建,tsconfig.json 包含所有编译器参数以及参数说明

4.TS Playground 工具

https://www.typescriptlang.org/play

鼠标悬停在类型名上查看其类型,ctrlctrl + click查看定义和引用

5.运行 index.ts 文件

Node 不能直接运行 TypeScript 文件,需要用转换成 JavaScript 文件

执行以下命令将 TypeScript 转换为 JavaScript 代码:

tsc index.ts

使用 node 命令来执行 index.js 文件

node index.js

6.ts-node 的安装和使用

使用 ts-node 插件,不用再编译,而使用 ts-node 就可以直接看到编写结果

全局安装

npm install -g ts-node

使用

ts-node index.ts  

基础知识

1.TypeScript 程序由以下几个部分组成

  • 模块
  • 函数
  • 变量
  • 语句和表达式
  • 注释

2.空白和换行

TypeScript 会忽略程序中出现的空格、制表符和换行符。

空格、制表符通常用来缩进代码,使代码易于阅读和理解。

3.TypeScript 区分大小写

TypeScript 区分大写和小写字符。

4.分号是可选的

每行指令都是一段语句,你可以使用分号或不使用, 分号在 TypeScript 中是可选的,建议使用。

如果语句写在同一行则一定需要使用分号来分隔,否则会报错。

5.TypeScript 注释

  • 单行注释 ( // ) − 在 // 后面的文字都是注释内容。
  • 多行注释 (/* */) − 这种注释可以跨越多行。

基础类型

数据类型关键字描述
任意any声明为 any 的变量可以赋予任意类型的值。
数字number双精度 64 位浮点值。它可以用来表示整数和分数。
字符串string一个字符系列,使用单引号(’)或双引号(")来表示字符串类型。反引号(`)来定义多行文本和内嵌表达式。
布尔boolean表示逻辑值:true 和 false。
数组在元素类型后面加上[],或者使用数组泛型
元组元组类型用来表示已知元素数量和类型的数组,各元素的类型不必相同,对应位置的类型需要相同。
枚举enum枚举类型用于定义数值集合。
voidvoid用于标识方法返回值的类型,表示该方法没有返回值。
nullnull表示对象值缺失。
undefinedundefined用于初始化变量为一个未定义的值
nevernevernever 是其它类型(包括 null 和 undefined)的子类型,代表从不会出现的值。

值空间与类型空间

只包含类型声明的 namespace 不会产生 JS 代码,不会引入变量

instanceof 操作符只作用于值空间

如何判断符号是在哪个空间?

  1. 转译后消失的符号 → 类型空间

  2. 作为类型注解、别名的符号 → 类型空间

    ​ ( type T = typeof Person; const p: Person)

  3. 类型断言后的符号 → 类型空间 ( target as/is HTMLElement )

  4. const,、let、var 后面的符号 → 值空间

  5. class、enum、namespace 后的符号 → 值空间 + 类型空间

有一些操作符在两个空间都存在,但是含义完全不同:

typeof

在值空间,typeof 返后面表达式对应的 JavaScript 类型的字符串表示

( string , number , bigint , boolean , symbol , undefined , object , function )在类型空间,typeof返回标识符对应的 TypeScript 类型

[ ] (索引访问操作符 Indexed Access Operator)

在值空间,val[field] 或 val.field 返回 val 对应属性的值

在类型空间,Type[T] 返回对应 TS 类型

this关键字

在值空间,this 指向…比较复杂

在类型空间,this 可以作为类方法的返回值来实现链式调用

&| 运算符

在值空间表示 “按位与” 和 “按位或” (Bitwise AND,OR)

在类型空间表示类型的交叉和联合

const

在值空间用来声明常量

在类型空间与 as 连用,即 “as const” 常量断言,收窄类型

extends

在值空间用于定义子类(class A extends B)

在类型空间用来进行类型约束(T extends number)或接口继承(interface A extends B)

in

在值空间用于for循环(for (key in object){ …})和判断属性是否存在( name in person)

在类型空间用于映射类型的 key 的声明(Mapped Type)

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值