VIDEO LESSON

JavaScriptのMath.trunc():小数部を除いて差分時間を整数の分に変換するの解説動画

再生時間 7:38動画を別のタブで開く ↗
動画の字幕・文字起こしを読む

再生中の字幕を濃い黒で表示し、一番上に追従します。字幕の行を選ぶと、その位置から再生できます。

  1. 0:00こんにちは。
  2. 0:01今回はジャバスクリプトのマス・トランクを紹介します。
  3. 0:05これは、数値の小数部を取り除いて、整数部だけを返す標準のメソッドです。
  4. 0:11特徴は、正の数でも負の数でも、ゼロに近づく方向へ処理することです。
  5. 0:17たとえば予定より百二十五秒遅れたら二分、百二十五秒早ければマイナス二分、
  6. 0:21といった表示を考えてください。
  7. 0:25符号の向きによらず端数だけを落としたい場面で、この関数がぴったり合います。
  8. 0:32この動画では、基本の使い方から、差分時間を分へ変換する完成例、そして間違えやすい注意点までを順に解説します。
  9. 0:41まずは、丸める方向の考え方から確かめていきましょう。
  10. 0:45まず動作環境です。
  11. 0:47マス・トランクはジャバスクリプト標準の組み込みメソッドで、ブラウザーとノード・ジェイエスの両方で利用できます。
  12. 0:54二千十五年七月から主要ブラウザー間で広く利用できる機能とされており、現行のクローム、
  13. 0:59エッジ、ファイアフォックス、サファリで使えます。
  14. 1:03ドムや外部パッケージには依存しないため、同じコードを両方の環境で実行できます。
  15. 1:09記事のサンプルはノード・ジェイエス二十二以降を対象としています。
  16. 1:13古い環境を対象にする場合は、タイプオブで関数かどうかを最初に確認してください。
  17. 1:19ただし、その確認だけで他の構文や機能までは保証できない点には注意が必要です。
  18. 1:24基本の書き方を見ましょう。
  19. 1:26呼び出し方はマス・トランク、かっこ、エックスです。
  20. 1:29引数に数値を一つ渡すと、小数部を取り除いた整数部が返ります。
  21. 1:33たとえば七点八は七に、マイナス七点八はマイナス七になります。
  22. 1:37すでに整数の七を渡せば、そのまま七が返ります。
  23. 1:40マスはコンストラクターではないため、インスタンスを作る必要はなく、直接呼び出します。
  24. 1:45戻り値の型はナンバーのままで、整数専用の別の型になるわけではありません。
  25. 1:50元の変数は書き換えられず、処理はその場で完了するため、アウェイトのような待機も不要です。
  26. 1:56まずはこの三つの例で感覚をつかんでください。
  27. 1:58ここが一番大切なポイントです。
  28. 2:01日本語で小数点以下を切り捨てるとだけ言うと、負の数の扱いがあいまいになります。
  29. 2:07マス・トランクでマイナス七点八を処理するとマイナス七ですが、負の無限大方向へ丸めるマス・フロアではマイナス八になります。
  30. 2:16差の大きさから端数だけを除きたい場合は、ゼロ方向への処理が合います。
  31. 2:22一方で、負の数を含む座標を区画へ割り当てるような場面では、別の丸め方が必要になることもあります。
  32. 2:29大切なのは、関数ありきではなく、先に業務上のルールを決めてから、それに合う関数を選ぶことです。
  33. 2:37名前が似ていても、向きが違えば結果も変わります。
  34. 2:40特殊な値の扱いを確認します。
  35. 2:42数値以外の値を渡すと、まず数値への変換が行われます。
  36. 2:46たとえば文字列の八点九は、八として処理できてしまいます。
  37. 2:50変換できない文字列はエヌエーエヌになり、無限大は無限大のまま返ります。
  38. 2:56つまり、異常な値が自動で普通の整数に直るわけではありません。
  39. 3:00また、ビッグイントはこの関数では処理できず、タイプエラーになります。
  40. 3:05そしてマイナスゼロ点五の整数部は、負のゼロです。
  41. 3:09表示に負のゼロが不要なら、後で紹介するように、結果がゼロのときに通常のゼロへそろえる処理を加えます。
  42. 3:16符号そのものに意味がある用途では、正規化するかどうかを先に判断してください。
  43. 3:22ここからは完成例です。
  44. 3:23トゥー・ホール・ミニッツという関数は、差分の秒数を受け取り、整数の分へ変換します。
  45. 3:31最初に、ナンバー・イズ・セーフ・インテジャーで、入力が安全な整数かどうかを確かめます。
  46. 3:38小数の秒数や文字列、エヌエーエヌ、無限大は受け付けず、問題があればタイプエラーを投げます。
  47. 3:46次に秒数を六十で割り、マス・トランクで分の端数を除きます。
  48. 3:51最後に、結果がゼロの場合は負のゼロではなく通常のゼロを返すようそろえます。
  49. 3:58なお、この厳しい入力制限は用途に合わせた設計であり、マス・トランク自体の制限ではない点も覚えておいてください。
  50. 4:07変換結果を具体的な数で確かめます。
  51. 4:10百二十五秒は二分、マイナス百二十五秒はマイナス二分になります。
  52. 4:16百二十五を六十で割ると約二点ゼロ八三三なので、端数を除くと二になるからです。
  53. 4:22五十九秒とマイナス五十九秒は、どちらもゼロ分にそろいます。
  54. 4:27一分未満の差は、正負のどちらでも表示上はゼロです。
  55. 4:32六十秒は一分、マイナス六十秒はマイナス一分です。
  56. 4:36正の側と負の側で対称に処理できていることが分かります。
  57. 4:41この結果はノード・ジェイエスの実機でも確認済みで、記事の期待出力と完全に一致しました。
  58. 4:48期待出力をまとめて読みましょう。
  59. 4:51マイナス五十九秒を変換した結果が負のゼロかどうかを調べると、フォルスが返ります。
  60. 4:57関数の最後で通常のゼロへそろえているためです。
  61. 5:01一方、文字列の百二十五を渡すと、タイプエラーと、安全な整数を指定してください、
  62. 5:06というメッセージが表示されます。
  63. 5:10マス・トランク単体では文字列も変換されてしまいますが、この完成例では事前の検証が入力ミスをはっきり知らせてくれます。
  64. 5:20出力の一行一行が、どの処理の結果なのかを追って読むことが大切です。
  65. 5:26特に、ゼロの扱いとエラー行は見落としやすいので、最後まで丁寧に確認してください。
  66. 5:32失敗例として、ビット演算による代用に注意しましょう。
  67. 5:36小数部を除くために、パイプ記号とゼロを使う書き方を見かけることがあります。
  68. 5:41しかしこの方法は、符号付き三十二ビット整数への変換を伴います。
  69. 5:46たとえば三十億点五では、マス・トランクなら三十億が返りますが、ビット演算ではマイナス十二億九千四百九十六万七千二百九十六という、
  70. 5:52まったく違う値になってしまいます。
  71. 5:57小さい値では偶然うまくいくため、気づきにくいのが厄介な点です。
  72. 6:02一般的な数値の整数部を取り出したいだけなら、意図がそのまま伝わるマス・トランクを使うほうが、
  73. 6:06読みやすく安全です。
  74. 6:10もう一つの注意点は、表示用の値と判定用の値を分けることです。
  75. 6:15差分がマイナス五十九秒でも、表示はゼロ分になります。
  76. 6:19早着か遅延かを判断する場面で、この丸めた結果だけを使うと、符号の情報が失われてしまいます。
  77. 6:27元の秒数は必ず別に保持し、丸めるのは表示用の値だけにしてください。
  78. 6:32また、マス・トランクは浮動小数点演算で生じた誤差そのものを修復する機能ではありません。
  79. 6:39金額や厳密な小数計算に転用する場合は、数値の持ち方と端数処理のルールを別途設計する必要があります。
  80. 6:47便利な関数ほど、使いどころの線引きが大切です。
  81. 6:51活用場面とまとめです。
  82. 6:53差分の秒数から整数の分を作る処理は、予定と実績を比べる管理画面や、処理時間の差を簡潔に示すログで役立ちます。
  83. 7:02正と負を対称に扱い、端数を表示しない、という要件に合う場面で採用してください。
  84. 7:09実務では、今回のような変換関数へ表示規則を集めるのがおすすめです。
  85. 7:14画面ごとに直接計算すると、負の数の丸め方やゼロの表示がばらつきやすいためです。
  86. 7:21さらに、秒数の正と負がそれぞれ何を意味するのかを、引数の説明として残しておくと、
  87. 7:26後から使う人も判断しやすくなります。
  88. 7:31まずは小さな値で試して、ゼロ方向へ丸める感覚をつかんでください。
  89. 7:36お疲れさまでした。
日本語字幕をダウンロード(WebVTT)

この動画で学べること

Math.trunc()で正負の数から小数部を取り除く方法を解説。差分時間を分に変換する実例、引数・戻り値、ブラウザーとNode.jsの実行手順、負のゼロや入力検証の注意点を学べます。

解説記事・サンプルコードを読む:JavaScriptのMath.trunc():小数部を除いて差分時間を整数の分に変換する →