JavaScript でオブジェクトをマスターする

JavaScript のオブジェクト

JavaScript では、オブジェクト はキーと値のペアのコレクションであり、値はデータ (プロパティ) または関数 (メソッド) です。オブジェクトは JavaScript の基礎であり、配列、関数、その他のオブジェクトも含め、JavaScript のほぼすべてがオブジェクトです。

---

1.オブジェクトの作成

A.オブジェクトリテラル

オブジェクトを作成する最も簡単な方法は、中括弧 {} を使用することです。

例:

const person = {
  name: "Alice",
  age: 25,
  greet: function () {
    console.log("Hello!");
  },
};

console.log(person.name); // Output: Alice
person.greet(); // Output: Hello!

B.オブジェクト コンストラクター

Object コンストラクターを使用すると、空のオブジェクトが作成されます。

例:

const person = new Object();
person.name = "Bob";
person.age = 30;
person.greet = function () {
  console.log("Hi!");
};

console.log(person.name); // Output: Bob
person.greet(); // Output: Hi!

C. Object.create() の使用

このメソッドは、指定されたプロトタイプを使用して新しいオブジェクトを作成します。

例:

const prototype = { greet: function () { console.log("Hello!"); } };
const person = Object.create(prototype);
person.name = "Charlie";
console.log(person.name); // Output: Charlie
person.greet(); // Output: Hello!

---

2.オブジェクトのプロパティへのアクセス

A.ドット表記

ドット (.) を使用してプロパティにアクセスします。

例:

console.log(person.name); // Output: Alice

B.括弧表記

角括弧 ([]) を使用してプロパティにアクセスします。動的なプロパティ名に役立ちます。

例:

console.log(person["name"]); // Output: Alice
const key = "age";
console.log(person[key]); // Output: 25

---

3.プロパティの追加、変更、削除

• 追加:

person.country = "USA";
console.log(person.country); // Output: USA

• 変更:

person.age = 26;
console.log(person.age); // Output: 26

• 削除中:

delete person.age;
console.log(person.age); // Output: undefined

---

4.オブジェクト内のメソッド

関数がオブジェクトのプロパティである場合、それはメソッドと呼ばれます。

例:

const car = {
  brand: "Tesla",
  start: function () {
    console.log("Car started!");
  },
};

car.start(); // Output: Car started!

---

5.オブジェクトのプロパティを反復処理する

A. for...in を使用する

オブジェクトの列挙可能なすべてのプロパティを反復処理します。

例:

for (let key in person) {
  console.log(`${key}: ${person[key]}`);
}

B. Object.keys() の使用

オブジェクトのキーの配列を返します。

例:

Object.keys(person).forEach((key) => {
  console.log(`${key}: ${person[key]}`);
});

C. Object.entries() の使用

[キー、値] ペアの配列を返します。

例:

Object.entries(person).forEach(([key, value]) => {
  console.log(`${key}: ${value}`);
});

---

6.オブジェクトメソッド

JavaScript には、オブジェクトを操作するためのいくつかの組み込みメソッドが用意されています。

• Object.assign(): あるオブジェクトから別のオブジェクトにプロパティをコピーします。

const person = {
  name: "Alice",
  age: 25,
  greet: function () {
    console.log("Hello!");
  },
};

console.log(person.name); // Output: Alice
person.greet(); // Output: Hello!

• Object.freeze(): オブジェクトの変更を防止します。

const person = new Object();
person.name = "Bob";
person.age = 30;
person.greet = function () {
  console.log("Hi!");
};

console.log(person.name); // Output: Bob
person.greet(); // Output: Hi!

• Object.seal(): プロパティの追加または削除を禁止しますが、既存のプロパティの変更は許可します。

const prototype = { greet: function () { console.log("Hello!"); } };
const person = Object.create(prototype);
person.name = "Charlie";
console.log(person.name); // Output: Charlie
person.greet(); // Output: Hello!

---

7.プロトタイプと継承

JavaScript のオブジェクトにはプロトタイプがあり、これはプロパティとメソッドを継承する別のオブジェクトです。

例:

console.log(person.name); // Output: Alice

---

8.オブジェクトの分割

分割により、オブジェクトからプロパティを抽出して変数に入れることができます。

例:

console.log(person["name"]); // Output: Alice
const key = "age";
console.log(person[key]); // Output: 25

---

9.概要

• オブジェクトは、プロパティとメソッドを格納できるキーと値のペアです。
• 単純なオブジェクトの作成にはオブジェクト リテラルを使用します。
• ドットまたは括弧表記を使用してオブジェクトのプロパティにアクセスします。
• オブジェクトを効果的に操作するには、Object.keys()、Object.assign()、Object.freeze() などの組み込みメソッドを使用します。
• オブジェクトをマスターすることは、プロトタイプや継承などの高度な JavaScript の概念を理解するために非常に重要です。

こんにちは、アバイ・シン・カタヤットです!
私はフロントエンドとバックエンドの両方のテクノロジーの専門知識を持つフルスタック開発者です。私はさまざまなプログラミング言語やフレームワークを使用して、効率的でスケーラブルでユーザーフレンドリーなアプリケーションを構築しています。
ビジネス用メールアドレス kaashshorts28@gmail.com までお気軽にご連絡ください。

以上がJavaScript でオブジェクトをマスターするの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。