TypeScript类型(数字、字符串、字面量、数组、元组、枚举、对象等)

简介: TypeScript类型(数字、字符串、字面量、数组、元组、枚举、对象等)

一、数字

// number
let decimal: number = 6;
let hex: number = 0xf00d;
let binary: number = 0b1010;
let octal: number = 0o722;
// @ts-ignore
let big: bigint = 9007199254740991n;

二、字符串

// string
let color: string = "blue";
color = "red";
let fullName: string = "bob bob"

三、布尔

// boolean
let isDone: boolean = false;

四、字面量

// 字面量
let a = 10;
a = 10;

五、任意类型

// any 表示任意类型,任意类型TS关闭类型检查,不建议使用
// 显式申明any
// let d:any;
//隐式申明any
let d;
d = 10;
d = "hello";
d = true;

六、未知类型(安全的任意类型)

// unknown 表示位置类型的值
let e: unknown;
e = 10;
e = "hello";
e = true;

类型断言

let str: string;
// any类型的变量可以赋值給任意类型变量
str = d;
// unknown  TS2322: Type 'unknown' is not assignable to type 'string'.
// str=e;
// unkonwn 是类型安全的any unkonwn类型的变量不能直接赋值给其他变量
if (typeof e === "string") {
    str = e;
}
// 类型断言
str = e as string;
str = <string>e;

七、空值

function fun1(): void {
 
}

八、没有值

function fun3(): never {
    throw new Error("error");
}

九、对象

//object表示一个js对象
let a: object;
a = {};
a = function () {
};
 
// {}用来指定对象中可以包含那些属性 语法:{属性名:属性值,属性名:属性值}
// 属性名?:属性值 ?为可选属性
let b: { name: string, age?: number };
b = {name: '张三'};
b.age = 18;
 
// [propName:string]:any 表示任意类型个属性 propName可以是任意非关键字字符串
let c: { name: string, [propName: string]: any };
c = {name: "李四", age: 18, gender: "男"}
 
// 定义一个函数的参数及返回值
let d: (a: number, b: number) => number;
d = function (a, b) {
    return a + b;
}

十、数组

//数组 
// let 变量: 类型[]; 
// let 变量: Array<类型>;
let e: string[];
e = ['a', 'b'];
 
let f: Array<number>;
f = [1, 2, 3, 4];
 
// 不建议
let g: any[];
g = [1, 'str', true]

十一、元组

//元祖,元组就是固定长度的数组
let h: [string, number];
h = ['hello', 123];

十二、枚举

enum Gender {
    Male,
    Female,
}
 
let i: { name: string, gender: Gender };
i = {
    name: "王五",
    gender: Gender.Female
}

十三、组合类型

//&指定类型
let j: { name: string } & { age: number };
j = {name: "孙悟空", age: 500}
 
//类型别名 方便类型复用
type myType = 1 | 2 | 3 | 4 | 5;
let k: myType;
let l: myType;
k = 5;
 
 
// 可以使用 |来连接多个类型(联合类型)
let m: "male" | "female";
m = "male";
m = "female";
let n: boolean | string;
n = true;
n = "hello";
相关文章
|
JavaScript
typeScript基础(5)_对象的类型-interfaces接口
本文介绍了TypeScript中接口(interfaces)的基本概念和用法,包括如何定义接口、接口的简单使用、自定义属性、以及如何使用`readonly`关键字定义只读属性。接口在TypeScript中是定义对象形状的重要方式,可以规定对象的必有属性、可选属性、自定义属性和只读属性。
276 1
|
开发框架 缓存 前端开发
基于SqlSugar的开发框架循序渐进介绍(14)-- 基于Vue3+TypeScript的全局对象的注入和使用
基于SqlSugar的开发框架循序渐进介绍(14)-- 基于Vue3+TypeScript的全局对象的注入和使用
|
存储 JavaScript
typeScript进阶(11)_元组类型
本文介绍了TypeScript中的元组(Tuple)类型,它是一种特殊的数组类型,可以存储不同类型的元素。文章通过示例展示了如何声明元组类型以及如何给元组赋值。元组类型在定义时需要指定数组中每一项的类型,且在赋值时必须满足这些类型约束。此外,还探讨了如何给元组类型添加额外的元素,这些元素必须符合元组类型中定义的类型联合。
258 0
|
JavaScript
typeScript进阶(10)_字符串字面量类型
本文介绍了TypeScript中的字符串字面量类型,这种类型用来限制变量只能是某些特定的字符串字面量。通过使用`type`关键字声明,可以确保变量的值限定在预定义的字符串字面量集合中。文章通过示例代码展示了如何声明和使用字符串字面量类型,并说明了它在函数默认参数中的应用。
278 0
|
移动开发 JavaScript 前端开发
TypeScript:数组类型&函数使用&内置对象
本文介绍了 TypeScript 中的数组类型、对象数组、二维数组、函数、函数重载、内置对象等概念,并通过代码示例详细展示了它们的使用方法。还提供了一个使用 HTML5 Canvas 实现的下雨效果的小案例。
355 1
|
JavaScript
typeScript基础(6)_数组类型
本文介绍了TypeScript中数组的类型表示方法,包括直接使用类型加`[]`定义数组类型,以及使用数组泛型`Array<类型>`定义数组。同时,还展示了如何定义包含多种数据类型的数组。
267 1
|
开发框架 前端开发 JavaScript
在基于vue-next-admin的Vue3+TypeScript前端项目中,为了使用方便全局挂载对象接口
在基于vue-next-admin的Vue3+TypeScript前端项目中,为了使用方便全局挂载对象接口
|
JavaScript 前端开发 API
Vue 3+TypeScript项目实战:解锁vue-next-admin中的全局挂载对象接口,让跨组件共享变得高效而优雅!
【8月更文挑战第3天】在构建Vue 3与TypeScript及vue-next-admin框架的应用时,为提高多组件间共享数据或方法的效率和可维护性,全局挂载对象接口成为关键。本文通过问答形式介绍其必要性和实现方法:首先定义全局接口及其实现,如日期格式化工具;接着在`main.ts`中通过`app.config.globalProperties`将其挂载;最后在组件内通过Composition API的`getCurrentInstance`访问。这种方式简化了跨组件通信,增强了代码复用性和维护性。
356 0
|
JavaScript 前端开发
揭秘 TypeScript 条件类型:超越简单类型检查
揭秘 TypeScript 条件类型:超越简单类型检查
|
JavaScript 安全 索引
TypeScript 高级类型工具:Partial, Required, Record 的妙用与陷阱
TypeScript 高级类型工具:Partial, Required, Record 的妙用与陷阱