スキップしてメイン コンテンツに移動

JavaScript入門 - パート1

JavaScript入門 - パート1

JavaScriptは、ウェブ開発で広く使われているプログラミング言語です。初心者でも理解しやすいように、基本的な概念と使い方を説明します。

JavaScriptの基本

1. JavaScriptとは

JavaScriptは、ウェブページを動的にするためのプログラミング言語です。HTMLやCSSと共に使われ、ユーザーの操作に応じて内容を変更したり、アニメーションを追加したりすることができます。

2. JavaScriptの使い方

JavaScriptは、HTMLファイル内に直接書くか、外部ファイルとして読み込むことができます。基本的な使い方を見てみましょう。

HTMLファイル内に直接書く方法:

<!DOCTYPE html>
<html>
<head>
    <title>JavaScript入門</title>
</head>
<body>
    <h1>こんにちは、JavaScript!</h1>
    <script>
        // ここにJavaScriptのコードを書きます
        alert('ページが読み込まれました!');
    </script>
</body>
</html>

外部ファイルとして書く方法:

  1. 外部ファイルを作成します(例: script.js)。
// script.js
alert('ページが読み込まれました!');
  1. HTMLファイルで外部ファイルを読み込みます。
<!DOCTYPE html>
<html>
<head>
    <title>JavaScript入門</title>
</head>
<body>
    <h1>こんにちは、JavaScript!</h1>
    <script src="script.js"></script>
</body>
</html>

基本的な構文

3. 変数

変数はデータを保存するための箱のようなものです。JavaScriptでは、varletconstを使って変数を宣言します。

  • var: 再宣言可能、再代入可能。スコープが関数単位。
  • let: 再代入可能、再宣言不可。スコープがブロック単位。
  • const: 再宣言不可、再代入不可。スコープがブロック単位。
var name = "太郎";
let age = 25;
const isStudent = true;

console.log(name);  // "太郎"
console.log(age);   // 25
console.log(isStudent);  // true

4. 基本的なデータ型

JavaScriptにはいくつかの基本的なデータ型があります。以下に主なものを紹介します。

  • 数値 (Number): 整数や小数。
let number = 42;
let pi = 3.14;
  • 文字列 (String): テキストデータ。
let greeting = "こんにちは";
let name = "太郎";
  • ブール値 (Boolean): true または false
let isJavaScriptFun = true;
let isTired = false;
  • 未定義 (Undefined): 値が未定義。
let something;
console.log(something);  // undefined
  • ヌル (Null): 値が空であることを表す。
let nothing = null;
console.log(nothing);  // null

基本的な操作

5. 数値の演算

JavaScriptでは基本的な算術演算が可能です。

let a = 10;
let b = 5;

let sum = a + b;       // 15
let difference = a - b;  // 5
let product = a * b;     // 50
let quotient = a / b;    // 2
let remainder = a % b;   // 0

6. 文字列の操作

文字列を連結したり、文字列の一部を取り出したりすることができます。

let firstName = "太郎";
let lastName = "山田";
let fullName = firstName + " " + lastName;

console.log(fullName);  // "太郎 山田"

まとめ

今回はJavaScriptの基本的な概念と使い方を紹介しました。次回は、条件分岐やループ、関数について詳しく見ていきましょう。これらの基本を押さえることで、より高度なJavaScriptのプログラミングができるようになります。

コメント

このブログの人気の投稿

「8発目」 神奈川県立の出願システムのドメインmail.shutsugankanagawa.jp をdigコマンドで色々と確認してみた。

