JavaScript/はじめに
まず、簡単なJavaScript (ジャバスクリプト)のプログラムの例と、どこにプログラムを書けばいいのかを解説します。
Hello World

Hello World ハローワールド とは、画面に「Hello World!」と表示するプログラミングの本の最初に書いてあるプログラムです。
Hello World

JavaScriptのHello Worldプログラムは次のようになります。
Hello World

上記のコードをテキストエディタで書いて hello.html の名前で保存します。 少し長めですが、これ以上省略すると有効なHTML5文書でなくなり小さな変更で予想に反した挙動をする原因になります(例えば、文字列を日本語にしたら文字化けするなど)。
Hello World

hello.html のアイコンをクリックするかウェブブラウザにドロップすると、結果は右図のようにHello World! が表示された警告ダイアログがポップアップします。
Hello World

上記のコードをします。 JavaScriptのプログラムはHTML文書のSCRIPT要素の開始タグ<script>からSCRIPT要素の終了タグ</script>タグの間にきます。
Hello World

alertメソッドは、ウェブページ上に警告ダイアログを表示します。
Hello World

では、alertメソッドを例に、JavaScriptでのプログラムの記述方法を勉強しましょう。
Hello World

文字列は、"または'で囲みます。"で始まったら"で終わる必要があります。'で始まったら'で終わる必要があります。
Hello World

;(セミコロン)は「文の終わり」を表します。
Hello World

文の終わりにセミコロンがなくても曖昧さがない場合はセミコロンを省略出来ます(自動セミコロン挿入)。
Hello World

HTMLドキュメントにJavaScriptのコードを埋め込むのではなく外部ファイルに分離できます。
Hello World

hello.htmlを次のように変えます。
Hello World

hello.html
Hello World

そして新規テキストファイルを作成し、以下のJavaScriptのコードをコピーし、hello.jsという名前でhello.htmlと同じディレクトリに保存してください。
Hello World

hello.js
Hello World

hello.htmlを開くと、警告ポップアップが出て Hello World! が表示されます。
デベロッパー ツール

ブラウザにはHTMLファイルを作成しなくても、JavaScriptのコードをその場で書いて実行できるデベロッパー ツールと呼ばれるツールが搭載されています。
デベロッパー ツール

Microsoft Edge、Google Chrome、Mozilla Firefox、Safariなど多くのブラウザでは、
デベロッパー ツール

または
デベロッパー ツール

を押すとコンソールが起動します。
デベロッパー ツール

また、Chrombook など ChromeOS の場合は、ファンクションキーそのものがないので、
デベロッパー ツール

を押すとコンソールが起動します(最後の文字はI(アイ)です)。
デベロッパー ツール

あるいはウェブページの適当なところを右クリックして「要素を調査」を選択したり、ブラウザ上部のツール(開発)メニューをクリックしたりしてコンソールを起動できます。
デベロッパー ツール

ひとまずコンソールが起動できたとしましょう。
デベロッパー ツール

コンソールではalertメソッドを使わなくても、単にJavaScriptのコードをタイプするだけで実行結果を確認できます。
デベロッパー ツール

コンソールの出力例(⌨が実際に入力したコード、🖥が出力結果)
デベロッパー ツール

コンソール上で↑キーを押すと、以前に入力したコードをもう一度編集して実行できます。
デベロッパー ツール

Shift+Enterを押すと改行でき、複数行のプログラムを入力できます。
デベロッパー ツール

console.logメソッドを使用すると、デベロッパー ツールのコンソール上に文字列を出力できます。たとえばプログラムの途中で結果を出力したり、hello.jsからコンソールに文字列を出力したりするのに使えます。
デベロッパー ツール

コンソールはプログラムのどの行でエラーが発生しているのかを確認するなど、JavaScriptプログラマにとって欠かせないツールです。hello.jsにプログラムを書く場合であっても、必ずコンソールを起動しエラーが出ていないかどうか確かめるようにしましょう。
デベロッパー ツール

プログラムは一発で完璧に書こうとするものではなく、少しずつ書いては実行しわざとエラーを出させてはそれを直すを繰り返して、「とりあえずここまではできた」「ここまでは間違っていない」という範囲を徐々に広げていって完成させるものなのでエラーを恐れないでください。
デベロッパー ツール

