【JavaScript入門】toStringで数値を文字列に変換(日付/基数変換)

どうもこんにちは!エンジニアの若月です。

今回は、JavaScriptのtoStringメソッドについて、基本的な使い方から、少し特殊な場面でのより実用的な使い方まで、詳しく紹介したいと思います。

この記事で解説する内容は、

・toStringメソッドとは
・toStringメソッドの使い方

などの基本的な内容から、

・日付を文字列に変換する
・配列(Array)を文字列に変換する方法
・JSONオブジェクトを文字列に変換する方法
・数値を基数変換して文字列に変換する

など、toStringメソッドの応用的な使い方まで、わかりやすく解説していきます!

toStringメソッドとは

toStringメソッドとは、「to(〜へ) + String(文字列)」、つまり「文字列へ変換」するときに使われるメソッドです。

JavaScriptでは、あらゆる値が数値、文字列、配列などのデータ型に分かれています。

toStringメソッドは、文字列でないものを文字列に変換するときに使われるメソッドです。

toStringメソッドの使い方

数値の桁数を取得する方法

10000000000000のような、大きな数字の桁数を取得したいとき、文字列であればlengthメソッドで桁数を取得できますが、これは文字列のために用意されたメソッドのため、数値に対しては使えません。

const num = 10000000000000; //この桁数を知りたい
console.log(num.length);

実行結果:

> undefiened

そこで、いったん数値を文字列に変換することで、文字数を取得できます。

定義したnumのあとに「.toString()」を追加しましょう。

const num = 10000000000000; //この桁数を知りたい
const digits = num.toString().length; // .toString()を追加
console.log(digits + "桁でした");

実行結果:

> "14桁でした"

このように、数字などの文字列でないものを文字列に変換するときにtoStringメソッドを使います。

数値以外にも、日付(Date)配列(Array)オブジェクト=連想配列(Object)なども、文字列に変換することができます。

日付を文字列に変換する方法

日付(Dateオブジェクト)から文字列への変換も、数値の変換と同様にtoStringメソッドが利用できます。

const date = new Date(); // 今日の日付
console.log("今日:" + date.toString());
console.log("今日:" + date.toISOString());

実行結果:

> "今日:Tue Apr 10 2018 00:00:00 GMT+0900 (JST)"
> "今日:2018-04-09T15:00:00.000Z" // ISO形式

日付は古いバージョンのInternet Explorerなどで異なる出力結果が表示されることがありますので注意しましょう。

また、ISO規格のフォーマットで出力するためのtoISOStringメソッドも用意されています。

配列(Array)を文字列に変換する方法

配列(Array)も文字列に変換して出力できます。

const array = ["りんご","みかん","メロン","もも","バナナ"]
console.log("好きなフルーツは、" + array.toString());

実行結果:

> "好きなフルーツは、りんご,みかん,メロン,もも,バナナ"

toStringメソッドで出力されるのは文字列なので、もちろん他の文字列と足すことも可能です。

JSONオブジェクトを文字列に変換する方法

ここでは、JSONオブジェクトを文字列に変換する方法を解説します。

それでは、JSONオブジェクトも同様に文字列で出力してみましょう。

const obj = new Object({name: "Taro", age: 26, gender: "male"});
const str_obj = obj.toString();
console.log(str_obj);

実行結果:

> [object Object]

文字列では表示されたものの、これだとObjectの中身が何かわかりません。Objectの中身を表示するためにはtoStringメソッドではなく、JSON.stringifyメソッドを使います。

const obj = new Object({name: "Taro", age: 26, gender: "male"});
const str_obj = JSON.stringify(obj);
console.log(str_obj);

実行結果:

> {"name":"Taro","age":26,"gender":"male"}

JSON.stringifyメソッドを使うことで、中身を展開(パース)した文字列を取得できます。

数値を基数変換して文字列に変換する方法

数値を文字列に変換する際に、基数変換を同時に行うこともできます。

const num = 10;
const bin_converted = num.toString(2);
const hex_converted = num.toString(16);

console.log("10を2進数で表すと、" + bin_converted);
console.log("10を16進数で表すと、" + hex_converted);

実行結果:

> "10を2進数で表すと、1010"
> "10を16進数で表すと、a"

このように、数値に対するtoStringメソッドのときは、引数を指定することで基数変換を同時に行えます。

まとめ

いかがでしたか?この記事では、JavaScriptのtoStringメソッドの様々な使い方について解説しました。

今回の記事のポイントは以下の通りです。

・num.toString()のようにして文字列でないものを文字列に変換できる
・日付の変換にはtoISOStringも使える
・Objectを文字列にするときにはJSON.stringifyメソッドを使う
・数値に対しては引数を指定して基数変換もできる

toStringメソッドは、様々な値を文字列として扱いたいときによく使う基本的なメソッドなので、しっかりと理解しておきましょう!

LINEで送る
Pocket

ITエンジニアへ転職したい方におすすめ

自分を評価してくれる企業に転職して年収を上げたい! 自分のスキルにあった独自案件を知りたい!
エンジニアは今もっとも注目されている職業の1つ。エンジニアになって年収を増やしたい方や、あなたのスキルに見合った企業へ転職したいエンジニアの方も多いですよね。

しかし、大手の転職媒体は扱う求人数が多くても、誰もが登録しているので競争率もかなり高くなっています。そのため、あなたの条件に見合った企業を見つけても転職するためには、相応の努力とスキルが必要となります。

こういった媒体では、未経験からエンジニアを目指す方やエンジニア歴2〜3年で転職を考えている方にとって、最適な転職環境とはいえません。

そこでオススメしたいのが、未経験者や若手エンジニア向けの独自案件を多く掲載している「侍ワークス」です。

侍ワークスは、独自案件を多く掲載しているだけでなく、

・応募から就業まで一貫したサポート

・就業後もアフターフォロー

といった経験の浅い方や初めてエンジニアを目指す方にも安心のフォロー体制が整っています。もちろん登録は完全無料!しかも案件を見るだけなら登録も不要です。

まずは、お気軽にどんな求人があるか見てみてください。あなたにピッタリの企業がきっと見つかりますよ! 侍ワークスの求人情報を見る

書いた人

ワカツキ ヒロアキ

ワカツキ ヒロアキ

目黒のベンチャー企業ででフルスタックエンジニアをやっています!今はWEB・スマホアプリ開発をメインに、毎日、仕事+アウトプットを目標に日々過ごしています。