今、話題となってる、高校受験する為にネットで登録する時にgmail が届かない件  2024/01/17 16時 頃 digコマンドを利用して確認してみました。さて、どこが悪いんでしょうね。 まずはこれから % dig mail.shutsugankanagawa.jp ;; ANSWER SECTION: mail.shutsugankanagawa.jp. 122 IN A 13.113.157.93 mail.shutsugankanagawa.jp. 122 IN A 52.193.62.66 mail.shutsugankanagawa.jp. 122 IN A 52.194.140.218 今度は、txt をつけて % dig mail.shutsugankanagawa.jp txt ;; ANSWER SECTION: mail.shutsugankanagawa.jp. 300 IN TXT "v=spf1 include:amazonses.com ~all" mail.shutsugankanagawa.jp. 300 IN TXT "google-site-verification=eBRf3ipFa5PReqemKRG2zePZUOEfBc6NO5GuPisqN5A" 次はMXをつけて % dig mail.shutsugankanagawa.jp mx ;; ANSWER SECTION: mail.shutsugankanagawa.jp. 300 IN MX 10 ec2-52-193-62-66.ap-northeast-1.compute.amazonaws.com. mail.shutsugankanagawa.jp. 300 IN MX 10 ec2-52-194-140-218.ap-northeast-1.compute.amazonaws.com. mail.shutsugankanagawa.jp. 300 IN MX 10 ec2-13-113-157-93.ap-northeast-1.compute.amazonaws.com. mail.shutsugankanagawa.jp. 300 IN MX 20 feedback-s...

JavaScript入門 - パート3

JavaScript入門 - パート3 パート3では、JavaScriptのオブジェクトと配列について説明します。 オブジェクト 1. オブジェクトとは オブジェクトは、関連するデータや機能をまとめるための構造です。プロパティ(データ)とメソッド(関数)を持つことができます。 let person = { name: "太郎", age: 30, greet: function() { console.log("こんにちは、" + this.name + "です。"); } }; console.log(person.name); // "太郎" console.log(person.age); // 30 person.greet(); // "こんにちは、太郎です。" 2. オブジェクトのプロパティにアクセスする オブジェクトのプロパティにはドット記法やブラケット記法でアクセスできます。 let car = { brand: "トヨタ", model: "カローラ", year: 2020 }; // ドット記法 console.log(car.brand); // "トヨタ" // ブラケット記法 console.log(car["model"]); // "カローラ" 3. プロパティの追加と削除 オブジェクトにプロパティを追加したり、削除したりできます。 let book = { title: "JavaScript入門", author: "山田太郎" }; // プロパティの追加 book.year = 2021; console.log(book.year); // 2021 // プロパティの削除 delete book.auth...

2024年のITトレンド

最新のITトレンド 2024年のIT業界では、以下のようなトレンドが注目されています。 1. ジェネレーティブAIとクラウドインフラ ジェネレーティブAIは引き続き急速に発展しており、多くの企業がその活用を進めています。クラウドプロバイダが主要なコンピューティングリソースを提供し続けており、新しい技術やリソースの導入により、モデルの最適化と小型化が進んでいます。これにより、より小規模な企業や個人でも高度なAI技術を活用しやすくなっています。 2. スペーシャルコンピューティング スペーシャルコンピューティング(空間コンピューティング)は、デジタルツインや仮想トレーニングシナリオなど、複雑な情報を動的かつ没入型で伝えるための新たな手段として注目されています。物理的な空間をデジタルで拡張することで、企業は柔軟な空間設計やトレーニングの効率化が期待されています。 3. 新しいウェアラブルデバイス スマートリングや神経技術を組み込んだヘッドフォンなどの新しいウェアラブルデバイスが登場し、従来のスマートウォッチやヘッドフォンの概念を拡張しています。これにより、健康管理やデバイス制御の新たな方法が提供されると期待されています。 4. パスワードレス認証 セキュリティの分野では、パスワードレス認証が広まりつつあります。これは、セキュリティの向上とユーザーエクスペリエンスの改善を目指した技術で、多くの企業がこの新しい認証方法を採用し始めています。 5. 新素材のチップレット 半導体業界では、チップレットと呼ばれる新素材の小型チップが注目を集めています。これにより、従来のチップの限界を超えた性能向上が期待されており、特に計算性能と効率の向上が見込まれています。