TypeScripe笔记:any、unknown、never、void、null 和 undefined 及其比较

简介: TypeScripe 中,any、unknown、never、void、null 和 undefined 的比较

TypeScripe笔记:any、unknown、never、void、null 和 undefined 及其比较


jcLee95 的个人博客https://blog.csdn.net/qq_28550263?spm=1001.2101.3001.5343


邮箱: 291148484@163.com


本文地址
- https://developer.aliyun.com/article/
- https://blog.csdn.net/qq_28550263/article/details/128169543

目 录


1. Any 类型

2. unknown 类型

3. never 类型

4. void

5. null 和 undefined

6. 可分配性比较


1. Any 类型

TypeScript 也有一个特殊类型 ,any只要您不希望特定值导致类型检查错误,就可以使用它。

当一个值是 typeany时,您可以访问它的任何属性(它又将是 type any),像调用函数一样调用它,将它分配给(或从)任何类型的值,或者几乎任何其他语法上的值合法的:

let obj: any = { x: 0 };
// 下面几行代码都不会抛出编译器错误。
// 使用 `any` 将禁用所有进一步的类型检查,并且假设您比TypeScript更了解环境。
obj.foo();
obj();
obj.bar = 100;
obj = "hello";
const n: number = obj;

当你不想为了让 TypeScript 相信特定代码行没问题而写出长类型时,any 类型很有用。

noImplicitAny 选项:

当您不指定类型,并且 TypeScript 无法从上下文中推断出它时,编译器通常会默认为any.

不过,您通常希望避免这种情况,因为any没有进行类型检查。使用编译器标志noImplicitAny将任何隐式标记any为错误。

2. unknown 类型

2.1 TypeScript 中的 unknown 类型

unknown 类型是最具有可分配性的类型之一(另一个是any),适用于在应用场景中暂不知道是什么类型,unknown 类型表示当前未知类型而在之后的操作中,一切其它类型都可以分配给 unknown 类型,这就相当于由未知到已知的过程。但是表示未知的 unknown 类型并不是表示任意类型,可以理解为相当于待定,但不意味着管它什么样子的类型都无所谓,因此唯独不能分配为 any 类型。

在开发中,当我们不确定一个变量的类型是什么类型的时候,常常声明为 any 或者 unkown,但是 any 不是类型安全的,使用 any 标识的变量将可以任意的取值赋值而不会进行任何的类型检查!

与之相反的是,unkown 必须先进行类型判断,比如使用typeof 或 instanceof 来判断类型,如果你在没有语义环境时直接使用一个 unkown 类型的变量将提示你 “unkown 类型不能 xxx”。

2.2 unknown 和 never 类型的比较

unknown 和 never 就像是彼此的反义词。一切都可以分配给 unknown,never 不能分配给一切。没有什么可赋给never,unknown不可赋给任何东西(any除外)。

请参考6. 可分配性比较

应用举例:

import type { ExtractPropTypes, PropType } from 'vue';
type Writable<T> = { -readonly [P in keyof T]: T[P] };
type WritableArray<T> = T extends readonly any[] ? Writable<T> : T;
type IfNever<T, Y = true, N = false> = [T] extends [never] ? Y : N;
type IfUnknown<T, Y, N> = [unknown] extends [T] ? Y : N;
/** 如果 T 为 unknown 类型,则返回 never 类型,否则返回T的类型 */
type UnknownToNever<T> = IfUnknown<T, never, T>;
/** 提取vue setup 中单个 prop 的参数类型 */
type ExtractPropType<T extends object> = Value<
  ExtractPropTypes<{
    key: T
  }>
>
/** 表示如果 T 是 never 返回 never 类型,否则按 { type: WritableArray<T>, required: true} 为模板构造该单个 prop 的参数类型作为返回类型*/
type ResolvePropType<T> = IfNever<T, never, 
  ExtractPropType<{
    type: WritableArray<T>
    required: true
  }>
>
type PropMergeType<Type, Value, Validator> =
  | IfNever<UnknownToNever<Value>, ResolvePropType<Type>, never>
  | UnknownToNever<Value>
  | UnknownToNever<Validator>

注:在 vue3 框架中,提供了一个 ExtractPropTypes 类型工具,用来导出用于其 setup 函数的 props类型。

2.3 unknown 和 any 类型的比较

anyunknown 就可分配给它们的事物而言是相同的,不同之处在于unknown 不可分配给除 any 以外的任何事物。

请参考6. 可分配性比较

3. never 类型

3.1 TypeScript 中的 never 类型

never 类型表示的是那些永不存在的值的类型,例如:

function error(): never {
  throw new "Some Error occurs.";
}

这个函数直接抛出了异常,返回类型被标记成 never

又例如:

function infiniteLoop(): never {
  while (true) {
    // some actions
  }
}

这个函数中有一个自循环,导致函数存在无法达到的终点,返回类型被标记成 never

3.2 never 和 unknown 类型的比较

见:2.2 unknown 和 never 类型的比较

4. void

4.1 JavaScript 中的 void 运算符

void 运算符对给定的表达式进行求值,然后返回 undefined,例如:

const output = void 1;
console.log(output);

Out[]:

undefined
void console.log('expression evaluated');

Out[]:

"expression evaluated"
void function iife() {
  console.log('iife is executed');
}();

Out[]:

iife is executed
void function test() {
  console.log('test function executed');
};
try {
  test();
} catch (e) {
  console.log('test function is not defined');
}

Out[]:

"test function is not defined"

4.2 TypeScript 中的 void 类型

TypeScript 中,使用同名的 void 类型表示某个值不存在。 void 不能赋值给任何对象 或 从任何对象赋值,但下列情况除外: anyunknownneverundefinednull (如果 strictNullChecks 选项off

注意:除了将 void 类型 作为函数返回值类型外,在其他地方使用void类型是无意义的。

请参阅 可分配性比较 了解详细信息)。

5. null 和 undefined

5.1 JavaScript 中的 nullundefined

JavaScript 有两个原始值用于表示值不存在或未初始化的值:nullundefined

5.1.1 null 字面量

在JavaScript中,null 是一个字面量,表示缺少的标识,指示变量未指向任何对象。值 null 特指对象的值未设置,可以理解成 尚未创建的对象

在布尔运算中被认为是 falsy

5.1.2 undefined 全局对象属性

undefined 是全局对象的一个属性。也就是说,它是全局作用域的一个变量。undefined 的最初值就是 原始数据类型 undefined。

在函数中,如果没有使用 return 语句指定返回值,就会返回一个 undefined 值。

5.1.3 null 与 undefined 的不同点

  • undefined 是一个全局属性,但 null 不是;
  • 当检测 null 或 undefined 时,null 会执行类型转换,而 undefined 不会:
typeof null        // "object" (因为一些以前的原因而不是'null')
typeof undefined   // "undefined"
null === undefined // false
null  == undefined // true
null === null // true
null == null // true
!null //true
isNaN(1 + null) // false
isNaN(1 + undefined) // true

5.2 TypeScript 中的 nullundefined 类型

TypeScript 有两个对应的 同名类型。这些类型的行为方式取决于您是否选择 strictNullChecks 选项

strictNullChecksoff 时,nullundefined 类似于 never :可分配给大多数类型,大多数类型不可分配给它们。它们可以互相转让。

6. 可分配性比较

any unknown object void undefined null never
any -
unknown -
object -
void -
undefined -
null -
never -
目录
相关文章
|
7月前
|
JavaScript
JS中Null和Undefined的区别及用法
JS中Null和Undefined的区别及用法
86 1
|
7月前
|
JavaScript 前端开发 算法
undefined与null的区别
在JavaScript中,undefined和null都表示变量未被赋值或值缺失,但它们在使用场景上有一些区别。 - **`语义不同`**:undefined表示一个变量未被赋值或者声明后未进行初始化。而null表示一个变量被明确地设置为无值或者表示空值的概念。 - **`类型不同`**:undefined是一种基本数据类型,而null是一个引用类型。 - **`条件判断`**:在条件判断中,使用if (variable === undefined)或者if (variable === null)可以进行区分。
|
3月前
|
机器学习/深度学习 JavaScript 前端开发
JavaScript typeof, null, 和 undefined
JavaScript typeof, null, 和 undefined
60 4
|
3月前
|
存储 JavaScript 前端开发
|
4月前
|
前端开发 JavaScript 开发者
JavaScript中的哲学难题:深入探讨undefined与null的情感纠葛
【8月更文挑战第23天】在Web前端开发中,理解和区分`undefined`与`null`至关重要。`undefined`表示变量已声明但未赋值,常出现在未初始化的变量或函数无返回值的情形;`null`则是开发者主动赋值的结果,意味着变量虽存在但值为空。虽然`undefined == null`为真,但`undefined === null`为假,表明它们在语义上有明显差异。合理使用两者能增强代码的健壮性和可读性,避免运行时错误。
35 0
|
4月前
|
JavaScript 前端开发 数据库
编程小白到高手:掌握null与undefined、JavaScript中隐藏的技巧曝光!
编程小白到高手:掌握null与undefined、JavaScript中隐藏的技巧曝光!
|
6月前
|
JavaScript 前端开发 开发者
JavaScript数据类型概述及Undefined与Null详解
JavaScript数据类型概述及Undefined与Null详解
|
6月前
|
JavaScript 前端开发 索引
JavaScript有7个数据类型:Number, String, Boolean, Null, Undefined, Symbol(BES6)和BigInt(ES10)组成基本类型
【6月更文挑战第25天】JavaScript有7个数据类型:Number, String, Boolean, Null, Undefined, Symbol(BES6)和BigInt(ES10)组成基本类型,而Object包括Array、Function等是引用类型。Objects可以包含键值对,Array是特殊的Object。Functions也是对象。`null`和`undefined`被视为特殊的原始值。
57 1
null、undefined和未声明变量的具体应用场景
null、undefined和未声明变量的具体应用场景
TS,数据类型概述,常见的基本数据类型有number/string/boolean/undefined/null,字符串用““,let food: string = ‘糖葫芦‘,布尔类型
TS,数据类型概述,常见的基本数据类型有number/string/boolean/undefined/null,字符串用““,let food: string = ‘糖葫芦‘,布尔类型