1. 導入：なぜMath.truncが必要なのか
フロントエンド開発において、APIから取得したデータや計算結果の「端数処理」は頻繁に発生します。特に、金額計算や座標、グリッドシステムの計算において、小数点以下を単純に切り捨てたい場面は少なくありません。これまで、ビット演算子（~~）やparseIntなどによる代用が一般的でしたが、これらは可読性や挙動において懸念がありました。Math.truncは、数値を「より安全かつ直感的」に切り捨てるための標準APIであり、コードの堅牢性を高めるために必須の知識です。
2. 基礎知識：Math.truncとは何か
Math.truncは、引数として渡された数値の「小数点以下の桁を取り除き、整数部分だけを返す」メソッドです。ES6（ECMAScript 2015）で導入されました。
重要なのは、他の数値メソッドとの違いです。
Math.floor：数値を負の無限大方向に丸める（-1.5なら-2になる）
Math.ceil：数値を正の無限大方向に丸める（1.5なら2になる）
Math.trunc：単純に小数点以下を「削る」（-1.5なら-1になる）
この「単純な切り捨て」という挙動は、特に座標計算や、負の数を含む計算結果を扱う際にバグを防ぐ重要な特性となります。
3. 実装と解決策
Math.truncの使い方は非常にシンプルですが、現場では「数値変換」と組み合わせて使うことが一般的です。もし引数が数値でない場合、内部的にNumber()へ型変換が試みられるため、文字列形式の数値データに対しても柔軟に対応可能です。
4. サンプルプログラム
以下は、フロントエンド開発でよく遭遇する「数値の正規化」を想定したサンプルコードです。
// 数値の切り捨てテスト
const positiveValue = 12.85;
const negativeValue = -12.85;
const stringValue = "45.67";
// Math.truncによる切り捨て
console.log(Math.trunc(positiveValue)); // 結果: 12
console.log(Math.trunc(negativeValue)); // 結果: -12（負の場合も0方向に切り捨てられる）
// 実務的な活用：文字列入力の正規化
function getIntegerPart(input) {
const num = Number(input);
// NaN（数値ではない値）チェックを行うことで、予期せぬエラーを回避する
if (isNaN(num)) {
return 0;
}
return Math.trunc(num);
}
console.log(getIntegerPart(stringValue)); // 結果: 45
console.log(getIntegerPart("invalid")); // 結果: 0
5. 応用・注意点
現場でMath.truncを採用する際、特に意識すべき注意点が2つあります。
ブラウザ互換性：
Math.truncはIE（Internet Explorer）をサポートしていません。IEを考慮する必要があるレガシーなプロジェクトでは、ポリフィル（polyfill）を追加するか、以下の代替コードを利用してください。
// IE用ポリフィル（簡略版）
if (!Math.trunc) {
Math.trunc = function(v) {
return v < 0 ? Math.ceil(v) : Math.floor(v);
};
}
ビット演算子との違い：
以前のJavaScriptでは、数値を整数化するために「~~」演算子を使う手法が流行しました。しかし、これは32ビット整数に変換するという制約があるため、2,147,483,647を超える大きな数値を扱うと正しく動作しません。Math.truncは大きな数値でも正確に動作するため、可読性と安全性の観点から、今後はMath.truncの使用を推奨します。
これらの知識を活かし、より明確で意図の伝わりやすいコードを書いていきましょう。