今回はJavaScriptの型について書いていきます。
■型ってなんぞ？
まずこれからですね。
JavaScriptには変数に型が無いので、Javaとかほど意味合いは強くない場合が多いですが、
一応型があります。
(Java脳な自分は理解がちょっとややこしそうです。)
JavaScriptには6個の型が存在します（プリミティブ型5種類 + オブジェクト型)
・文字列型
・数値型
・ブーリアン型
・null型
・undefined型
・オブジェクト型(その他)
型といいましたが、Javaでいう型とは違い、JavaScriptの変数に型は存在しません。
JavaScriptは値とオブジェクトにのみ型を持ちます。
ややこしいですねー、、、
まぁ、Javaの勉強講座ではないので、この辺はさらっと行きますが、
Javaのように変数に型を持たせて制約する言語を静的型言語、
JavaScriptのように変数に型が無くて自由な言語を動的型言語といいます。
■もう少し詳しく型の話
以前関数の説明で
>function sum(a , b) {
> return a + b;
>}
>
>これに対してsum(4,5)を渡した場合、期待する答えは9です。
>でも場合によっては45と返ってきても文句は言えません。
>
>というのも、渡された4とか5が数字ではなく、文字列として認識されてしまった場合
>文字列の足し算は文字を結合する(hoge+fuga=hogefuga)なので、
>4と5を結合して45になるというわけです。
と書きました。
このように型はその値の振る舞いを定義します。そのためちょっとした理解は大切です。
・文字列型(string)
文字列型はそのまま、文字列として扱います。
わかりやすい例では文字列の結合演算子は+で+でつながれた文字列は文字列結合されます。
・数値型(number)
Javaとかだと数値型の中でも色々な種類があるのですが、JavaScriptの数値型は64ビットの浮動小数点の1種類のみです。
Javaでいうdoubleですね。
まぁ小数点ももてる普通の数字です。
普通に使っている分には有効数字を超えることは無いでしょう。
・ブーリアン型(boolean)
true or false の2種類の値を持つ型です。
条件分岐のときに使いますね。
・null型(なにもないがあるというnull)
・undefined型(存在しないという型)
この二つについては今は特に気にしなくていいでしょう。
気にしなければならないタイミングではなんとなく意味がわかるようになっているはずです。
・オブジェクト型(その他)
雑分類ですが、上記以外は全部オブジェクト型といいます。
前回の
var taro = {weight:70, hight:170, age:18};
はtaroという変数にオブジェクト型の{weight:70, hight:170, age:18}を代入したといった感じです。
■型を調べる
値が何であるかを調べるには
typeofで調べることができます。
<!DOCTYPE html> <html> <head> <title>サンプル</title> </head> <body> <script> document.write(typeof 123); </script> </body> </html>
とやると
123の型である
number
と出力されます。
■文字列型を例に、色々いじくってみる。
文字列はHello,World!!でやったように、変数に代入ができたりします。
また、「これが文字列ですよ！」ということは文字リテラルで示します。
“文字だよ！”
このように文字列を””でくくると、「これは文字列として扱ってください！」という意思表示になります。
ちなみに””でくくっても”でくくっても同じです。
また、文字列と文字列を+でつなげると、文字列を結合します。
var str1 = "4月"; var str2 = "20日"; var str3= str1 + str2; //str3の中身は"4月20日"
そのため、
var str1 = "123"; var str2 = "456"; var str3= str1 + str2;
str3の中身は”123456″になります。
これは文字列型としてリテラルをつけたからこのようになります。
文字リテラルをつけずに数字型として扱った場合、
var str1 = 123; var str2 = 456; var str3= str1 + str2
は当然579になります。
このように変数には型がないですが、値には型がありそれを意識しないと求めている結果が得られない(=バグ)
ことになります。
文字列の結合と代入を同時にすることもできます。
var str1 = "123"; var str2 += "456" //このときstr2の中身は456ではなく、str1 + "456"がされ、"123456"になる。
一応知っておいたほうがいいこととしてエスケープシーケンスというものがあります。
エスケープシーケンスとは、特別な意味を持つ文字列です。
https://www.ajaxtower.jp/js/num/index2.html
よく使うのは改行じゃないでしょうか。
\n
と打てばそこで改行が可能です。
<!DOCTYPE html>
<html>
<head>
<title>サンプル</title>
</head>
<body>
<script>
alert("こんにちは\nおやすみなさい");
</script>
</body>
</html>
こんな感じですね。
stringクラスのプロパティ値というものも存在します。
色々便利なものをあらかじめ用意してくれています。
全部は書ききれないし、全部覚えてもいません。
「多分こういったのあるんだろうなー、、、どう書くんだろ？」
って公式とかを調べるような使い方になると思います(少なくとも自分はそう)。
こういったサイトを見るのは大切です。
例えば
【瓜売りが瓜売りに来て瓜売り残し売り売り帰る瓜売りの声】
の早口言葉で
「うりがうっとうしいから、トマトに書き換えよう！」となったとき(あるのかな？こんなシチュエーション)
は置換するreplaceというものが用意されています。
→’うりうりがうりうりにきてうりうりのこしうりうりかえるうりうりのこえ’.replace(‘うり’,’トマト’);
これを出力すると
document.write('うりうりがうりうりにきてうりうりのこしうりうりかえるうりうりのこえ'.replace('うり','トマト'));
→結果：トマトうりがうりうりにきてうりうりのこしうりうりかえるうりうりのこえ
ぬ、、、初めのうりしか置換されてない。。。
というのもまぁ当然で、replace初めにヒットしたものが置換されるという機構なのです。
これを解決するにはgというフラグを立てることで、解消できます。以下参照
https://developer.mozilla.org/ja/docs/Web/JavaScript/Guide/Regular_Expressions
document.write('うりうりがうりうりにきてうりうりのこしうりうりかえるうりうりのこえ'.replace(/うり/g,'トマト'));
→結果：トマトトマトがトマトトマトにきてトマトトマトのこしトマトトマトかえるトマトトマトのこえ
これで見やすくなったかどうかは置いておいて、やりたいことはできました。
こんな感じで今回はJavaScriptの型について書きました。
次回はもう少し実際に使う型について書いていきます。
ではー
コメント