TypeScript 快速上手笔记 —《基础语法篇》

最新推荐文章于 2022-11-11 12:17:12 发布

DonyZF

最新推荐文章于 2022-11-11 12:17:12 发布

阅读量472

点赞数

分类专栏： TypeScript 文章标签： javascript 前端 typescript

本文链接：https://blog.csdn.net/DonyZF/article/details/123349794

版权

这篇笔记专注于TypeScript的基础语法，包括原始类型、object、数组、元组、enum、函数、any类型、类型推断、类型断言、接口、类、类与接口的实现、抽象类以及泛型的介绍。不涉及安装和配置，旨在简洁直接地讲解核心概念。

摘要由CSDN通过智能技术生成

本篇内容不涉及TypeScript安装以及配置，只涉及TypeScript语法相关内容。不讲废话，简单直接。

1、原始类型

const a: string = 'foo'
const b: number = 100
const c: boolean = true
const d: void = undefined
const e: null = null
const f: undefined = undefined
const g: symbol = Symlol()

2、object 类型

object并不单指对象，而是指除了原始类型以外的其他类型

const foo: object = function () {
   } // [] // {}
const obj: {
    foo: number,bar: string } = {
    foo: 123, bar: 'string' }

3、数组类型

// 第一种定义方式，元素类型设置为 *number*
const arr1: Array<number> = [1, 2, 3]
// 第二种定义方式，较为常见
const arr2: number[] = [1, 2, 3]

// 例子
function sum (...args: number[]) {
   
	// 传统做法是要判断传入的参数是否是数字，
	   而TypeScript中只需要像上面这样对参数做一个类型注解，就行了
	return args.reduce(prev, current) => prev + current, 0)
}

sum(1, 2, 3, 'foo') // 这里传入了一个非数字的值就会报错

4、元组类型

元组就是一个明确元素数量 和 明确元素类型 的数组

const tuple: [number, string] = [18, 'foo']
// const tuple: [number, string] = [18, 18] 类型不匹配，会报错
// const tuple: [number, string] = [18, 'foo', 'xxx'] 数量不匹配，会报错

// 访问
const age = tuple[0]
const name = tuple[1]

// 解构
const [age, name] = tuple

5、enum 类型

// enum 对象的属性可以不用赋值，默认从0开始递增，
   也可以赋值Draft = 5，后面的就从5开始递增
   也可以给具体的值，比如 Draft = 'xxx',这样后面的属性都要给具体的值
enum PostStatus {
   
	Draft = 0,
	Unpublished =

最低0.47元/天解锁文章