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知识库 -> 【TypeScript】你可能不知道的这些类型 -> 正文阅读

[JavaScript知识库]【TypeScript】你可能不知道的这些类型


类型

TypeScript的类型有很多,但是这里不会逐一进行讲解。下面列出来的几种类型,有的你可能没听过、有的你可能没用过、有的你可能用过但是不知道含义、有的你可能知道含义但是不能和其他类型区分···

Symbol

ES6 引入了一种新的原始数据类型 Symbol ,表示独一无二的值,它是 JavaScript 语言的第七种数据类型。

使用 Symbol() 函数我们可以申明一个 Symbol 变量,注意不能使用 new 命令,因为它是原始数据类型;Symbol 函数也可以接受一个字符串作为参数,主要是方便当 Symbol 转化为字符串时,比较容易区分,该传入的参数在 ES2019 中支持通过 description 这个实例属性来访问。

Tuple(元组)

众所周知,对象、数组、枚举类型可以存放多个数据;但是,对象和枚举存放的数据以key/value形式存在,不具有排序等特效,数组中存放的只能是同一类型数据;Tuple类型可以看做是对象类型和数组类型特点的结合:

  • 数据有序;
  • 存放不同类型数据;

在 JavaScript 中是没有元组的,元组是 TypeScript 中特有的类型,其?作?式类似 于数组。 元组可?于定义有限数量的未命名属性的类型。每个属性都有?个关联的类型。使?元组时,必须 提供每个属性的值,可以通过索引访问元素:

let tupleType: [string, boolean, number];
tupleType = ["hello", true, 2];

console.log(tupleType[0]); // hello
console.log(tupleType[1]); // true
console.log(tupleType[2]); //2

any(任意类型)

在 TypeScript 中,任何类型都可以被归为 any 类型。这让 any 类型成为了类型系统的顶级类型(也被 称作全局超级类型)。

any 类型本质上是类型系统的?个避难所,这给了开发者很?的?由:TypeScript 允许我们 对 any 类型的值执?任何操作,包括赋值和被赋值,并且?需事先执?任何形式的检查。?如:

let value: any;
// 被赋值
value = 'hello world';
value = true;
value = [];
value = {};
value = 0;
// 赋值给其他变量
let temp: number;
temp = value;
// 操作属性/方法
value.toString();
value.length;
value();
  • any可以为任何类型,所以默认变量上的任何属性或者方法都可以找到一个类型(基础类型/自定义类型)对应上,所以检查没有问题;

unknown(不知道什么类型)

就像所有类型都可以赋值给 any ,所有类型也都可以赋值给 unknown 。这使得 unknown 成为 TypeScript 类型系统的另?种顶级类型(另?种是 any );

对 value 变量的所有赋值都被认为是类型正确的。但是,尝试将类型为 unknown 的值赋值给其 他类型的变量时就会有意想不到的限制:

let value: unknown;
// 被赋值
value = 'hello world';
value = true;
value = [];
value = {};
value = 0;
// 赋值给其他变量
let temp: number;  // Error:Type 'unknown' is not assignable to type 'number'.
temp = value;

let temp2: any;
temp2 = value; // Success

let temp3: unknown;
temp3 = value; // Success

let temp4: string[]; // Error:Type 'unknown' is not assignable to type 'string[]'
temp4 = value;

// 操作属性/方法
value.toString(); // Error:Object is of type 'unknown'
value.length; // Error:Object is of type 'unknown'
value(); // Error:Object is of type 'unknown'
  • unknown 类型只能被赋值给 any 类型和 unknown 类型本身:能够保 存任意类型值的容器才能保存 unknown 类型的值。

  • value 变量类型为 unknown ,进行检查的时候无法确认变量类型,因此认为变量上的方法或者属性都是不确定的,检查不给通过。

void(没有任何类型)

void可以理解为和any正好相反,表示没有任何类型,void一般用于一个函数没用返回值时。当给一个变量定义为void类型时是没有任何作用,变量的值只能是undefined

let value:void;
value = 0; // Error:Type 'number' is not assignable to type 'void'.
value = undefined; // Success

null(空值类型)和 undefined(未定义类型)

TypeScript ?, undefined 和 null 两者有各?的类型的值分别为 undefined 和 null ,并且只能是 undefined 和 null:

let value:null;
value = undefined;  // Error:Type 'undefined' is not assignable to type 'null'
value = null; //Success
value = 1; // Error:Type '1' is not assignable to type 'null'

let value:undefined;
value = undefined; //Success
value = null; // Error:Type 'null' is not assignable to type 'undefined'
value = 1; // Error:Type '1' is not assignable to type 'undefined'

Object、object和{}(对象类型)

【TypeScript】Object、object和{}类型

Never

never 类型表示不存在的值的类型。never 类型用于:

  • 抛出异常
  • 不会有返回值的函数表达式或箭头函数表达式的返回值类型(无终点,一直执行下去!)。
function error(msg: string)msgever {
 		throw new Error(msg);
}
function loop(): never {
 		while (true) {
 				// 一直执行下去
 		}
}

使? never 避免出现新增了联合类型没有对应的实现,?的就是写出类型绝对安全的代码;可以利? never 类型的特性对变量类型全?性检查:

// 定义type a为string或者number类型
type a = string | number;
// 方法checkWithNever用来检测参数是否是type a,
function checkWithNever(foo: a) {
    if (typeof foo === "string") {
        // 这?执行 string 类型的操作
    } else if (typeof foo === "number") {
        // 这?执行 number 类型的操作
    } else {
        // 在这?是 never用来接收非type a的类型,并且会在编译时报错
        const check: never = foo;
    }
}
// 重写 type a类型,但是没有修改checkWithNever,导致boolean 类型,?法赋值给 never 类型,执行后编译报错
type a = string | number | boolean;
const c: a = true;
checkWithNever(c); 
// Type 'boolean' is not assignable to type 'never'. 
// 'check' is declared but its value is never read.
  JavaScript知识库 最新文章
ES6的相关知识点
react 函数式组件 & react其他一些总结
Vue基础超详细
前端JS也可以连点成线(Vue中运用 AntVG6)
Vue事件处理的基本使用
Vue后台项目的记录 (一)
前后端分离vue跨域,devServer配置proxy代理
TypeScript
初识vuex
vue项目安装包指令收集
上一篇文章      下一篇文章      查看所有文章
加:2021-08-24 15:27:49  更:2021-08-24 15:29:54 
 
开发: 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/23 13:24:36-

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