以降はコンソールにプログラムを書いても、hello.jsに書いてもかまいません。自分に合った方法でプログラミングを継続してください。
コメント

JavaScriptでは、//から行末までの部分、および/*〜*/で囲まれた部分はコメントとして扱われます。コメントは1文字の空白とみなされるので、コードの説明など好きな文章を書くことができます。
コメント

たとえば、
コメント

ならアラートは表示されず、単に「こんにちは 世界」がブラウザのウィンドウの左上に表示されます。
コメント

他の例
コメント

複数行コメントは次のようにアスタリスクを同じカラムカラムに書くとコメントの範囲がひと目で分かります。
コメント

これはJSDocと呼ばれる形式で、JavaScriptにおけるドキュメント方式の事実上の標準になっています。一般公開するプログラムでは、すべてのメソッド定義にJSDoc形式でドキュメントを書くことが推奨されます。JSDocの書き方を習得したい方は、GoogleのClosure Libraryの例をご覧ください。
コメント

JavaScriptに限りませんが、一般的に
コメント

のようなコードをただ日本語に翻訳しただけの無意味なコメントは冗長な上、コードの更新にコメントが追いついていない場合などは深刻な誤解を与えます(コメント通りに直しがち)。それが何のための変数なのかなどクリエイティブな構想をコメントには書くべきです。
種々雑多な知識

REPL(read–eval–print loop)とは、キャラクター指向の対話的な実行方式であり、コマンドプロンプトがその代表である。しかし、オンラインサービスにはキャラクター指向は馴染みにくく、TEXTAREA要素に代表されるFORMに複数行のテキストを書き、「実行」に類するイベント発火で評価する形式が取られるようになった2021年6月現在、様々なオンラインサービスとして提供されている。
種々雑多な知識

BabelのREPLやCode Beautifier - HTML Viewer使うと上記のHello Worldプログラムを簡単に動かすことができます。
種々雑多な知識

特に、Code Beautifier - HTML Viewerでは、HTML文書に含まれたJavaScriptをウェブブラウザでの表示そのままに再現できローカルファイルにHTML文書を用意する必要がなく、スマホートフォンやタブレットなどでの利用に適している。
種々雑多な知識

ブラウザを使うのではなく、JavaScriptの処理系をインストールしてシェル(ターミナル)でJavaScriptを実行できます。シェルを使える方にはこの方法をおすすめします。
種々雑多な知識

後述のNode.jsのほか、SpiderMonkey、Rhino、KJSなどがあります。
種々雑多な知識

さまざまな処理系が存在しますが、GoogleのV8エンジンをベースにした、Node.jsランタイムを利用する方法を紹介します。
種々雑多な知識

インストール方法 Node.jsの公式サイトからインストーラーをダウンロードしインストールしてください。なお、Linuxでは各種パッケージマネージャを使ってもインストールできます。
種々雑多な知識

Ubuntuでは次のコマンドを実行してNode.jsをインストールできます(管理者権限が必要です)。
種々雑多な知識

です。
種々雑多な知識

Fedora では
種々雑多な知識

です(Fedora 32 で2020年4月20日に確認)。
種々雑多な知識

また、macOSではHomebrewパッケージマネージャーをインストールし、brew を使ってインストールするとよいでしょう。
種々雑多な知識

起動 Node.jsインタプリタを起動するには、シェルでnodeコマンドを実行します。
種々雑多な知識

Hello World! の次の undefined は console.log() メソッドの戻り値です。
種々雑多な知識

Node.js/V8以外の処理系にはSpiderMonkey、Rhino、KJSなどがあります。
種々雑多な知識

JavaScriptではインデントのスペースの数、変数名の形式(例えばキャメルケース)、条件式の ) と 続くブロックの開始の { の間にスペースは必要か?そもそも次の行にすべきか?、if や while と (の間には?などのスタイルに幾つかの流儀があり、一概にどれが優れているとは言えない。ただ、1つソースプログラム、1つのプロジェクトでは一致している必要があるというのは最小限の合意事項と言える。
種々雑多な知識

また、言語仕様が未だに成長途上にあるので、旧来のスタイル標準がひどく古臭くまた読みにくく感じることもある。