TypeScript 4.9 发布！重点新特性解读( 二 ) _TypeScript

这是因为 in 操作符只会严格收窄到实际定义被检查属性的类型，所以 packageJSON 的类型从 unknown 收窄到了 object ，而 object 类型上不存在 name 属性，就会引发报错。
TypeScript 4.9 优化了这个问题，in 操作符更加强大了，它会被收窄为被检查类型和 Record<"property-key-being-checked", unknown> 的交叉类型。。。
比如在上面的例子中，packageJSON 的类型会被收窄为 object & Record<"name",unknown>，这样我们直接访问 packageJSON.name 就没问题了！
interface Context { packageJSON: unknown; } function tryGetPackageName(context: Context): string | undefined { const packageJSON = context.packageJSON; // 检查是否是个对象 if (packageJSON && typeof packageJSON === "object") { // 检查是否存在一个字符串类型的 name 属性 if ("name" in packageJSON && typeof packageJSON.name === "string") { // 可以正常运行！ return packageJSON.name; } } return undefined; }

TypeScript 4.9 还加强了一些关于如何使用 in 操作符的检查，比如左侧要检查的属性必须是 string | number | symbol 类型，而右侧类型必须要可分配给 object 。

accessor 关键字支持
accessor 是 ECMAScript 中即将推出的一个类关键字，TypeScript 4.9 对它提供了支持：
class Person { accessor name: string; constructor(name: string) { this.name = name; } }
accessor 关键字可以为该属性在运行时转换为一对 get 和 set 访问私有支持字段的访问器：

class Person { #__name: string; get name() { return this.#__name; } set name(value: string) { this.#__name = name; } constructor(name: string) { this.name = name; } }

NaN 相等判断警告
NaN 是一个特殊的数值，代表 “非数字”，在 JS 中它和任何值相比较都是 false，包括它自己：

console.log(NaN == 0) // false console.log(NaN === 0) // false console.log(NaN == NaN) // false console.log(NaN === NaN) // false

相对应的，所有值都不等于 NaN：

console.log(NaN != 0) // true console.log(NaN !== 0) // true console.log(NaN != NaN) // true console.log(NaN !== NaN) // true

这其实并不是 JavaScript 特有的问题，因为任何包含 IEEE-754 浮点数的语言都有相同的行为；但 JavaScript 的主要数字类型就是浮点数，并且 JavaScript 中的数字解析为 NaN 还挺常见的，所以在代码中去比较值是否等于 NaN 的情况还挺普遍的。但是正确的做法应该是使用 Number.isNaN 函数来判断。假如你不知道这个问题，就可能引发一些 bug 。
在 TypeScript 4.9 中，如果你直接用一些值和 NaN 相比较，会抛出错误并提示你使用 Number.isNaN：

function validate(someValue: number) { return someValue !== NaN; // ~~~~~~~~~~~~~~~~~ // error: This condition will always return 'true'. // Did you mean '!Number.isNaN(someValue)'? }

return 关键字的定义
在编辑器中，当你对 return 关键字运行 go-to-definition 时，TypeScript 现在会自动跳转到相应函数的顶部。这有助于我们快速了解 return 属于哪个函数。
另外，TypeScript 会将此功能扩展到更多关键字，例如 await、yield、switch、case、default 等等。
最后
TypeScript 团队最近还发布了 5.0 版本的迭代规划（https://github.com/microsoft/TypeScript/issues/51362），这将是 TypeScript 的又一个大的版本，其中包含了很多有趣的想法，还是挺值得期待的！
更多详细更新请查看 TypeScript 官方博客：https://devblogs.microsoft.com/typescript/announcing-typescript-4-9-rc/
你觉得上面哪些更新对你最有用呢？欢迎在评论区和我留言；如果这篇文章帮助到了你，欢迎点赞和关注。