#043　フロントサイド（8）：JavaScript入門5（オブジェクト）

ビギナーのためのJavaScriptオブジェクト入門

オブジェクトとは？

オブジェクトは、関連するデータと機能をひとまとめにしたものです。現実世界の「物」をプログラムで表現するのに適しています。

例えば、「本」というオブジェクトを考えてみましょう。本には「タイトル」「著者」「ページ数」などの特徴（プロパティ）があります。

オブジェクトの作成

let book = {
    title: "JavaScriptの基礎",
    author: "山田太郎",
    pages: 300
};

この例では、book というオブジェクトを作成し、title、author、pages というプロパティを持たせています。

プロパティへのアクセス

オブジェクトのプロパティにアクセスするには2つの方法があります：

• ドット記法

console.log(book.title); // 出力: JavaScriptの基礎

• ブラケット記法

console.log(book["author"]); // 出力: 山田太郎

プロパティの追加と変更

// 新しいプロパティを追加
book.publishYear = 2023;

// 既存のプロパティを変更
book.pages = 310;

console.log(book.publishYear); // 出力: 2023
console.log(book.pages); // 出力: 310

メソッド

オブジェクトには関数も持たせることができます。オブジェクトに属する関数を「メソッド」と呼びます。

let book = {
    title: "JavaScriptの基礎",
    author: "山田太郎",
    pages: 300,
    summary: function() {
        return `『${this.title}』は${this.author}によって書かれ、${this.pages}ページあります。`;
    }
};

console.log(book.summary());
// 出力: 『JavaScriptの基礎』は山田太郎によって書かれ、300ページあります。

ここでの this は、このメソッドを持つオブジェクト自身（この場合は book）を指します。

イメージ

オブジェクトの使用例

オブジェクトは複雑なデータ構造を表現するのに適しています。例えば、ユーザープロフィールを表現するオブジェクトを作ってみましょう

let user = {
    name: "鈴木花子",
    age: 28,
    email: "hanako@example.com",
    hobbies: ["読書", "旅行", "料理"],
    address: {
        city: "東京",
        postalCode: "100-0001"
    },
    introduce: function() {
        return `私の名前は${this.name}で、${this.age}歳です。${this.hobbies.length}個の趣味があります。`;
    }
};

console.log(user.introduce());
// 出力: 私の名前は鈴木花子で、28歳です。3個の趣味があります。
console.log(user.address.city); // 出力: 東京

まとめ

• オブジェクトは関連するデータと機能をまとめる方法です。

• プロパティ（データ）とメソッド（関数）を持つことができます。

• 現実世界の「物」や概念をプログラムで表現するのに適しています。

• 複雑なデータ構造を簡潔に表現できます。

オブジェクトを使いこなすことで、より構造化された、管理しやすいコードを書くことができます。

終わりに

少し長くなったので、ここで一旦お話をクローズさせて頂きます。
自分自身の学習記録帳のため、乱雑な文章になっている可能性があります。
申し訳ございません。

最後までお読みいただき、ありがとうございます。
私も皆さんのnoteを拝見させて頂いて、多くの気づきを得ています。
本当に感謝🙏です。
今後ともよろしくお願いします。