TypeScript 5.3

导入属性

TypeScript 5.3支持导入属性提案的最新更新。

导入属性的一个用例是向运行库提供有关模块预期格式的信息。

 
// We only want this to be interpreted as JSON,
// not a runnable/malicious JavaScript file with a `.json` extension.
import obj from "./something.json" with { type: "json" };

这些属性的内容不会被TypeScript检查,因为它们是特定于主机的,并且只是单独留下,以便浏览器和运行时可以处理它们(可能是错误)。

 
// TypeScript is fine with this.
// But your browser? Probably not.
import * as foo from "./foo.js" with { type: "fluffy bunny" };

动态import()调用也可以通过第二个参数使用导入属性。

 
const obj = await import("./something.json", {
with: { type: "json" }
});

第二个参数的预期类型由一个名为ImportCallOptions的类型定义,默认情况下,该类型只需要一个名为with的属性。

请注意,导入属性是早期称为“导入断言”的提案的演变 最明显的区别是使用with关键字而不是assert关键字。 但不太明显的区别是,运行时现在可以自由地使用属性来指导导入路径的解析和解释,而导入断言只能在加载模块后断言某些特性。

随着时间的推移,TypeScript将弃用旧的导入断言语法,而支持拟议的导入属性语法。 使用assert的现有代码应该迁移到with关键字。 需要导入属性的新代码应该独占地使用with

我们 我们

稳定支持 resolution-mode 导入类型

在TypeScript 4.7中,TypeScript在resolution-mode中添加了对/// <reference types="..." />属性的支持,以控制是否应该通过importrequire语义解析说明符。

 
/// <reference types="pkg" resolution-mode="require" />
// or
/// <reference types="pkg" resolution-mode="import" />

一个相应的字段也被添加到纯类型导入的导入断言中; 然而,它只在TypeScript的夜间版本中得到支持。 理由是,在精神上,导入断言并不打算指导模块解析。 因此,该功能在夜间模式下进行了试验,以获得更多的反馈。

但是考虑到import属性可以指导解析,并且我们已经看到了合理的用例,TypeScript 5.3现在支持resolution-modeimport type属性。

 
// Resolve `pkg` as if we were importing with a `require()`
import type { TypeFromRequire } from "pkg" with {
"resolution-mode": "require"
};
// Resolve `pkg` as if we were importing with an `import`
import type { TypeFromImport } from "pkg" with {
"resolution-mode": "import"
};
export interface MergedType extends TypeFromRequire, TypeFromImport {}

这些导入属性也可以用于import()类型。

 
export type TypeFromRequire =
import("pkg", { with: { "resolution-mode": "require" } }).TypeFromRequire;
export type TypeFromImport =
import("pkg", { with: { "resolution-mode": "import" } }).TypeFromImport;
export interface MergedType extends TypeFromRequire, TypeFromImport {}

欲了解更多信息,请查看此处的更改

resolution-mode 支持所有模块模式

以前,仅允许在resolution-mode选项moduleResolutionnode16下使用nodenext。 为了更容易地查找专门用于类型目的的模块,resolution-mode现在可以在所有其他moduleResolution选项(如bundlernode10)中正常工作,并且在classic下不会出错。

有关详细信息,请参阅实现pull request。

switch (true) 缩小

TypeScript 5.3现在可以基于case中每个switch (true)子句中的条件执行收缩。

 
function f(x: unknown) {
switch (true) {
case typeof x === "string":
// 'x' is a 'string' here
console.log(x.toUpperCase());
// falls through...
case Array.isArray(x):
// 'x' is a 'string | any[]' here.
console.log(x.length);
// falls through...
default:
// 'x' is 'unknown' here.
// ...
}
}

这个功能是由Mateusz Burzyovski率先开始的 我们想表达一个“谢谢”对于这种贡献。

缩小与布尔值比较的范围

有时候,你可能会发现自己在一个条件下与truefalse进行直接比较。 通常这些都是不必要的比较,但您可能更喜欢它作为一种风格,或者避免围绕JavaScript真实性的某些问题。 无论如何,以前的TypeScript在执行收缩时无法识别这样的表单。

