JavaScript - コードの書き方

script タグの中にコードを書く

JavaScript でコードを書くためには HTML の script タグを使います。以下のサンプルコードでは、script タグの中に簡単なコードが書かれています。ブラウザで開くと、画面上に Hello, World! と表示されます。

<!DOCTYPE html>
<html lang="ja">
<head>
  <meta charset="UTF-8">
  <title></title>
  
  <script>
    alert("Hello, World!");
  </script>
  
</head>
<body></body>
</html>
JavaScript のサンプルコード

別ファイルにコードを書く

JavaScript を別ファイルで作成するには、拡張子を .js にしたファイルに書き出します。別ファイルに書き出した JavaScript を読み込むためには script タグを使います。

<!DOCTYPE html>
<html lang="ja">
<head>
  <meta charset="UTF-8">
  <title></title>
  
  <script src="script.js"></script>
  
</head>
<body></body>
</html>
JavaScript のサンプルコード

別ファイルに書き出した JavaScript のファイルはいくつでも読み込むことができます。

<!DOCTYPE html>
<html lang="ja">
<head>
  <meta charset="UTF-8">
  <title></title>
  
  <script src="script1.js"></script>
  <script src="script2.js"></script>
  <script src="script3.js"></script>
  
</head>
<body></body>
</html>
JavaScript のサンプルコード

コンソールに結果を出力する

これまでのコードは alert() で結果を出力しています。alert() 以外にも、JavaScript では console.log() で結果を出力することもできます。console.log() で結果を出力した場合、ブラウザの DevTools で確認することができます。DevTools の詳細についてはChrome DevTools の使い方を参照してください。

Console パネル
Console パネル
const a = 10;
const b = 20;
console.log(a + b); // 結果: 30
JavaScript のサンプルコード

関連記事

Category:
プログラミング
公開日:
更新日:
Pageviews:
66
Shares:
1
Tag:
JavaScript
コードレシピ