ツイートをまとめてテキスト化するUserScript、もしくはjQuery風にDOMAPIを拡張した話
自分のメモ帳にツイートを引用したい、けど一応出典がわかるようにユーザー名とIDは残したい、で連ツイまとめるの面倒、ということで作りました。
切り取り線botで試すとこんな感じ。
拡張したもの
基本的な方針として、コンテナオブジェクトを作ったりすることはせず、素材の味を生かす方向で。イベント周りもthisどうのとか戻り値どうのとかせず、addEventListenerそのまま。まあ今回はそれで十分だったというのも大きいですが。
$()相当の関数：fragment(), $, $$
こういう使い方だとJSで組み立てるのは実装も使う側も面倒なので、innerHtmlに丸投げするのが手軽ですね。$と$$はChromeのCommandLineAPIの真似。- 短縮：find, findAll
これはquerySelectorとquerySelectorAllをそのままコピーしてます。 - 短縮＋メソッドチェイン化：on
他にもあるとおもってchain関数を作ったのにここでしか使ってない。 - メソッド化：text、val
- 配列のあれこれ：map、filter等々
全部・・・は流石にあれなのでピックアップして移植しましたが、実際に使ったのはmapだけ。ちなみにCommandLineAPIだとNodeListじゃなくてただの配列が返ってくるので普通に使えます。 - 新規実装：hide/show
これはjQuery本体でもv3でテコ入れが入ったように、最初から消えてる要素のshowをサポートすると面倒なので、あくまで隠して戻すという形に。元のdisplay値の置き場に悩んだ結果、showを動的生成することにしました。
DocumentFragmentやNodeListに対しての一括操作はちょっと迷ったので保留。あれは確かに便利だったけど、一要素なら直接Element触ればいいし。
結果として本体10行弱のために30行ほどかけて拡張した感じになりました。
プロトタイプ汚染がー
はい。C#の拡張メソッドみたいにusingできるといいんですけどね。
といいつつ今になってシンボルの存在を思い出した。気が向いたらこっちに書き直すかも。