TypeScript 5.3现在在缩小变量时保持并理解这些表达式。

 
interface A {
a: string;
}
interface B {
b: string;
}
type MyType = A | B;
function isA(x: MyType): x is A {
return "a" in x;
}
function someFn(x: MyType) {
if (isA(x) === true) {
console.log(x.a); // works!
}
}

我们

instanceof 缩小范围 Symbol.hasInstance

JavaScript的一个稍微深奥的特性是可以覆盖instanceof操作符的行为。 为此,instanceof操作符右侧的值需要有一个名为Symbol.hasInstance的特定方法。

 
class Weirdo {
static [Symbol.hasInstance](testedValue) {
// wait, what?
return testedValue === undefined;
}
}
// false
console.log(new Thing() instanceof Weirdo);
// true
console.log(undefined instanceof Weirdo);

为了在instanceof中更好地建模这种行为,TypeScript现在检查是否存在这样的[Symbol.hasInstance]方法,并将其声明为类型谓词函数。 如果是,则instanceof操作符左侧的测试值将由该类型谓词适当地缩小。

 
interface PointLike {
x: number;
y: number;
}
class Point implements PointLike {
x: number;
y: number;
constructor(x: number, y: number) {
this.x = x;
this.y = y;
}
distanceFromOrigin() {
return Math.sqrt(this.x ** 2 + this.y ** 2);
}
static [Symbol.hasInstance](val: unknown): val is PointLike {
return !!val && typeof val === "object" &&
"x" in val && "y" in val &&
typeof val.x === "number" &&
typeof val.y === "number";
}
}
function f(value: unknown) {
if (value instanceof Point) {
// Can access both of these - correct!
value.x;
value.y;
// Can't access this - we have a 'PointLike',
// but we don't *actually* have a 'Point'.
value.distanceFromOrigin();
}
}

正如你在这个例子中看到的,Point定义了自己的[Symbol.hasInstance]方法。 它实际上充当了一个名为PointLike的单独类型的自定义类型保护。 在函数f中,我们能够用valuePointLike缩小到instanceof,但不能缩小到Point。 这意味着我们可以访问属性xy,但不能访问方法distanceFromOrigin

有关更多信息,您可以在这里阅读有关此更改的信息。

检查 super 实例字段上的属性访问

在JavaScript中,可以通过super关键字访问基类中的声明。

 
class Base {
someMethod() {
console.log("Base method called!");
}
}
class Derived extends Base {
someMethod() {
console.log("Derived method called!");
super.someMethod();
}
}
new Derived().someMethod();
// Prints:
// Derived method called!
// Base method called!

这与编写类似this.someMethod()的代码不同,因为这可能会调用重写的方法。 这是一个微妙的区别,更微妙的是,如果一个声明从来没有被重写过,这两者通常可以互换。

 
class Base {
someMethod() {
console.log("someMethod called!");
}
}
class Derived extends Base {
someOtherMethod() {
// These act identically.
this.someMethod();
super.someMethod();
}
}
new Derived().someOtherMethod();
// Prints:
// someMethod called!
// someMethod called!

问题是它们可以互换使用,因为super只对在原型上声明的成员有效,而不是实例属性。 这意味着如果你写了super.someMethod(),但是someMethod被定义为一个字段,你会得到一个运行时错误!

 
class Base {
someMethod = () => {
console.log("someMethod called!");
}
}
class Derived extends Base {
someOtherMethod() {
super.someMethod();
}
}
new Derived().someOtherMethod();
// 💥
// Doesn't work because 'super.someMethod' is 'undefined'.

TypeScript 5.3现在更仔细地检查super属性访问/方法调用,以查看它们是否对应于类字段。 如果它们这样做了,我们现在将得到一个类型检查错误。

这张支票是由Jack Works提供的!

类型的交互式嵌体提示

TypeScript的inlay提示现在支持跳转到类型的定义! 这使得轻松浏览代码变得更加容易。

Ctrl-clicking an inlay hint to jump to the definition of a parameter type.

在这里查看更多的实现。

首选设置 type 自动导入

以前,当TypeScript为类型位置中的内容生成自动导入时,它会根据您的设置添加type修饰符。 例如,当在下面的Person上获得自动导入时:

 
export let p: Person

TypeScript的编辑经验通常会为Person添加一个导入:

 
import { Person } from "./types";
export let p: Person

