ts中any和unknow的区别及说明

 更新时间:2026年03月30日 08:55:12   作者:JacksonChen_  
本文介绍了TypeScript中any和unknown类型的使用场景,any类型非常灵活,但可能导致潜在的运行时错误;而unknown类型虽然更严格,但在使用前需要进行类型检查,更安全,在不确定变量类型时,应优先考虑使用unknown以提高代码安全性

前言

在开发中,尤其在 react 项目中,一般都是会使用 ts 的,但是如果 ts 使用不当,就会出现很多any,也就是很多人笑成 typescript = anyscript,例如下面这段代码:

export interface Person {
  name: any;
  age: any;
  sex: any;
}

很多使用一些简单的类型定义,比如 number、boolean、string 可能我们还想写一下,但是遇到一些复杂的比如对象、promise,由于影响速度就直接使用 any 代替了,当然这样确实比较方便,但是一昧的使用 any,ts 就失去了意义,尽管 ts 官方鼓励大家使用 any。

而且有的领导在 cr 时,很讨厌看到 any,如果有 any 是不给通过的。

那和any相似的还有一个unknow,本文就为大家简单介绍一下,何时使用any何时使用unknow。

any

首先,让我们来看看 any 类型。any 可以说是 ts 中最灵活的类型,它允许我们对该类型的值进行任何操作,而不会触发类型检查。

这样我们就可以将任何类型的值赋给 any 类型的变量,也可以将 any 类型的值赋给其他任何类型的变量。这种灵活性就使得 any 成为了一把双刃剑。

举个栗子:

let myAny: any = 42;
myAny = "Hello, world!";
myAny = true;
myAny = [1, 2, 3];

let myNumber: number = myAny; // 不会报错
console.log(myAny.nonExistentMethod()); // 不会在编译时报错,但可能在运行时报错

在这个栗子中,我们可以看到 any 类型的变量可以被赋予任何类型的值,而且可以被赋给其他类型的变量,甚至竟然还可以调用不存在的方法而不会在编译时报错。这种自由度虽然方便,但也容易导致潜在的运行时错误。

那么相比之下,unknown 类型则更加严格和安全。unknown 可以被认为是类型安全版本的 any。它同样可以接受任何类型的值,但是在使用 unknown 类型的值时,我们必须先进行类型检查或类型断言。

unknown

来看一个 unknown 的栗子:

let myUnknown: unknown = 42;
myUnknown = "Hello, world!";
myUnknown = true;
myUnknown = [1, 2, 3];

// let myNumber: number = myUnknown; // 这行会报错
// console.log(myUnknown.length); // 这行也会报错

if (typeof myUnknown === "string") {
    console.log(myUnknown.toUpperCase());
}

let myString: string = myUnknown as string; // 使用类型断言

在这个栗子中,我们可以看到 unknown 类型的变量同样可以接受任何类型的值。但是,我们不能直接将 unknown 类型的值赋给其他类型的变量,也不能直接访问 unknown 类型值的属性或方法。我们必须先进行类型检查( if 语句中的类型检查)或使用类型断言 as。

什么情况下使用any或者unknow

那么,我们应该在什么情况下使用 any,什么情况下使用 unknown 呢?

当我们真的不知道变量的类型,并且需要在代码中频繁地使用该变量而不进行类型检查时,可以使用 any。比如在处理来自第三方库的数据,或者在迁移 js 项目到 ts 的过程中,any 可能会很有用。

但是,一昧的使用 any 会导致我们失去 ts 带来的类型安全性优势。所以,在大多数情况下,我们应该优先考虑使用 unknown。当我们不确定一个值的类型,但又想保持类型安全性时,unknown 是一个很好的选择。

使用 unknown 可以强制我们在使用该值之前进行必要的类型检查,这有助于捕获潜在的类型错误,提高代码的健壮性。

总结

总的来说,any 和 unknown 都为 ts 中的类型系统提供了一定的灵活性,但 unknown 更加注重类型安全。在实际开发中,我们应该尽量减少 any 的使用,多考虑使用 unknown,以充分利用 ts 的类型检查功能,写出更安全、更可靠的代码。

下次再想用 any 时,先问问自己:这里真的没法确定类型吗?用 unknown 会不会更安全?毕竟写 ts 的乐趣,不就是在类型系统的钢丝上优雅地跳舞吗?

以上为个人经验,希望能给大家一个参考,也希望大家多多支持脚本之家。

相关文章

  • JavaScript中字符串和字符串拼接操作实例代码

    JavaScript中字符串和字符串拼接操作实例代码

    这篇文章主要介绍了JavaScript中字符串和字符串拼接操作的相关资料,文中通过示例代码详解讲解了创建方式、不可变性及长度属性,包括+、+=、concat()、模板字符串拼接方法,需要的朋友可以参考下
    2025-05-05
  • js判断请求的url是否可访问,支持跨域判断的实现方法

    js判断请求的url是否可访问,支持跨域判断的实现方法

    下面小编就为大家带来一篇js判断请求的url是否可访问,支持跨域判断的实现方法。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2016-09-09
  • Next.js 中 middleware 中间件使用方式

    Next.js 中 middleware 中间件使用方式

    本文主要介绍了Next.js 中 middleware 中间件使用方式,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2026-01-01
  • [js+css]点击隐藏层,点击另外层不能隐藏原层

    [js+css]点击隐藏层,点击另外层不能隐藏原层

    [js+css]点击隐藏层,点击另外层不能隐藏原层...
    2007-03-03
  • 兼容IE和FF的js脚本代码小结(比较常用)

    兼容IE和FF的js脚本代码小结(比较常用)

    做BS开发就难免会用到javascript,而每个浏览器对javascript的支持有不同。这就需要我们程序员去兼容他们下面是兼容IE和FF的js脚本做法和分解(部分选自网上,经本人整理),希望对大家有帮助。
    2010-12-12
  • js实现贪吃蛇游戏(简易版)

    js实现贪吃蛇游戏(简易版)

    这篇文章主要为大家详细介绍了js实现贪吃蛇游戏简易版,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2020-09-09
  • 读取input:file的路径并显示本地图片的方法

    读取input:file的路径并显示本地图片的方法

    input:file是一个文件上传控件,如何读取input:file的路径并显示图片,具体实现如下,需要注意的是在IE8中由于IE8自作聪明的将真实路径隐藏起来
    2013-09-09
  • JavaScript六种继承方式总结大全

    JavaScript六种继承方式总结大全

    JavaScript中最基本的继承方式,其核心思想是利用原型让一个引用类型继承另一个引用类型的属性和方法,下面这篇文章主要介绍了JavaScript六种继承方式的相关资料,文中通过代码介绍的非常详细,需要的朋友可以参考下
    2025-10-10
  • 简单方法判断JavaScript对象为null或者属性为空

    简单方法判断JavaScript对象为null或者属性为空

    对已声明但未初始化的和未声明的变量执行typeof,都返回undefined,null表示一个空对象指针,typeof操作会返回object
    2014-09-09
  • JavaScript中var与let的区别

    JavaScript中var与let的区别

    这篇文章主要介绍了JavaScript中var与let的区别,var是JavaScript刚出现时就存在的变量声明关键字,而let作为ES6才出现的变量声明关键字,无疑两者之间存在着很大的区别,下面来看看两者之间到底存在什么
    2021-12-12

最新评论