例えば、こういうリストを持つStateがあったときに、 const [sampleData, setSampleData] = useState<number[]>([1, 2, 3, 4, 5, 6, 7, 8, 9, 10]) リスト表示して、そのうちのどれかを加算できるようにしようとすると、最初こういうコードを書いていた。 <div> {sampleData</div></number[]>…

as constすると、配列とかオブジェクトリテラルはそのものズバリの型になる。type MyType = ["hello", "world"] as constは string[]ではなく、["hello", "world"] という型となる。 するとルックアップ型で参照して派生型が作れるねという話。 type Output<T extends { name: string }[]> </t>…

ちょっと事情があってマウス座標が欲しかったのです。 import { render } from 'preact' import { useCallback, useState } from 'preact/hooks' function App() { let a = 0 const [mousePoint, setMousePoint] = useState<[number, number]>([0, 0]) const…

特に理由もきちんと追えてないけど、ハマったやつもう一つ。最初 async function と Promise の固有の挙動かなと思ったけどそうではなかった。 // これは期待通り Rが推論される function sample<P, R, F extends (params: P) => { result: R }>(f: F, params: P) : R { return f(params).re</p,>…

最初どうしてコンパイル通らないのか納得いかなかった function sample<T extends () => string>(f: T): ReturnType<T> { return f() // コンパイルエラーとなる } これがコンパイルエラーとなり、Type 'string' is not assignable to type 'ReturnType<T>' と言われてしまう。なん</t></t></t>…

function wrapper<T extends (...args: any) => { Status: number, Result: any }>(f: T): T { return f } これを書き換えて、 function wrapper<T extends (...args: any) => { Status: number, Result: any }>(f: T, ...params: Parameters<T>): ReturnType<T> { return f(...params) // Type '{ Status: number; Result: </t></t></t></t>…