JavaScriptは、ウェブサイトに動的な機能を追加するための強力なプログラミング言語です。このチュートリアルでは、JavaScriptの基本とどこにコードを書くのかを学びます。
JavaScriptの基本
JavaScriptは、以下の特徴を持つプログラミング言語です。
- クライアントサイドで動作し、ブラウザ上で実行される
- 動的型付け言語で、変数の型を明示的に宣言する必要がない
- オブジェクト指向、関数型プログラミングの両方をサポートしている
- イベント駆動型のプログラミングが可能
JavaScriptを書く場所
JavaScriptコードは主に2つの場所に記述することができます。HTMLファイル内のscriptタグ内、または外部JavaScriptファイル内です。
scriptタグ
HTMLファイル内で直接JavaScriptを記述する場合は、<script>タグを使用します。
<!DOCTYPE html> <html> <head> <title>JavaScript Example</title> </head> <body> <h1>Hello, World!</h1> <script> // ここにJavaScriptコードを記述します console.log("Hello JavaScript!"); </script> </body> </html>
外部JavaScriptファイル
大規模なプロジェクトや、コードの再利用性を高めたい場合は、外部のJavaScriptファイル(ファイル名.js)にコードを記述し、HTMLファイルから参照します。
まず、script.jsファイルを作成し、以下のコードを記述します。
console.log("Hello JavaScript!");
次に、HTMLファイルから以下のように参照します。
<!DOCTYPE html> <html> <head> <title>JavaScript Example</title> <script src="script.js"></script> </head> <body> <h1>Hello, World!</h1> </body> </html>
コンソールへの出力
JavaScriptの動作を確認するには、ブラウザのコンソールに出力を表示することが有効です。console.log()関数を使用して、コンソールにメッセージを出力できます。
console.log("Hello, JavaScript!");
ブラウザの開発者ツールを開いて(多くの場合、F12キーを押す)、コンソールタブを選択すると出力を確認できます。
まとめ
このチュートリアルでは、JavaScriptの基本とコードを記述する2つの主な方法(スクリプトタグと外部ファイル)について学びました。また、console.log()を使用してコンソールに出力する方法も紹介しました。
JavaScriptは非常に強力な言語であり、これらの基本を理解することで、より複雑な機能の実装に進むことができます。継続的な学習と実践を通じて、ウェブサイトに動的な要素を追加する技術を磨いていくことをおすすめします。