<input id="input"/>
<button id="button" onpointerdown="event.preventDefault()" onclick="input.value += ' clicked'">click</button>

键盘仍然激活：pointerdown 里 event.preventDefault

拼音候选消失：input.value 被赋值了

最简单的就是直接把包含所有模型的文件夹 zip 成一个文件，前端发一个请求然后用 in-memory 的 file system 直接 unzip 成 folder, 操作完了要写回去就再 zip 回去。

不知道你这 1000 多个模型，一共有多大。

好比一个 PSD 文件，里面包含多个图层，每个图层有自己的像素信息，前端增删改，保存后它就是一个 PSD 二进制文件啊。

所以你只需要设计一个二进制文件格式，定义好结构

狭义地讲，Media Capture and Streams API 是独立于 WebRTC 的，往往 WebRTC 都会用到 getUserMedia 。

其实要获取媒体流话，用得到 Media Capture 的 getUserMedia API ，编解码方面可以用 WebCodecs API ，不一定要用 WebRTC 传数据，WebRTC 的核心是多端双向通信，略复杂。

做推流，有个比较新的东西是 WebSocket 的升级版， 叫 WebTransport , 基于 HTTP3 的，JS 侧的 API 都是基于 Stream 的，可以进行可靠传输和类似 UDP 一样的不可靠传输。API 还比较新，不一定能在生产环境用。

这里有一个用 getUserMedia + WebCodecs+ WebTransport 做的 video echo 的 demo

https://webrtc.internaut.com/wc/wtSender4/

为什么要覆盖这些？覆盖 $.fn.ready 不就行了？

看来 jQuery 是真老了，没人知道了。

$.fn.ready = function (){

}

@lqzhgood

这里就要说到 ts 的 nominal type checking.

type foo = 0 & {brand: 'foo'}

这里 foo 并不会是 never ，这是 ts 刻意为之的，虽然运行时不可能存在一种值满足这个类型。(但是可以在 ts 层面 as 啊)

type bar = (0 & {brand: 'foo'}) extends 0 ? true : false; // true

function test<T extends TAP_TYPE>(t: T, v: TapTypeMap[T])

T 实际有可能是 TAP_TYPE.LOCAL & {a:1} 或与任意其他 interface 的交叉类型。

打开 strictNullChecks 试试？

This condition will always return true since this function is always defined. Did you mean to call it instead?ts(2774)

#3 借助元组进行联动缩窄的方法很巧妙。

1. switch (t) 缩窄的是变量 t 的类型，并不会影响泛型 T 的范围，就算 T 真能跟随 case 缩窄变化，v:TapTypeMap[T] 也不能获得联动缩窄。T 是一个未知类型，extends 只是约束了这个未知的边界。
2. t 的类型是 TAP_TYPE 的子类型，导致 case 对 t 的类型缩窄失效，此时 t 的类型不再是可缩窄类型。TAP_TYPE 是 enum 类型，类似 union type ，可以缩窄，但从 enum 派生出去的类型不一定可缩窄。


enum TAP_TYPE {
LOCAL,
MAP,
}

interface TAP_LOCAL {
a: string;
}

interface TAP_MAP {
b: string;
}

type TapTypeMap = {
[TAP_TYPE.LOCAL]: TAP_LOCAL;
[TAP_TYPE.MAP]: TAP_MAP;
};

function test<T extends TAP_TYPE>(t: T, v: TapTypeMap[T]): string;
function test(t: TAP_TYPE, v: TapTypeMap[TAP_TYPE]): string {
switch (t) {
case TAP_TYPE.LOCAL:
return (v as TapTypeMap[typeof t]).a;
case TAP_TYPE.MAP:
return (v as TapTypeMap[typeof t]).b;
}
}

集合 A : 有羽毛的动物 ({a: string})
集合 B : 两只脚的动物 ({b: number})

A 和 B 的交集是空集么？不是对吧。AB 在不同方面描述这个东西，交集就是属性叠加，对类型进一步约束。

如果 C 是 A 的子集，C 又是 B 的子集，C 必然是 A 交 B 或其子集。A 和 B 的交集就是既满足 A 又满足 B ，duck type 的缘故，自然很轻松推导出交集的类型。

Http header 优先级高，其次是 meta http-equiv 然后是 meta charset

应用场景是如果 http header 没有声明 charset 或者压根就不存在 http header 比如打开本地 html 文件。

HTML5 还定义了更多的各种 encoding sniff 算法，有可能会存在假定编码先解析。

https://stackoverflow.com/questions/26030572/what-is-the-difference-between-the-charset-in-http-header-and-html-meta

仔细翻了下 Spec ，还是要纠正一下，无论 let const 还是 var ，或者是 function declaration ，class declaration ，这些 identifier 都会在 LexicalEnvironment 中记录，要查找 identifier 也只要查找 LexicalEnvironment 。而 VariableEnvironment 是专门用来管理 variable statement 的，相当于额外放一份，用来处理一些老旧 feature 比如 eval 。

let/const 和 var 的区别在于在初始进入一个 function 或者 script 的时候，只有 top level 的 let/const 会被加入到 LexicalEnvironment ，而 variable statement 声明的 identifier 和 hoistable declaration 声明的 identifier 比如 function 声明，是会在最开始就全部加入到 LexicalEnvironment 中。

实例化一个 block declaration 后，需要创建一个新的 LexicalEnvironment 给到当前的 execution context ，后续的 let/const 是加入到这个 LexicalEnvironment 中了的。比如 for （ let i=0; i<10; i++) { let j; } 这里其实创建了 11 个临时 LexicalEnvironment ，for 语句给 i 创建了一个，每次循环会创建另一个新的，放一个 j （然后销毁）。而 var 是不存在这种考量的，无论几个 for 嵌套，都会在最开始就放入顶层的 LexicalEnvironment 。

不光在开始执行一个 function 会这样处理，在新的 script element ，module 或者 worker 开始执行，都是类似处理。这个顶层 scope 或者说 LexicalEnvironment ， 就是 Global Environment ，Module Environment 和 Function Environment 。

Global Environment 在每个 realm 中只有一个，在 user land 和 globalThis 是等价的，而 var 变量 和 function declaration 的 identifier 能用 globalThis 直接当属性访问也是 Global Environment Record 做的特殊处理，参见 CreateGlobalVarBinding 和 CreateGlobalFunctionBinding 。

Function Environment 在每次 call 一个 function 的时候都会创建，module 同理，在第一次 import 时创建。

一个有趣的例子，这个 early error 是如何产生的呢？

```
(function(){

{

{
{
{
var b
}
}

let b;
}
}

})()
```

Spec 都定义好了，参见 Execution Context 的 LexicalEnvironment 和 VariableEnvironment 。他俩都是 Environment Record ，但是装的东西不一样，一个负责 let const 声明的东西，一个负责 variable statement ，hoisting 还有 with block 的差异处理都在这里规定好了。

不光这样，全局还有个特殊的 Environment Record 叫 Global Environment Records, 全局 var 和 function 会变成 global object 的属性的行为就是在这里定义的。

不要看模板要看最后 render 出来的 DOM 节点。选中那个文字节点，看下 font-family 从哪里来的就知道。说不定有 chrome 插件会往页面塞 CSS 呢。

逻辑别放 Vue component 里，丢一个闭包里，这样油猴脚本就没法从 DOM 节点长驱直入到你的 getParams 方法了。


https://imgur.com/vBjtUMd

@tmtstudio 方法别挂 vue 实例上