在某些设置下,如verbatimModuleSyntax,它会添加type修饰符:

 
import { type Person } from "./types";
export let p: Person

然而,也许你的代码库不能使用其中的一些选项;或者你只是在可能的情况下偏好显式的type导入。

随着最近的变化,TypeScript现在使其成为特定于编辑器的选项。 在Visual Studio Code中,您可以在UI中的“TypeScript ›首选项:首选仅自动导入类型”下启用它,或者作为JSON配置选项typescript.preferences.preferTypeOnlyAutoImports

通过跳过JSDoc解析进行优化

当通过tsc运行TypeScript时,编译器现在将避免解析JSDoc。 这不仅减少了解析时间,而且还减少了存储注释所占用的内存,沿着减少了垃圾收集所花费的时间。 总而言之,您应该会在--watch模式下看到更快的编译和更快的反馈。

具体的变化可以在这里看到。

因为不是每个使用TypeScript的工具都需要存储JSDoc(例如typescript-eslint和Prettier),所以这种解析策略已经作为API本身的一部分出现。 这可以使这些工具获得与我们为TypeScript编译器带来的相同的内存和速度改进。 注释解析策略的新选项在JSDocParsingMode中描述。 有关此拉取请求的更多信息。

通过比较非规范化相交进行优化

在TypeScript中,联合和交集始终遵循特定的形式,其中交集不能包含联合类型。 这意味着当我们在像A & (B | C)这样的并集上创建一个交集时,该交集将被规范化为(A & B) | (A & C)。 但是,在某些情况下,类型系统仍将保持原始形式以用于显示目的。

原来,原始形式可以用于类型之间的一些聪明的快速比较。

例如,假设我们有SomeType & (Type1 | Type2 | ... | Type99999NINE),我们想看看它是否可以分配给SomeType。 回想一下,我们并没有真正的交集作为我们的源类型-我们有一个看起来像(SomeType & Type1) | (SomeType & Type2) | ... |(SomeType & Type99999NINE)的联合。 当检查一个联合体是否可以赋值给某个目标类型时,我们必须检查联合体的每个成员是否都可以赋值给目标类型,这可能会非常慢。

在TypeScript 5.3中,我们可以看到我们能够隐藏的原始交集形式。 当我们比较类型时,我们做一个快速检查,看看目标是否存在于源交集的任何组成部分中。

有关详细信息,请参阅此pull request。

合并之间 tsserverlibrary.jstypescript.js

TypeScript本身提供了两个库文件:tsserverlibrary.jstypescript.js。 有一些API只在tsserverlibrary.js中可用(如ProjectService API),这可能对某些导入程序有用。 尽管如此,这两个包是不同的,有很多重叠,在包中重复代码。 更重要的是,由于自动导入或肌肉记忆,始终使用一个而不是另一个可能具有挑战性。 意外加载两个模块太容易了,代码可能无法在API的不同实例上正常工作。 即使它确实有效,加载第二个bundle也会增加资源使用。

鉴于此,我们决定将两者合并。 typescript.js现在包含tsserverlibrary.js曾经包含的内容,tsserverlibrary.js现在只是重新导出typescript.js。 对比此次整合前后,我们发现封装尺寸减少了以下几点:

之前Diff差异(百分比)
包装6.90 MIB5.48 MIB-1.42 MiB-20.61%
解包38.74 MiB30.41 MiB-8.33 MiB-21.50%
之前Diff差异(百分比)
lib/tsserverlibrary.d.ts570.95 KiBB-570.10 KiB-99.85%
lib/tsserverlibrary.js8.57 MIBB-8.57 MiB-99.99%
lib/typescript.d.ts396.27 KiB570.95 KiB+174.68 KiB+44.08%
lib/typescript.js7.95 MIB8.57 MIB+637.53 KiB+7.84%

换句话说,封装尺寸减少了20.5%以上。

有关更多信息,您可以在此处查看所涉及的工作。

突破性变化和正确性改进

lib.d.ts 变化

为DOM生成的类型可能会对您的代码库产生影响。 有关更多信息,请参阅TypeScript 5.3的DOM更新。

检查 super 访问实例属性

