惯性聚合 高效追踪和阅读你感兴趣的博客、新闻、科技资讯
阅读原文 在惯性聚合中打开

推荐订阅源

Google DeepMind News
Google DeepMind News
博客园 - 司徒正美
WordPress大学
WordPress大学
爱范儿
爱范儿
小众软件
小众软件
钛媒体:引领未来商业与生活新知
钛媒体:引领未来商业与生活新知
罗磊的独立博客
博客园_首页
V
V2EX
让小产品的独立变现更简单 - ezindie.com
让小产品的独立变现更简单 - ezindie.com
T
Tailwind CSS Blog
大猫的无限游戏
大猫的无限游戏
The Cloudflare Blog
MyScale Blog
MyScale Blog
IT之家
IT之家
H
Help Net Security
Blog — PlanetScale
Blog — PlanetScale
Microsoft Security Blog
Microsoft Security Blog
H
Hackread – Cybersecurity News, Data Breaches, AI and More
Recent Announcements
Recent Announcements
F
Fortinet All Blogs
The GitHub Blog
The GitHub Blog
Y
Y Combinator Blog
人人都是产品经理
人人都是产品经理

博客园 - howhy

TypeScript interface vs type 完整对比 html 元素包含关系 this 指向 空对象 Object.keys for ...in Reflect.ownKeys ...区别 逻辑运算符和空值运算符 运算符优先级 js 类型显式转换 js 高级函数 js 方法重载 fetch timeout js 任务顺序执行 暂停 js 并发任务 判断两个对象是否相同 js 动态拦截属性 js 通用动画 js groupby js 防抖和节流 实现 instanceof 操作符 js 单例模式 js 数组去重和扁平方法 js 继承方法 js new的过程实现 js deepCopy js '=='的隐性类型转换规则
TypeScript any vs unknown 详细对比
howhy · 2026-08-29 · via 博客园 - howhy

TypeScript any vs unknown 详细对比

anyunknown 是 TypeScript 中两个特殊的顶层类型(top type),它们可以接受任何类型的值,但在类型安全上有本质区别。


一、核心区别

一句话总结

  • any:可以赋值给任何类型,也可以访问任何属性/方法(完全不安全

  • unknown:只能赋值给 unknownany,必须先进行类型检查才能使用(类型安全


二、基本对比表

特性anyunknown
接受任何类型的值
赋值给其他类型 ✅ 可以 ❌ 不可以(需要类型收窄)
访问属性/方法 ✅ 可以(无检查) ❌ 不可以(需要类型收窄)
调用函数 ✅ 可以 ❌ 不可以
类型安全 ❌ 不安全 ✅ 安全
设计意图 绕过类型检查 安全地处理未知类型
IDE 提示 无任何提示 有类型收窄提示

三、详细示例

1. 赋值行为

// ===== any =====
let anyValue: any = "hello";

// ✅ any 可以赋值给任何类型(可能出错)
const str: string = anyValue;    // ✅ 编译通过
const num: number = anyValue;    // ✅ 编译通过
const bool: boolean = anyValue;  // ✅ 编译通过
// 运行时:num 实际是字符串 "hello",导致类型不匹配

// ===== unknown =====
let unknownValue: unknown = "hello";

// ❌ unknown 不能直接赋值给具体类型
// const str2: string = unknownValue;   // ❌ 错误
// const num2: number = unknownValue;   // ❌ 错误

// ✅ 只能赋值给 unknown 或 any
const anotherUnknown: unknown = unknownValue;  // ✅ 正确
const anotherAny: any = unknownValue;          // ✅ 正确

2. 访问属性和方法

// ===== any =====
const anyObj: any = { name: "Alice" };

console.log(anyObj.name);           // ✅ 编译通过
console.log(anyObj.nonExistent);    // ✅ 编译通过(运行时 undefined)
anyObj.anyMethod();                 // ✅ 编译通过(运行时可能报错)

// ===== unknown =====
const unknownObj: unknown = { name: "Alice" };

// console.log(unknownObj.name);     // ❌ 错误:类型是 unknown
// unknownObj.anyMethod();           // ❌ 错误:类型是 unknown

// ✅ 需要先进行类型检查
if (typeof unknownObj === 'object' && unknownObj !== null) {
  console.log((unknownObj as { name: string }).name);  // ✅ 正确
}

3. 函数调用

// ===== any =====
const anyFn: any = () => console.log("hello");
anyFn();  // ✅ 编译通过

// ===== unknown =====
const unknownFn: unknown = () => console.log("hello");
// unknownFn();  // ❌ 错误:类型是 unknown

// ✅ 需要先检查是否为函数
if (typeof unknownFn === 'function') {
  unknownFn();  // ✅ 正确
}

4. 运算操作

// ===== any =====
const anyValue: any = 10;
const result1 = anyValue + 5;      // ✅ 编译通过
const result2 = anyValue.toFixed(); // ✅ 编译通过

// ===== unknown =====
const unknownValue: unknown = 10;
// const result3 = unknownValue + 5;  // ❌ 错误
// const result4 = unknownValue.toFixed(); // ❌ 错误

// ✅ 需要先进行类型收窄
if (typeof unknownValue === 'number') {
  const result5 = unknownValue + 5;      // ✅ 正确
  const result6 = unknownValue.toFixed(); // ✅ 正确
}

四、类型收窄(Type Narrowing)

unknown 的强大之处在于配合类型收窄使用:

1. typeof 类型守卫

function processValue(value: unknown): string {
  if (typeof value === 'string') {
    return value.toUpperCase();  // ✅ value 是 string
  }
  
  if (typeof value === 'number') {
    return value.toFixed(2);     // ✅ value 是 number
  }
  
  if (typeof value === 'boolean') {
    return value ? 'true' : 'false';  // ✅ value 是 boolean
  }
  
  return 'unknown type';
}

posted @ 2026-08-29 10:17  howhy  阅读(2)  评论(0)    收藏  举报