第27回：JavaScript講座本編0「JavaScriptって何？」
どうも、シノです。
前回の雑記を書いて、このブログの目的をもう一度確認しました。このブログは、「書いている私が楽しむ」ことを目的としています。そのうえで、もし見てくれたらうれしいなくらいの気持ちの方が色々書けるので。
さて、今回は講座の続きです…が、タイトルを変えてます。
というのも、別枠とした方が書きやすいかなと思ったからです。続きと思ってもらって大丈夫です。
これから、JavaScriptというものを解説していきます。
で、その前に「そもそもJavaScriptって何？」という方向けに、今回はJavaScriptとは何かを書いていきます。
先に、どんなことができるかを軽くお見せしましょう。
下に、2つテキストボックスを用意しました。
ここに、それぞれ数字を入力して、「計算」ボタンを押してみてください。
すると、その下に、合計が表示されるはずです。
あ、細かいテストとかはしてないので変な動作したらごめんなさい(´・ω・｀)
| 数字1： | |
| 数字2： | |
| 合計： | |
どうでしょうか。こんなふうに、今まではただ記述したものを表示するだけでしたが、JavaScriptを使うと、色々なデータを処理したり、それによって表示を変えたりすることができます。
これを使うと、簡単なゲームなんかも作れちゃいます！
というわけで、まずはこんなことができるJavaScriptって何者？ってことを解説していきます。
今回の目次です。
1.JavaScriptって何？
JavaScriptとは、「プログラミング言語」の一つです。
簡単に言ってしまうと、実は上にも書いたのですが、Webブラウザ上で動く、情報を処理するための記述ですね。このくらいの認識でいいです。
「え…難しそう」と思った方、少しずつやれば全然難しくないです。一気に全部やろうとするととんでもない難易度になりますが…
で、上の例でもやったのですが、ブラウザに値を入力する場所を作っておいて、そこから値を取得して計算して別の場所に表示するなんてこともできます。
これを画像表示などと組み合わせれば、ゲームも作れてしまうのです！
2.どうやって使うの？
何種類か方法があります。イメージは、以前解説したCSSと同じような使い方になります。
2-1.HTML内に記述する
はい、ダイレクトに「ここにJavaScript書きますよ」と言って、その中に書いていく方法です。CSSだと<style>ってタグありましたよね。
HTMLで、以下のタグが用意されています。
<script>～</script>：JavaScriptを記述する
この中にJavaScriptを書けば、そのページ上で動いてくれます。
ちなみに、上の計算プログラムはこちらの方法で書いています。
ここで、はてなブログにJavaScriptを書く方向けの注意です。
見たまま編集だと、どうやら「onclick=""」が使えないようです。何度やっても勝手に消えてしまいます…
なので、どうしてもonclickを使いたい場合は、Markdown記法などを使用しましょう。
私は記事を書き終えてからこれに気づいて、別の方法で上の例を実装しなおしました(´・ω・｀)
2-2.外部ファイルに記述して、HTMLで読み込む
これも考え方はCSSと同じです。
処理させたいJavaScriptを外部のファイルに書いて、HTMLでは以下のタグで読み込んでいきます。
<script src="(読み込みたいJavaScriptファイルパス)"></script>
はい、実はHTML内に記述する場合と同じscriptタグを使います。
違いは、srcというオプションの有無。読み込む場合はこちらの書き方にしましょう。
そして、ファイルにも、専用の拡張子があります。「拡張子って何？」という方はこちらをどうぞ。
JavaScriptの拡張子は、「.js」です。これに変えて、中身を書きましょう。
まとめ
いかがだったでしょうか。
今回は、JavaScriptについて、ごく簡単に紹介しました。
これから、具体的な書き方も紹介していきますので、よかったらチャレンジしてみてください！
更新情報はTwitterでも呟いてますので、よかったらフォローをお願いします！！！
次回：文字出力と変数(2020/1/15投稿しました！！！)
それでは。
