[JavaScript]keydownイベントで最初のみ処理を実行する方法

テキストボックスに文字列を入力して、エンターキーを押したらAPIを呼ぶという動きを実装することはよくあると思います。

そういう場合、keydownイベントで取得したKeyboardEventオブジェクトでEnterキーかどうか判断してAPIを呼ぶという処理にしますが、たまにずっとEnterキーを押し続けている人がいて連続でAPIが呼ばれることがありました。

この対策として、以前APIを読んだ時間を記憶しておいて、そこからしばらくはAPIを呼ばないようにする処理が必要かと思っていたのですが、最近、KeyboardEventオブジェクトにはrepeatというプロパティがあり、そこで連続で呼び出されたのかどうかの判断ができるということを知りました。
KeyboardEvent.repeat – Web API | MDN

つまり、repeatプロパティがfalseである場合のみ処理を実行するようにしたら、最初の一回のみしか呼ばれなくなります。

以下、サンプルです。上のテキストボックスにフォーカスをあててエンターキーを押しつづけると、その横の数値が連続でインクリメントされますが、下だと押し続けても最初一度しかインクリメントされません(もちろん、離してから再度押すとまたインクリメントされます)

See the Pen
JavaScriptのkeydownで最初の一回のみイ実行する方法 by amano225 (@amano225)
on CodePen.

長いことJavaScript触ってるのですが、知らなかったです…。