TypeScript学习第二天:认识ts的数据类型

1,类型总览

类型 例子 描述
number 1、2、3 任意数字
string 'xxx' 任意字符串
boolean true / false 布尔值
undefined const n: undefined = undefined 一个没有被赋值的变量
null const n: null = null 尚未创建的对象
object { name: '' } 任意对象
array [1, 2, 3] 任意数组
Symbol let n: symbol = Symbol('k') 表示独一无二的值
BigInt let n: bigint = BigInt(9007199254740991) 内置对象 表示大于253 - 1的整数
字面量 let a:'hello' = 'hello' 其本身
any 任意值 任意类型的值
unknown 任意值 安全类型的any
void let a: void = undefined 没有值或者undefined
never (): never => {} 永不存在的值
tuple [1, 2, 3] 元组 固定值和长度的数组
enum enum Color {Red, Green} 枚举 用于取值被限定在一定范围内的场景

2,基本类型


2.1,布尔

let isDone: boolean = false

2.2,数字

let isNum: number = 6

2.3,字符串

let name: string = 'bob'
name = 'smith'
let name2: string = `Genez${name}`

2.4,Null

let n: null = null

2.5,undefined

const n: undefined = undefined

2.6,symbol

let n: symbol = Symbol('k')

2.7,bigint

let n: bigint = BigInt(9007199254740991)

3,引用类型


3.1,数组 Array

  • 声明方式一
let list: number[] = [1, 2, 3]
  • 声明方式二
let list: Array = [1, 2, 3]
  • 多类型数组
const arr1: (number | string)[] = [1, 'string', 2]
const arr2: Array = [1, 'string', null]
  • 使用type约束的数组
type T = number | string
const arr: Array = [1, '张三']
  • 使用interface约束的对象数组
interface Item {
  id: number
  name: string
  isDad: boolean
}
const objectArr: Array = [{ id: 1, name: 'demo', isGod: true }]

3.2,对象 Object

  • 普通对象
const n: object = {
  value: '',
  size: 20
}
  • interface定义
interface Hero {
  name: string
  age: number
  skill: string
  skinNum?: number
  say(): string // say函数返回值为 string
  [keyName: string]: any // 当前Hero可定义任意字符串类型的key
}

const t:Hero = {
    name: '999',
    age: 20,
    skill: '',
    say() {
        return ''
    },
    kkk: ''
}
  • type定义
type Hero = {
  name: string
  age: number
  skill: string
  skinNum?: number
}
  • 任意类型
interface AnyObject {
  [key: string]: any
}

const t:AnyObject = {
    name: '999',
    age: 20,
    skill: '',
    kkk: null,
    aaa: undefined
}

3.3,函数 Function

  • 普通定义函数
function fn(name: string, size: number, state?: number, text: string = '', ...param: number[]):object {
  return {
    name,
    size
  }
}
  • 箭头函数
const fn2: (a: number, b: string) => string = function (a:number, b:string): string {
  return ''
}
  • 无返回值
const fn2: (a: number, b: string) => void = function (a:number, b:string): void {
  console.log(a, b)
}
  • 使用interface定义函数
interface SearchFn{
  (param1: string, param2: string): boolean
}

const fn3:SearchFn = function(param1, param2) {
  return param1 === param2
}
  • 不确定参数个数
function pu(array: any[], ...items: any[]) {
    items.forEach(function(item) {
        array.push(item);
    });
}
let a = [];
pu(a, 1, 2, 3);

4,TypeScript新增类型

4.1,元祖 Tuple

元组类型允许表示一个已知元素数量和类型的数组,各元素的类型不必相同,赋值的类型、位置、个数需要和定义(生明)的类型、位置、个数一致。

元组最重要的特性是可以限制数组元素的个数和类型,它特别适合用来实现多值返回,用于保存定长定数据类型的数据。

  • 例子
let uple: [string, string, number] = ["zed", "darts", 25]
  • 可选元素
let uple: [string, string, number?] = ["zed", "darts"]
  • 不定个数
type RestTupleType = [number, ...string[]]
let restTuple: RestTupleType = [666, "Semlinker", "Kakuqo", "Lolo"]
  • 只读
const point: readonly [number, number] = [10, 20]

4.2,枚举 enum

使用枚举我们可以定义一些带名字的常量。 使用枚举可以清晰地表达意图或创建一组有区别的用例。

  • 例子
enum Enum {
     A,
     B,
     C
}
console.log(Enum.A) // 打印出 0
console.log(Enum.B) // 打印出 0
  • 设置初始值
enum Enum {
     A = 8,
     B,
     C
}
console.log(Enum.A) // 打印出 8
console.log(Enum.B) // 打印出 9
  • 字符串枚举,每个都需要声明
enum Enum {
     A = "8号",
     B = "9号",
     C = "10号"
}
console.log(Enum.A) // 打印出 8号

4.3,Any

在编程阶段还不清楚类型的变量指定一个类型,可以使用 any类型来标记这些变量

  • 例子
let notSure: any = 4
notSure = false
notSure = ''

let list: any[] = [1, true, "free"]
list[1] = 100

4.4,Void

void类型像是与any类型相反,它表示没有任何类型。 当一个函数没有返回值时,你通常会见到其返回值类型是void

  • 例子
function warnUser(): void {
    console.log("xxxxxxxxx");
}

// 只能为它赋予undefined和null
let unusable: void = undefined

4.5,Never

never类型表示的是那些永不存在的值的类型,抛出异常或者是死循环

  • 例子
// 异常
function err(msg: string): never { // OK
  throw new Error(msg); 
}

// 死循环
function loopForever(): never { // OK
  while (true) {};
}

4.6,Unknown

unknownany一样,所有类型都可以分配给unknown。与any的最大区别是: 任何类型的值可以赋值给any,同时any类型的值也可以赋值给任何类型。unknown 任何类型的值都可以赋值给它,但它只能赋值给unknownany

  • 例子
let notSure: unknown = 4;
let uncertain: any = notSure; // OK

let notSure: any = 4;
let uncertain: unknown = notSure; // OK

let notSure: unknown = 4;
let uncertain: number = notSure; // Error

4.7,字面量

使用一个字符串字面量类型作为变量的类型

  • 例子
let hello: 'hello' = 'hello';
hello = 'hi'; // 报错

如果看了觉得有帮助的,我是@鹏多多11997110103,欢迎 点赞 关注 评论;
END

PS:在本页按F12,在console中输入document.querySelectorAll('._2VdqdF')[0].click(),有惊喜哦

往期文章

  • 助你上手Vue3全家桶之Vue3教程
  • 助你上手Vue3全家桶之VueX4教程
  • 助你上手Vue3全家桶之Vue3教程
  • 超详细!Vuex手把手教程
  • 使用nvm管理node.js版本以及更换npm淘宝镜像源
  • 超详细!Vue-Router手把手教程
  • vue中利用.env文件存储全局环境变量,以及配置vue启动和打包命令
  • 微信小程序实现搜索关键词高亮

个人主页

  • CSDN
  • GitHub
  • 博客园
  • 掘金

你可能感兴趣的:(TypeScript学习第二天:认识ts的数据类型)