JavaScriptでNumberオブジェクトを使いこなそう

（最終更新月：2023年12月）

✔以下の疑問をお持ちの方へ向けた記事です

✔当記事を読むことで得られる知識

• JavaScriptのNumberオブジェクトの基本的な概念
• Numberオブジェクトの主なメソッドとプロパティ
• Numberオブジェクトを使用した具体的なコード例

当記事では、JavaScriptのNumberオブジェクトについて、その基本的な概念から、使用法、さらには便利なメソッドやプロパティに至るまで詳しく解説します。

型変換や数値計算、数値フォーマットなど、実際のコーディングにおいて役立つ多様な使用例を提供します。

JavaScriptの基礎を学びたい方から、既にある程度経験のある方まで幅広く役立つ内容です。

ぜひ最後までご覧ください。

✔人に見せても恥ずかしくないコードを書こう

「リーダブルコード」は、わかりやすく良いコードの定義を教えてくれる本です。

• 見るからにきれいなコードの書き方
• コードの分割方法
• 変数や関数の命名規則

エンジニアのスタンダートとすべき基準を一から解説しています。

何回も読むのに値する本なので、ぜひ手にとって読んでみてください。

リーダブルコード ―より良いコードを書くためのシンプルで実践的なテクニック

created by Rinker

• Amazon
• 楽天市場
• Yahooショッピング

JavaScriptの数値って何？

JavaScriptで扱われる数値には、「整数」と「浮動小数点数」の2種類があります。

整数は厳密な数値計算に使われ、浮動小数点数は小数を含むより複雑な計算に使われるものです。

• 数値データの種類
• 数値の内部表現

数値データの種類

整数と浮動小数点数の違いには、表現できる数値の範囲や精度が挙げられます。

以下は整数を表しています。

let integer = 100;

こちら浮動小数点数です。

let float = 0.5;

数値の内部表現

JavaScriptでは、数値は内部的に64ビットの浮動小数点形式で表現されますが、この詳細は普段意識することはないでしょう。

ただし、仕組みを理解しておくと、数値の精度や限界を把握できるようになります。

数値変換の技法

文字列を数値に変換する方法には、parseInt()やparseFloat()といった関数があります。

これらの関数は、文字列を数値に”強制的に”変換するときに利用されますが、予期しない結果を防ぐためには、これらの関数の挙動を正確に理解する必要があります。

JavaScriptで押さえるべき数値変換の基本とテクニック

JavaScriptで数値変換のテクニックを習得したいですか？数値変換はJavaScriptにおける基礎的かつ不可欠なスキルであり、プログラミングにおける幅広いアプリケーションで活用されています。この専門的なガイドでは、「javascript 数値変換」というキーワードを念頭に置き、文字列を整数や浮動小数点に変換する方法を詳細なコード例と共にわかりやすく解説しています。特にJavaScriptの入門者や中級者に役立つ内容構成となっており、実務で役立つノウハウを凝縮。データ処理・数学演算・フォーム入力のバリデーションといったシナリオでのピタリとはまるテクニックを手に入れることができます。

itc.tokyo

2023.12.06

Numberの基本を知る

こちらでは、Number型の作り方と、BigIntを含む固定長数値の使い方を説明します。

NumberはJavaScriptのプリミティブ型であり、数値を扱うための基本オブジェクトです。

• Numberの作り方
• 固定長数値の魔法

Numberの作り方

Numberオブジェクトは、以下の2通りで作れます。

• コンストラクタを使う
• 変数に数値を格納する

new Number(123) //コンストラクタ
let num = 123; //変数に格納

この2つの違いを知ることはJavaScriptの理解を深める上で重要です。

固定長数値の魔法

BigInt型は、最近になって導入された数値型で、任意精度の整数を扱えます。

let bigIntNumber = 123n;

普通の数値型では表現できない大きさの整数も扱うことが可能です。

固有の数値特性を理解する

JavaScriptは、数値を便利に扱うためのプロパティとメソッドを提供しています。

これらを利用することで、より効率的な数値処理が可能です。

• 有用な静的プロパティ
• 静的メソッドの活用法

有用な静的プロパティ

Number.MAX_VALUEやNumber.MIN_VALUEといったプロパティは、JavaScriptで扱える最大・最小の数値を示しています。

こうしたプロパティを知っておくと、数値の範囲に関するバグを防ぐのに役立つでしょう。

静的メソッドの活用法

Mathオブジェクトのメソッドを使用して、さまざまな数値計算をおこなえます。

Math.round(0.9) //1を返す
Math.sin(Math.PI / 2) //1を返す

これらのメソッドは計算を簡明にするだけでなく、コードの性能改善にもつながります。

Numberオブジェクトの個性

Numberオブジェクトは、インスタンスプロパティやメソッドを持たないように見えますが、実はいくつかの便利な特性を内蔵しています。

ここでは、それらの特性を探ります。

• インスタンスプロパティの概要
• インスタンスメソッドによる数値処理

インスタンスプロパティの概要

Numberオブジェクトにはインスタンスプロパティがありません。

toStringやvalueOfなど、すべてのオブジェクトに共通するプロパティの動作があります。

num.toString(2)

numの値を2進数の文字列で返します。

インスタンスメソッドによる数値処理

toFixedやtoPrecisionといったメソッドを利用することで、数値を特定の書式に整形することが可能です。

num.toFixed(2)

数値を小数点以下2桁で丸めた文字列を返します。

実践例で理解を深める

実際にコードを書くことは学びを深める最良の方法です。

数値を実践的に扱う様々なケースを通じて、理論を実際のコードに適用してみましょう。

• 変数への値の割り当て
• 整数の適切な範囲
• Dateオブジェクトとの数値変換
• 異なる型を数値に変換する方法

変数への値の割り当て

let score = 80;

変数scoreに数値80を代入しています。

このようにして変数を使って数値を管理することで、コードを柔軟に保てるのです。

整数の適切な範囲

JavaScriptのNumber型は、-(2**53 - 1)から2**53 - 1までの整数を安全に表せます。

この範囲外の整数を扱うにはBigIntを利用しましょう。

Dateオブジェクトとの数値変換

Dateオブジェクトから数値を取得するには、Date.now()または、DateオブジェクトのvalueOfメソッドを使います。

これによりエポックからのミリ秒数を取得可能です。

異なる型を数値に変換する方法

NumberとBoolean型の関係は以下のとおり。

• Number(null)が0を返す
• Number(true)が1を返す

さらにNumber('123')が123を返すのに対し、Number('a123')はNaNを返すという、型変換の挙動を理解しておきましょう。

まとめ

当記事では、JavaScriptのNumberオブジェクトについて学習してきました。

JavaScriptでの数値操作はプログラミングにおいて基本的かつ重要なスキルです。

当記事を通じて、数値型、変換方法、Numberオブジェクトの操作など、JavaScriptの数値に関する重要ポイントを理解していただければと思います。

今回学んだことを応用し、実際のプロジェクトやアプリケーションに取り入れてみてください。

お使いのコードエディタで積極的に練習することが、スキルアップには不可欠です。