今回はJavaScriptの文字列の表示方法です。連結（結合）の仕方文字列と数値の組み合わせや数値の計算の仕組み文字列に数値を含む場合などを中心に解説します。改行については前のページで取り上げましたので今回は説明しません。とても重要ですが、めっちゃつまらない内容になっています。眺めておくだけでも大丈夫です、そのかわり後で見返してくださいね。
文字列の表示
文字列の表示にはいくつかの取り決めがあります。
文字列と数値
htmlファイルのbodyに下記のコードを記入してブラウザで表示してみてください。
<script>
document.write("10");//ここは文字列になる
document.write("文字列");//ここは文字列になる
document.write(10);//ここは数値になる
</script>2行目は「10」なのに文字列として表示されます。3行目の「10」はコンピューター上は数値になっています。
クォーテーションで括った部分は文字列になります。
人間の脳とコンピューター能力の差があるため「これは数値ですよ～」「これは文字ですよ～」って教えてあげないと区別がつきません。
文字列の結合
htmlファイルのbodyに下記のコードを記入してブラウザで表示してみてください。
<script>
document.write("田中"+"裕之"+"<br>");//「田中裕之」と表示されます。
document.write(10+"年"+"<br>");//「10年」と表示されます。
document.write(10+20);//「30」と表示されます。
</script>2行目は普通に「田中裕之」と表示されますが3行目は数値と文字の結合なのに「10年」と表示されます。4行目は「30」と表示されています。これはJavaScriptが数値を自動で文字と認識してくれるからです。javaやC#ではお行儀よくしないとおこられますよね。
計算と順序
JavaScriptには計算の順序があります。
計算
htmlファイルのbodyに下記のコードを記入してブラウザで表示してみてください。
<script>
document.write(10+20+"<br>");//30と表示されます。
document.write(50-20+"<br>");//30と表示されます。
document.write(500-10*20);//300と表示されます。
</script>電卓と同じように計算できます。
注意：計算の場合はすべて半角文字にしてください。全角だとエラーになります
順序
htmlファイルのbodyに下記のコードを記入してブラウザで表示してみてください。
<script>
document.write(80+20+"円です"+"<br>");//「100円です」と表示されます。
document.write("値段は"+80+20+"円です"+"<br>");//「値段は8020円です」と表示されます。
document.write("値段は"+(80+20)+"円です");//「値段は100円です」と表示されます。
</script>2行目は大丈夫だと思いますが、3行目は「値段は8020円です」と表示されます。JavaScriptでは左から順番に計算されるためです。途中に計算式を入れる場合は4行目のようにカッコでくくるようにしましょう。
今回は文字表示の方法と計算の方法や仕組みについて記述しました。退屈なきじですがここまでお付き合い下さりありがとうございます。非常に重要な項目ですがつまらない内容なので必要なときにまたここに戻って確認してもらえば大丈夫です。そのうちなれますよ～
今回はこれで終了です。
お疲れ様でした！
前のページ INDEX 次のページ
コメント