Runtyperは、JavaScriptコードの実行中にタイプチェックを直接実行するBabelのプラグインです。 たとえば、文字列と数値の厳密な比較などの誤った操作を検出し、コンソールに警告をスローします。 これにより、追加のコード注釈を必要とせずに、入力エラーを早い段階で見つけることができます。
正確に何を見つけますか
現時点では、厳密な比較と算術演算で型がチェックされます。 つまり、コードで次のいずれかの状況が発生すると、警告が表示されます。
1 === "1" // Strict compare of different types: 1 (number) === "1" (string) [1, 2] + true // Numeric operation with non-numeric value: "[1,2]" (object) + true (boolean) 42 * null // Numeric operation with non-numeric value: 42 (number) * null ...
JavaScriptはこのような操作を静かに飲み込みますが、ほとんどの場合、誤字、不注意、または単なるバグです。
仕組み
内部では、Runtyperはマルハナバチによって提供されたASTツリーデータを使用します。 プラグインは、引数のタイプを追加でチェックする関数で比較演算子と算術演算子をラップします。
たとえば、次のとおりです。
if (x === y) { ... }
次のようになりました（簡略化）。
if (strictEqual(x, y)) { ... } function strictEqual(a, b) { if (typeof a !== typeof b) { console.warn('Strict compare of different types: ' + (typeof a) + ' === ' + (typeof b)); } return a === b; }
静的解析について
実行時の型分析は、たとえばFlowを使用した静的分析を除外しません。 むしろそれを補完し、静的に検出するのが難しいエラーを見つけます。 たとえば、ユーザーイベントや、タイプアノテーションがまだない外部ライブラリから到着するデータ。
静的解析でエラーが検出されないドキュメントの例を示しますが、コードを実行すると、Runtyperは警告をスローします。
function square(n) { return n * n; // Numeric operation with non-numeric value: "Vasya" (string) * "Vasya" (string) } window.document.getElementById('username').addEventListener('change', function (event) { square(event.target.value); });
もちろん、実行時のチェックの欠点は、特定のコード行が実行されたときにのみチェック自体が発生することです。 行が実行されたことがない場合、チェックは行われません。 そのため、最も正しいのは、開発アセンブリとテストを実行するステージングにプラグインを含めることです。
しかし、明確なプラスは、注釈を記述する必要がないことです:)プラグインを差し込むだけで、コンソールにエラー警告が表示されます。
まとめると
労力をかけずに、プロジェクトにランタイムタイプチェックを簡単に追加できます。 これにより、実稼働前にさらにいくつかのバグをキャッチできます。 ブラウザーおよびNode.jsで機能し、コード注釈は不要です。 ドキュメントと使用例はGitHubにあります 。