TypeScript 5.3现在可以检测到super.属性访问引用的声明是类字段并发出错误。 这可以防止在运行时可能发生的错误。

在这里查看更多关于此更改的信息。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/206403.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

处理分类问题的不平衡数据的 5 种技术

一、介绍 分类问题在机器学习领域很常见。正如我们所知&#xff0c;在分类问题中&#xff0c;我们试图通过研究输入数据或预测变量来预测类标签&#xff0c;其中目标或输出变量本质上是分类变量。 如果您已经处理过分类问题&#xff0c;那么您一定遇到过以下情况&#xff1a;其…

Netty Review - 探索Pipeline的Inbound和Outbound

文章目录 概念Server CodeClient CodeInboundHandler和OutboundHandler的执行顺序在InboundHandler中不触发fire方法InboundHandler和OutboundHandler的执行顺序如果把OutboundHandler放在InboundHandler的后面&#xff0c;OutboundHandler会执行吗 概念 我们知道当boss线程监控…

[ACTF2020 新生赛]BackupFile

打开题目就一句话&#xff1a;尝试找到源文件 和上一题一样&#xff0c;用dirsearch扫描网站找到了一下内容 flag.php&#xff0c;0B&#xff0c;虚假flag 瞅一眼index.php.bak是啥 下载了一个文件&#xff0c;把bak后缀删掉&#xff0c;打开了index.php源码 is_numeric()&am…

【驱动】串口驱动分析(二)-tty core

前言 tty这个名称源于电传打字节的简称&#xff0c;在linux表示各种终端&#xff0c;终端通常都跟硬件相对应。比如对应于输入设备键盘鼠标&#xff0c;输出设备显示器的控制终端和串口终端。也有对应于不存在设备的pty驱动。在如此众多的终端模型之中&#xff0c;linux是怎么…

uniapp IOS从打包到上架流程(详细简单)

​ uniapp IOS从打包到上架流程&#xff08;详细简单&#xff09; 原创 1.登入苹果开发者网站&#xff0c;打开App Store Connect ​ 2.新App的创建 点击我的App可以进入App管理界面&#xff0c;在右上角点击➕新建App 即可创建新的App&#xff0c;如下图&#xff1a; ​ 3.…

FFmpeg命令分隔视频

有一个视频如a.mp4&#xff0c;此视频采用帧率为30生成&#xff0c;共有299帧&#xff0c;这里通过FFmpeg命令分隔成1秒一个个的小视频&#xff0c;即每个小视频帧数为30帧。 用到的FFmpeg参数如下所示&#xff1a; (1).-i:指定输入视频文件的名称&#xff1b; (2).-c:指…

人工智能驱动的医疗辅助:陪诊系统的技术原理与应用

随着人工智能技术的不断发展&#xff0c;医疗领域也迎来了新的可能性。本文将深入探讨陪诊系统的技术原理及其在医疗领域中的应用。我们将重点关注人工智能的核心概念&#xff0c;如自然语言处理、机器学习和语音识别&#xff0c;以解释陪诊系统是如何在医疗环境中发挥作用的。…

Linux:文件系统初步理解

文章目录 文件的初步理解C语言中对文件的接口系统调用的接口位图的理解open调用接口 文件和进程的关系进程和文件的低耦合 如何理解一切皆文件&#xff1f; 本篇总结的是关于Linux中文件的各种知识 文件的初步理解 在前面的文章中有两个观点&#xff0c;1. 文件 内容 属性&…

设计模式之装饰模式(2)--有意思的想法

目录 背景概述概念角色 基本代码分析❀❀花样重难点聚合关系认贼作父和认孙做父客户端的优化及好处继承到设计模式的演变过程 总结 背景 这是我第二次写装饰模式&#xff0c;这一次是在上一次的基础上进一步探究装饰模式&#xff0c;这一次有了很多新的感受和想法&#xff0c;也…

Maxwell安装部署消费到kafka集群

1.上传安装包到linux系统上面 2.解压安装包到安装目录下&#xff0c;并且重命名 [rootVM-4-10-centos package]# tar -zxvf maxwell-1.29.2.tar.gz -C /opt/software/3.配置mysql 增加以下配置 #数据库id server-id 1 #启动binlog&#xff0c;该参数的值会作为binlog的文件…

