小粋空間  -  a cheap joke and a play on words site

プログラミング初心者がJavaScriptを1分で実行する方法

プログラミング初心者がJavaScriptを1分で実行する方法を紹介します。

JavaScriptはブラウザ上で実行できるので、ブラウザを利用します。ブラウザはIE8/IE9またはGoogle Chrome、Firefoxのいずれかを使います（FirefoxはFirebugのインストールが必要です）。

プログラミング初心者にプログラムのサンプルを見せるときにも使えるかもしれません。

１．IE8/IE9で実行する

WindowsであればIE8/IE9がデフォルトでインストールされていると思うので、もっとも手っ取り早いです。

ブラウザを起動して任意のページを表示します。この状態でF12を押下すると、次の画面が表示されるので、「コンソール」タブをクリック。

（画面をクリックすれば拡大します。以下同様）

一番下の行に実行したいJavaScriptを記述してリターン。ここでは「document.write("OK");」と入力してみます。document.write()は、引数に指定した文字などを画面に表示するための関数です。

ブラウザに実行結果が表示されました。

コンソールにも実行結果が表示されます。

ブラウザ起動を含めると1分は厳しいかもしれませんが、3～5分もあればここまでたどりつけるんじゃないかと思います。「alert("OK");」と入力すれば、ダイアログを表示できます。

もう少しきちんとしたプログラムを書いて実行したい場合は、画面右下のアイコンをクリック。

実行させたいJavaScriptを記述して「スクリプトの実行」をクリック。ここではfor文を使って、0から9までの数字を表示するプログラムを実行してみます。

ブラウザに実行結果が表示されました。

さきほどと同様、コンソールにも実行結果が表示されます。

コンソールの実行結果は右クリックして「コンソールのクリア」で消去できます。

２．Google Chromeで実行する

１項と同様、任意のページを表示した状態でF12を押下すると、次の画面が表示されるので、「Console」をクリック。

実行したいプログラムを記述してリターン。

実行されました。実行結果は１項と同様、ブラウザに表示されます。

Google Chromeは複数行実行の方法が見つけられませんでした。見落としているかもしれません。Windowsであれば、Shift+リターンで複数行が入力できます。

３．Firefox（Firebug）で実行する

１項と同様、任意のページを表示した状態でF12を押下すると、次の画面が表示されるので、「コンソール」タブをクリックして、一番下の行に実行したいJavaScriptを入力してリターン。

複数行を実行する場合は、右下のアイコンをクリック。

右側に実行したいJavaScriptを入力して「実行」をクリックします。

１～３項について、表示しているページにjQueryを読み込ませておけば、jQueryの構文も実行できるんじゃないかと思います（多分）。

４．JavaScriptをファイルに記述して実行する

１～３項のいずれかでJavaScriptが動作するイメージはつかめたと思います。

JavaScriptをファイルとして読み込ませ、実行させるには、１～３項で入力したプログラムを次のようにscript要素で括り、「hoge.html」などのファイル名で保存します。あとはブラウザにそのファイルをドラッグすれば実行されます（URLでアクセスするのが本来ですが）。

<script>
document.write("OK");
</script>