小ネタ
TypeScript でライブラリ (npm パッケージ) を作るときに, ビルド用の tsconfig を用意することがあります. 例えば以下のような tsconfig.json を作成したとしましょう. { "compilerOptions": { "rootDir": "src", "outDir": "lib", "target": "esnext", "mo…
Next.js から static export した HTML を S3 に配置して CloudFront から配信する, というのはそこそこよくある構成なんじゃないかと思います. 知らんけど. ところで素朴に CloudFront の origin に S3 を指定するだけでは, ページのパスの解決がうまくいき…
イントロ TypeScript で Array#filter を使うとき, 型が期待通りに絞り込まれないというトラブルがよくあります. const xs: (number | undefined)[] = [1, undefined, 2]; const ys: number[] = xs.filter((x) => x !== undefined); // ~~ // Type '(number …
TypeScript 4.8 がリリースされました. これでやることといえば? そう, 数値リテラル型の符号を入れ替えることですね. type Negate<N extends number> = N extends 0 ? 0 : `${N}` extends `-${infer X extends number}` ? X : `-${N}` extends `${infer X extends number}` ? </n>…
TypeScript (4.7 時点) において, 文字列に付けられる型には以下の 3 つ (とそのユニオン型) があります. 文字列型 string 文字列リテラル型 ("foo" など) テンプレートリテラル型 (`data-${string}` など) これらのうち, 実行時の入力, 特に事前にパターン…
TypeScript 4.7 の optional variance annotations の挙動を若干勘違いしていたのでメモ. 例 1 (Playground): type Extends<A, B> = A extends B ? true : false; type Bivariant<T> = {}; type Bivariant_A0 = Extends<Bivariant<"foo">, Bivariant<"foo" | "bar">>; // true type Biv</bivariant<"foo"></t></a,>…
2023-05-24 追記 改訂 + α 版を書きました. お題 具体例として, ちょうど長さ 3 の文字列のみを引数として受け付ける関数を作ります. こんな関数を作って何がしたいのかは不明. 先出しパターン よくある手段としては「ちょうど長さ 3 の文字列」のような制約…
TypeScript 4.1 で再帰的な conditional type の定義に制限がなくなり (ref), 今後ますます再帰的な型定義をする / 触れることが多くなろうかと思います. 一方で TypeScript が型をインスタンス化する際の再帰の上限はそこそこ厳しく, ちょっと複雑なことを…
※この記事に含まれる内容は TypeScript 4.1 のプレビュー版のものです. 今後仕様が変わり動かなくなる可能性もありますのでご注意ください. 話題の template string types で早速遊んでみます. ゴール .foo[1].bar といった形のパス文字列を型レベルで解析し…
つい先日 TypeScript 4.0 RC がリリースされました. めでたいですね. さて TS 4.0 の目玉機能といえばなんといっても variadic tuple types ですが, これが型レベルで自然数の計算をしたいナウなヤングにバカウケということで, 界隈では一時期のタピオカミル…
TypeScript で Haskell にあるような GADT (Generalized Algebraic Data Type) っぽいものをどう表現できるかという話. GADT を使いたくなる例 式をデータとして表現したいことありますよね. あると言ってくれ. 例えば数値と数値上の関数, そして関数適用が…
TypeScript の型システムはチューリング完全ということが知られていますが, 同じくチューリング完全な言語である Brainfuck のインタプリタを実装することで, その計算能力を確認することができます. この記事のコードは TypeScript 3.8.3 で動作確認してい…
こんなことがやりたかったんじゃないし, 誰もそんなこと望んじゃいない. でもやる. 動作確認している TypeScript のバージョンは 3.8.3 です. ゴール TypeScript で階乗を計算します. 型レベルで. type F = Factorial<3>; // F = 6 アイデア まずタプル型の …
遊びです. 真に受けないでください. 動作確認している TypeScript のバージョンは 3.8.3 です. ゴール タプル型 XS から, 要素の置換 (permutations) の union 型を作る Permutations<XS> を作ります. type P = Permutations<["A", "B", "C"]>; // P = ["A", "B"</xs>…
↓ に対するアンサーソングです. blog.3qe.us 例えばこういう感じの型 T があって, ネストされた内側にある baz の型を number から string に書き換えたいとしますね. type T = { foo: { bar: { baz: number, }, }, }; もしこれが, 書き換える対象のパスを […
この記事は はてなエンジニア Advent Calendar 2019 15 日目の記事です. 昨日は id:polamjag さんによる Next.js で Google Analytics を使う・2019年冬 - polamjaggy でした. qiita.com こんにちは, Mackerel 開発チームでアプリケーションエンジニアをして…
未来人のみなさまご機嫌いかがでしょうか. この記事が書かれた時点の TypeScript のバージョンは 3.6.4 です. お題 以下の JavaScript の関数に TypeScript で型をつけることを考えます1. function makeDict(prop, entries) { const dict = {}; for (const e…
突然思い出して随分前のネタを引っ張り出してきました. OCaml と Scala のパターンマッチ構文は共に match というキーワードを使いますが, 前置 / 後置が異なるため, 交互に書いていると混乱して結構な頻度で間違えます. let y = match x with | Some n -> n…
みなさんも生きていればコマンドの出力をブログに貼り付けたいということがあるでしょう. というわけでコマンド出力をなんとか HTML にして貼り付ける方法のご紹介です. TL; DR: script -q /dev/null <command> | ansi2html -i | pbcopy まず HTML は基本的には以下の</command>…
気が向いたらそのうちサンプルコードとか付けてちゃんと書きます. 向かなければそのままです. ドラッグ&ドロップには色々な要素が絡んでくる バグが入り込みやすい どうテストしたら良いか? / どうバグを再現したら良いか? 「なんかある操作をしたらバグった…
ステマ記事です. みなさん Cookie Clicker を覚えていますか これです. 昔一瞬流行ったなあ, という感想が出てくることを予想してますが (ついこの前言われた), まだまだ続けている人はいて, 私もその一人です. 過去の記事: Mackerel とは はてなが開発して…
コピペしやすくて便利. 右上に言語名を表示するやつ とくっつけてもいいけど, 多分別々に書いても動くことには動くはず. <script type="text/javascript"> window.addEventListener("load", function onLoad() { window.removeEventListener("load", onLoad); var codes = document.querySel…
こういう感じのスタイルシートを当てておいて, pre.code { position: relative; } pre.code[data-lang-label]::before { content: attr(data-lang-label); font-family: 'Helvetica Neue', 'Helvetica', 'Arial', 'Hiragino Kaku Gothic Pro', 'Meiryo', 'MS…
公式は覚えるものではなく, 必要に応じて導出するものだよ (?) 不動点オペレータ 不動点オペレータ (大抵 fix という名前, コンビネータ計算の文脈では Y とも) は Haskell では以下のように定義される関数である. fix f = f (fix f) つまり, fix f は関数 f…
開いているファイルの管理は tree-view-panes で行っていて, そのためのタブは必要ない とはいえ Dock のタブまで消えてしまうと移動ができなくて困る というわけで以下のようにしている. .tab-bar { display: none; } atom-dock .tab-bar { display: flex; }
2019-02-12 追記 この情報は古くなっている / 間違っている可能性があるので参照しないでください. 最新の情報は https://docs.npmjs.com/misc/scripts とかからどうぞ. npm@4.5 時点. 適当に書いていると (主に prepublish/prepare/prepublishOnly あたりで…
詳しくはこちらのブログ記事を参考にしてください (1.16 のリリース記事ですが, 下の方に 1.17 beta についても書いてあります). blog.atom.io 1.16 以前のイメージ Workspace Left Panel(Tree View) Pane 1 Text Editor 1 Text Editor 2 Pane 2 Settings Te…
株式会社はてなに入社しました 株式会社はてなに入社しました - hitode909の日記
余談 どうでもいいようなことを投稿するための「小ネタ」カテゴリを作った. 誰もお前に聞いてないとか, そういう感想歓迎です. 本編 node foobar.js の代わりに, node --prof foobar.js みたいにすると isolate-0x***-v8.log みたいなファイルができる. これ…