JavaScriptでMathオブジェクトを使う方法【初心者向け】
プログラミング初心者向けに、JavaScriptの組み込み関数の1つ【Mathオブジェクト】を使って数値計算をする方法を解説した記事です。Mathオブジェクトを使うことで、円周率や最大値の取得、四捨五入などができます。
テックアカデミーマガジンは受講者数No.1のプログラミングスクール「テックアカデミー」が運営。初心者向けにプロが解説した記事を公開中。現役エンジニアの方はこちらをご覧ください。 ※ アンケートモニター提供元:GMOリサーチ株式会社 調査期間:2021年8月12日~8月16日 調査対象:2020年8月以降にプログラミングスクールを受講した18~80歳の男女1,000名 調査手法:インターネット調査
JavaScriptをプログラミング初心者向けに紹介した記事です。
今回は、JavaScriptの組み込み関数の1つ、Mathオブジェクトを使って数値計算をする方法について解説します。
また、入門向けのJavaScriptを学習できるサイトも紹介しているので、合わせてご覧ください。
本記事では、テキストエディタのmiを使っていますが、JavaScriptの場合はWebブラウザとテキストエディタがあれば特別な開発環境がなくても開発することができます。
なお本記事は、オンラインブートキャンプ フロントエンドコース(JavaScript・jQuery講座)の内容をもとにしています。
今回の記事の内容は動画でもご覧いただけます。
テキストよりも動画の方が理解しやすいという場合はぜひご覧ください。
目次
- 組み込み関数のMathオブジェクトとは
- Mathオブジェクトのプロパティを呼び出してみよう
- プロパティ1. PI(円周率を取得する)
- プロパティ2. sqrt()(指定した数値の√を取得する)
- プロパティ3. max(a,b,c,…….,z)(最大値を取得する)
- プロパティ4. round()(四捨五入した値を取得する)
組み込み関数のMathオブジェクトとは
組み込み関数とは、JavaScrip側であらかじめ用意してくれているオブジェクトのことです。Mathオブジェクトは、組み込み関数の1つで、数値計算を扱う際に使います。
参考までに、組み込み関数の代表的なものには次のようなものがあります。
<組み込み関数(代表的なもの)>
はじめから関数の内容が決まっているので、こちらで定義する手間もなく、実行するだけ。非常に便利なので重宝します。
組み込みオブジェクトを使う場合、newを使って次のようにオブジェクトを生成します。
var オブジェクト名= new object();
しかし、Mathの場合は特殊で、new を使ってオブジェクトを生成しなくても、プロパティやメソッドを呼び出し、数値計算をおこなうことができます。
ただ、今記事では便宜的にMathオブジェクトと呼びます。
田島メンター!平方根とか円周率とか、そういった数学的な関数はありますか?
JavaScriptではMathオブジェクトに関数としてまとめられてるんだ。
Mathって英語で数学って意味なので、わかりやすいですねー。
そうだね。他のプログラミング言語でもMathとしてまとめられてたりするんだよ。さっそくMathオブジェクトを使ってみよう!
Mathオブジェクトのプロパティを呼び出してみよう
console.logを使って日付に関する様々なプロオパティやメソッドを呼び出してみましょう。
Mathオブジェクトでの数値計算の操作の仕方を、4つのプロパティを例に見ていきましょう。
- プロパティ1. PI(円周率を取得する)
- プロパティ2. sqrt()(指定した数値の√を取得する)
- プロパティ3. max(a,b,c,…….,z)(最大値を取得する)
- プロパティ4. round()(四捨五入した値を取得する)
プロパティ1. PI(円周率を取得する)
オブジェクトのプロパティを呼び出すときは、変数名に「.」で続けてプロパティ名を入れると、プロパティの値を呼び出すことができました。
ただ、先述したようにMathではオブジェクトを生成する必要がないので、次のように書くだけで大丈夫です。
<!DOCTYPE html>
<html lang = "ja">
<head>
<meta charset = "utf-8">
<title>JavaScriptの練習</title>
</head>
<body>
<script>
console.log(Math.PI);
</script>
</body>
</html>
3.14からはじまるおなじみの円周率が取得されました。
プロパティ2. sqrt()(指定した数値の√を取得する)
sqrt() の( )内に入れた数値の√(ルート)を取得します。
64の √ は……
<script>
console.log(Math.sqrt(64));
</script>
8ですね。
プロパティ3. max(a,b,c,…….,z)(最大値を取得する)
sqrt() の( )内に入れた数値のなかから、最も大きい値を取得します。
<script>
console.log(Math.max(1,9,3,5,6,4));
</script>
1,9,3,5,6,4のなかの最大値「9」が取得されました。
反対に、min (a,b,c,…….,z)を使うと最小値を取り出すことができます。
プロパティ4. round() (四捨五入した値を取得する)
round() の( )内に入れた数値の、四捨五入した値を取り出します。
<script>
console.log(Math.round(57.712134782005423));
</script>
四捨五入された値「58」が取り出されました。
JavaScriptの組み込み関数の1つ、Mathオブジェクトを使って数値計算をする方法については以上です。
今回は4つのみのご紹介になりますが、Mathにはほかにも様々な計算をおこなうプロパティ・メソッドがたくさんあります。必要に応じて調べ、使ってみてくださいね。
JavaScriptの組み込み関数の記事は、JavaScriptでDateオブジェクトを使って日付を表示する方法もあるので合わせてご覧ください。
Mathオブジェクトで計算することが出来ました。ただ、Mathはnewしなくても良いんでしょうか?
そうなんだ。正確な意味は、どうしてもJavaやC#、C言語のような低級言語を使ってみないとわかりにくいんだけど、staticなオブジェクトなんだよね。
staticってどんな感じでしょうか?
newしてオブジェクトを生成すると、その都度、メインメモリを使って保存されていくんだよね。staticなオブジェクトの場合、1つで済むんだ。数学の関数って不変なので、1つでいいよね。
[お知らせ]TechAcademyではJavaScriptを使ってWebサービスを公開できるオンラインブートキャンプ フロントエンドコース(JavaScript・jQuery講座)を開催しています。プログラミングの初心者でも受講可能です。