phpoffice在tp框架中如何实现导入导出功能

安装 phpoffice/phpspreadsheet 库 composer require phpoffice/phpspreadsheet 导入功能 创建一个用于上传文件的视图&#xff0c;可以使用元素来实现文件上传。 <!-- application/view/your/import.html --><form action"{:url(your/import)}" method&q…

ros2智能小车中STM32地盘需要用到PWM的模块

我做的地盘比较简单&#xff0c;使用了一下模块&#xff1a; 4个直流减速电机&#xff0c;&#xff08;每个模块用到了一个PWM&#xff09;---这会通过L298N的ENA,ENB来实现控制 光电对射测速模块&#xff08;不用PWM) 超声波测距模块&#xff08;不用PWM&#xff0c;只需要…

AcWing 3555:二叉树(北京大学考研机试题)→公共父结点

【题目来源】https://www.acwing.com/problem/content/description/3435/【题目描述】 如下图所示&#xff0c;由正整数 1, 2, 3, … 组成了一棵无限大的&#xff08;满&#xff09;二叉树。 1/ \2 3/ \ / \4 5 6 7 /\ /\ /\ /\ ... ... 从任意一个结点到根结点&…

记一次处理大数据而导致的内存溢出问题

问题 订单服务通过MQ进行订单同步时&#xff0c;刚启动可以正常消费&#xff0c;但是跑一会就会卡住&#xff0c;每次都是第8个kafka分区不行再进行消费&#xff0c;其他分区消费的很慢。 现象 首先&#xff0c;CPU超高&#xff0c;达到百分之300多&#xff1b;其次&#xf…

如何使用Qchan搭建更好保护个人隐私的本地图床并在公网可访问

文章目录 前言1. Qchan网站搭建1.1 Qchan下载和安装1.2 Qchan网页测试1.3 cpolar的安装和注册 2. 本地网页发布2.1 Cpolar云端设置2.2 Cpolar本地设置 3. 公网访问测试总结 前言 图床作为云存储的一项重要应用场景&#xff0c;在大量开发人员的努力下&#xff0c;已经开发出大…

Redis的持久化(新)

Redis中数据都保存在内存&#xff0c;但是内存中的数据变换很快&#xff0c;也很容易丢失&#xff0c;比如连接断开、宕机停机等等。而Redis提供的数据持久化机制有RDB(Redis DataBase)和AOF(Append Only File)。 1.RDB RDB是指在指定的时间间隔内将内存中的数据集快照写入到磁…

CodeTON Round 7 (Div. 1 + Div. 2, Rated, Prizes!)

B. AB Flipping 老规矩&#xff0c;自己要模拟一遍样例&#xff0c;发现样例还不够&#xff0c;就自己构造样例&#xff0c;这样做着做着就会有思路。 分析&#xff1a;假如现在有这样一个字符串 BBBAABABBAAA。会发现前三个和后三个一定是不会被操作的&#xff0c;因为不会满…

git-2

1.分离头指针情况下的注意事项 分离头指针指的是变更没有基于某个branch去做&#xff0c;所以当进行分支切换的时候&#xff0c;在分离头指针上产生的commit&#xff0c;很可能会被git当作垃圾清理掉&#xff0c;如果你认为是重要的内容&#xff0c;切记需要绑定分支 2.进一步…

人工智能基础_机器学习050_对比sigmoid函数和softmax函数的区别_两种分类器算法的区别---人工智能工作笔记0090

可以看到最上面是softmax的函数对吧,但是如果当k = 2 那么这个时候softmax的函数就可以退化为sigmoid函数,也就是 逻辑斯蒂回归了对吧 我们来看一下推导过程,可以看到上面是softmax的函数 可以看到k=2 表示,只有两个类别对吧,两个类别的分类不就是sigmoid函数嘛对吧,所以说 …

关闭vscode打开的本地服务器端口

vscode开了本地的一个端口“8443”当本地服务器端口&#xff0c;然后随手把VScode一关&#xff0c;后来继续做发现8443端口已经被占用了。   原来&#xff0c;即便关闭了编译器VScode&#xff0c;服务器依然是被node.exe运行着的。那这个端口怎么才能关掉呢&#xff1f;   …