IT数码 购物 网址 头条 软件 日历 阅读 图书馆
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
图片批量下载器
↓批量下载图片,美女图库↓
图片自动播放器
↓图片自动播放器↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁
 
   -> JavaScript知识库 -> TypesScript类型注解 -> 正文阅读

[JavaScript知识库]TypesScript类型注解

常见的基本类型

number类型

语法:let num: number = 20;

浮点数 支持直接量 二进制0b 八进制0o 十进制 十六进制0x

string类型

语法:let str: string = '张三'; // ‘’ / “” / `${}`

boolean类型

语法:let bool: boolean = true; // true/false

TS中的布尔类型只能是true/false,没有其他可能性

null和undefined类型

语法:let nl: null = null; let ul: undefined = undefined;

定义为nul或者undefined类型的,赋值可以为null和undefined其中之一

symbol类型

语法:const symboll: Symbol = Symbol(相关描述)

独一无二的数据类型

biglnt类型

语法:let num: bigint = 20n; let num: bigint = BigInt(20);

number的精度扩展

object类型

其实在ts中也有object类型,不同的是它还有Object和{}类型

  • object类型用于表示非原始类型

  • 0bject类型是所有Object类的实例的类型

  • {}类型街述了一个没有成员的对象

特殊类型

数组类型

普通数组

表示的就是数组,但是跟JS形式不同

语法:let arr: number[] = [1,2,3,4,5];

二维数组:let arr: number\[][] = [[1,2,3,4,5]];

范型数组

let list: Array\<number> = [6,7,8,9,0];

泛型数组和数组类型很像,只是格式不一样

tuple 元组类型

语法:let tuple: [number, string] = [1, '2'];

已知数量和类型的数组

各元素的类型不必相同,但左右两边必须匹配

any类型

语法:let anyl: any = "xxx'

Any类型的变量可以赋值任意类型的值

void类型

语法:function fn0:void{}

void用于函数返回值,表示返回空

never 类型

function error(message: string): never {
	throw new Error(message);
}

never类型表示的是那些永不存在的值的类型

比如无法达到的终点的一些函数

enum类型

语法:enum Color {Red = 1, Green, Blue}

枚举(默认下标从0开始,可以直接修改下标)

可以理解为通过enum关键字声明的一个特殊的类型

枚举类型提供的一个便利是你可以由枚举的值得到它的名字:let c: Color = Color.Green

使用:let colorName: string = Color[2]; console.log(colorName); // 显示'Green'因为上面代码里它的值是2

枚举的好处就是,我们可以定义一些带名字的常量,而且还可以清晰的表达意图或创建一组有区别的用例

自定义类型

语法:type User = (name: string; age?: number,}

借助一个关键字type可声明一个类型

函数

函数类型

为了让我们重容易使用,TS为函数添加了类型

函数类型包含两部分

  • 参数类型
  • 返回值类型
function add(x:number, y:number):number{return x+y;}

参数

传参个数固定

  • 在TS中传递给一个函数的参数个数必须与函数期望的参数个数一致
  • 但这不是指不能传递null或undefined作为参数,而是说编泽器检查用户是否为每个参数都传入了值

可选参数

  • 在TS里我们可以在参数名旁使用 ?实现可选参数的功能
  • 需要特别注意的是:可选参数必须跟在必须参数后面

默认参数

  • TS中也有默认参数,形式是参数后面跟 = 号,之后跟默认值
  • 当用户没有传递这个参数或传递的值为undefined时,我们设置的默认值就会起作用

剩余参数

  • 在JS中.我们可以使用 arguments来访问所有传入的参数
  • 而在TS中,可以把所有参数收集到一个变量里

函数重载:简单来说,就是同一个函数提供多个函数类型定义来进行函数重载

类型断言

类型断言

解决的问题:保证和检测来自其他地方的数据也符合我们的要求

所调断言就是断定、确定、绝对的意思

简单来讲,类型断言就是保证数据类型一定是所要求的类型

类型守卫

类型断言还需要信助类型守卫函数

类型守卫函数就是用于判断未知数据是不是所需类型

格式:x is y.表示x是不是y类型

例子

function isUser(arg: any): arg is User (
  if (!arg) {
  	return false
  }else {
    if (typeof arg.name == 'string' && typeof arg.age== 'number'){
    	return true:
    }else {
    	return false:
    }
  }
}

联合类型和交叉类型

交叉类型

交叉类型是通过使用 & 符号,将多个类型合并成一个类型

联合类型

联合类型是通过使用 | 符号,使得一个属性可以拥有多种类型

let tow: (number | string) = '2';    // 联合(值可以是数字也可以是字符串)

// 定义一个函数
declare function create(o: object | null): void;    // object表示非原始类型,也就是除number,string,boolean,symbol,null或undefined之外的类型。
create({ prop: 0 }); // OK
create(null); // OK
  JavaScript知识库 最新文章
ES6的相关知识点
react 函数式组件 & react其他一些总结
Vue基础超详细
前端JS也可以连点成线(Vue中运用 AntVG6)
Vue事件处理的基本使用
Vue后台项目的记录 (一)
前后端分离vue跨域,devServer配置proxy代理
TypeScript
初识vuex
vue项目安装包指令收集
上一篇文章      下一篇文章      查看所有文章
加:2022-04-30 08:37:40  更:2022-04-30 08:38:03 
 
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁

360图书馆 购物 三丰科技 阅读网 日历 万年历 2024年11日历 -2024/11/24 1:00:43-

图片自动播放器
↓图片自动播放器↓
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
图片批量下载器
↓批量下载图片,美女图库↓
  网站联系: qq:121756557 email:121756557@qq.com  IT数码