staff1この章で作るものダイアログに名前を入力すると挨拶を返す機能1.あなたの名前を入力して下さい。(例:田中と入力する)2.「○○さんこんにちは!」と表示される。今回は「変数」について学習します。実用的な仕組みを作りながら解説していきましょう。以下のコードをエディタに記述します。実行ボタンを押すとダイアログが立ち上がり「1」と表示されます。※デツクル記事内で提示したコードは、その都度JavaScriptエディタへ貼り付けて実行し、動きを確認しましょう。「なぜこのように動いたのか?」を理解することが大切です。a;」ですが、これは「aという変数を使用します」という意味です。変数とは、色々な値をとることができる記号のことで、この記号(変数)にはプログラマが自由に名前をつけることができます。これを変数宣言と呼びます。1行目で「これからaという変数を使用します」と宣言していますが、詳しく言うと「これからaという変数を使ってこのコンピュータのメモリを使用しますよ」と宣言しているのです。【code:003_01】のコードを以下のように書き換えても同じ動作をします。「変数には自由に名前をつけることができる」と書きましたが、試しにaという変数をsujiという変数に置き換えてみました。aの時と同様に「1」がダイアログに表示されることを動作確認してみましょう。1;」と書かれています。これを代入と呼びます。先ほどsujiと名前をつけた変数ですが、変数はどんな値にも変わる記号でしたね。この代入によって変数sujiが「1」に変わりました。「sujiという箱に1が入っている」という表現で解説するプログラミング入門書もあります。そのような理解の仕方でも支障はありません。※数学の知識がある方でプログラミングを初めて学ぶ方は、=を等価と考えますが、プログラミングの場合は=の意味が少し異なります。1;」という式は無意味ですが、プログラミングではよく使う表現です。これについては今後解説ページを作成する予定です。コメントさて、ここで一度整理しておきましょう。プログラムが何をしているのか、わかりにくいのでコメントを入れてみました。alert関数でsujiを表示しているalert(suji);【code:003_03】このようにコメントの先頭にスラッシュを2つ加えることで、コード内にコメントを書き込むことができます。行内の「//」以降の記述はJavaScript実行時にコードとして認識されず無視されますので、この効果を利用します。難しい箇所、分かりにくい箇所など、コード内に自分でコメントを書き残しておくと良いでしょう。以下のように複数行のコメントをいれることもできます。→エディタを新しいタブで開く/*このように複数行のコメントをいれることもできます。はじめのうちは後でわかりやすいように、たくさんコメントを記述しておくとよいでしょう。「/*」と「*/」で囲ったところが、複数行のコメントです。この間はJavaScriptで実行されません。コメント応用このコメント効果を利用し、一時的に実行したくないコードをコメントにすることで、コードの実行を防ぐことができます。...→エディタを新しいタブで開く/*このように複数行のコメントをいれることもできます。はじめのうちは後でわかりやすいように、たくさんコメントを記述しておくとよいでしょう。alert関数でsujiを表示している【code:003_05】スラッシュを2つ加えるだけでalert関数の実行を無視することができました。実行を押してもダイアログは立ち上がりません。このように、プログラムが正常に動かない時など、間違っていそうな箇所をコメントにして実行を防ぎコードを走らせます。怪しい箇所を順に試すことで、どこが誤っている箇所なのかを見つけ出すことができます。役に立つ効果なので覚えておきましょう。文字連結それでは、前回学習したpronpt関数を使って変数に文字列を入れてみましょう。pronpt関数とは、閲覧者からダイアログで値を受け取る仕組みのことでしたね。以下のコードを見てみましょう。実行を押すとダイアログが立ち上がり”名前を入力してください”と表示されます。あなたの名前を入力してみましょう。初期値では「田中」という文字を設定しています。閲覧者が名前(値)を入力しなかった場合に変数mojiは「田中」と代入されます。“さんこんにちは”;」このコードで「+」は足し算ではなく文字列の連結をしているのでしたね。“さんこんにちは”」は”田中さんこんにちは”となります。この値を=でmojiに代入しているので、最終的にmojiが”田中さんこんにちは”になります。最後のalert関数で「田中さんこんにちは」とダイアログで表示される仕組みが完成しました。「=」のことを代入演算子と呼びます。代入される前に「=」の右側の部分で文字連結や計算が行われ、それから代入の処理が行われます。初心者の方は数式のように左側から読んでしまいがちですが、順番が違うので決して間違えないようにしましょう。「+」は演算子と呼び、「+」の左側の値が文字の時は文字連結の処理を行います。「+」を計算で使う場合は算術演算子と呼び、「+」であれば足し算「-」であれば引き算を行います。Number(a);」のようにNumber関数を使って数値型へ変換させる必要がありましたね。まとめさて、プログラムがなんとなく分かってきたと思うので、おさらいしておきます。実はどんなプログラムも以下のような流れで動いています。入力と出力をイメージしようまずは、基本となる、この3つの流れを踏まえた上でいろいろな処理を書いていきましょう。ここまでで、prompt関数を使って「(1)値を受け取る」、alert関数を使って「(3)結果を返す」ところまで学習出来ました。残るは「(2)処理を行う」です。この「(2)処理を行う」は主にアルゴリズムについて学習していきます。JavaScriptの文法事項を憶えることも大切ですが、しっかりしたプログラムを書くためには、アルゴリズムを押さえておくことが大切です。アルゴリズム(処理手順・考え方)は、どのプログラミング言語でも共通に使えますので、他の言語へ移行する時も役立ちます。プログラマの採用試験で「何のプログラミング言語を何年やったか?」と聞かれたりしますが、言語云々よりもアルゴリズムの方が採用基準において重要です。「どういったアルゴリズムを使ってどのようなシステムを作ったのか?」という質問が面接の本題だと言えます。デツクルでは様々なモノを作りながらプログラミング言語の文法を押さえることはもちろん、このアルゴリズムを地道に徹底的に学びます。学ぶことに時間はかかりますし、頭の中で考えることが色々あって大変かもしれません。技術は必ずあなたを助けます。デツクルで色々なモノを作りながら、地に足の着いたアルゴリズム脳を鍛えていきましょう。次回は、西暦を和暦に変換する処理を作成します。コメントをキャンセルコメントを投稿するにはログインしてください。Reserved.運営会社|プライバシーポリシ。