TECH I.S.

JavaScript オブジェクトのプロパティ


プロパティは、JavaScriptオブジェクトの最も重要な部分です。


JavaScript プロパティ

プロパティは、JavaScriptオブジェクトに関連付けられた値です。

JavaScriptオブジェクトは、順序付けられていないプロパティのコレクションです。

通常、プロパティは変更、追加、および削除できますが、読み取り専用のものもあります。


JavaScriptプロパティへのアクセス

オブジェクトのプロパティにアクセスするための構文は次のとおりです。

objectName.property      // person.age

または、

objectName["property"]   // person["age"]

または、

objectName[expression]   // x = "age"; person[x]

式はプロパティ名に評価される必要があります。

例 1

person.firstname + " is " + person.age + " years old.";

自分で試してみる»

例 2

person["firstname"] + " is " + person["age"] + " years old.";

自分で試してみる»


JavaScript for...inループ

JavaScriptfor...in構文は、オブジェクトのプロパティをループします。

構文

for (let variable in object) { // 実行されるコード }

ループ内のコードブロックは、for...inプロパティごとに1回実行されます。

オブジェクトのプロパティをループします。

const person = {   fname:" John",   lname:" Doe",   age: 25 }; for (let x in person) {   txt += person[x]; }

自分で試してみる»


新しいプロパティの追加

既存のオブジェクトに値を与えるだけで、新しいプロパティを追加できます。

personオブジェクトが既に存在すると仮定すると、新しいプロパティを与えることができます。

person.nationality = "English";

自分で試してみる»


プロパティの削除

deleteはオブジェクトからプロパティを削除します。

const person = {   firstName: "John",   lastName: "Doe",   age: 50,   eyeColor: "blue" }; delete person.age;

自分で試してみる»

またはperson["age"]を削除します。

const person = {   firstName: "John",   lastName: "Doe",   age: 50,   eyeColor: "blue" }; delete person["age"];

自分で試してみる»

deleteは、プロパティの値とプロパティ自体の両方を削除します。

削除後、再度追加するまでプロパティを使用することはできません。

演算子deleteは、オブジェクトのプロパティで使用するように設計されています。変数や関数には影響しません。

このdelete演算子は、事前定義されたJavaScriptオブジェクトのプロパティでは使用しないでください。
アプリケーションがクラッシュする可能性があります。


ネストされたオブジェクト

オブジェクトの値は別のオブジェクトにすることができます:

myObj = {   name:"John",   age:30,   cars: {     car1:"Ford",     car2:"BMW",     car3:"Fiat"   } }
ドット表記またはブラケット表記を使用して、ネストされたオブジェクトにアクセスできます。

myObj.cars.car2;

自分で試してみる»

または、

myObj.cars["car2"];

自分で試してみる»

または、

myObj["cars"]["car2"];

自分で試してみる»

または、

let p1 = "cars"; let p2 = "car2"; myObj[p1][p2];

自分で試してみる»


ネストされた配列とオブジェクト

オブジェクト内の値は配列にすることができ、配列内の値もオブジェクトにすることができます。

const myObj = {   name: "John",   age: 30,   cars: [     {name:"Ford", models:["Fiesta", "Focus", "Mustang"]},     {name:"BMW", models:["320", "X3", "X5"]},     {name:"Fiat", models:["500", "Panda"]}   ] }
配列内の配列にアクセスするには、配列ごとにfor-inループを使用します。

for (let i in myObj.cars) {   x += "<h1>" + myObj.cars[i].name + "</h1>";   for (let j in myObj.cars[i].models) {     x += myObj.cars[i].models[j];   } }

自分で試してみる»


プロパティ属性

すべてのプロパティには名前があります。さらに、それらには価値もあります。

値は、プロパティの属性の1つです。

その他の属性は、列挙可能、構成可能、および書き込み可能です。

これらの属性は、プロパティへのアクセス方法を定義します (読み取り可能か、書き込み可能か)。

JavaScriptでは、すべての属性を読み取ることができますが、変更できるのはvalue属性のみです(プロパティが書き込み可能な場合のみ)。

(ECMAScript5には、すべてのプロパティ属性を取得および設定するためのメソッドがあります)


プロトタイプのプロパティ

JavaScriptオブジェクトは、プロトタイプのプロパティを継承します。

このdeleteキーワードは継承されたプロパティを削除しませんが、プロトタイププロパティを削除すると、プロトタイプから継承されたすべてのオブジェクトに影響します。



プログラミング学習を加速させる

プログラミングをプロの講師に教えてもらいませんか。

テックアイエスのプログラミングスクールは初心者も大歓迎です。年齢制限もありません。転職・副業に強く、挫折させない手厚いサポートで稼ぐ力を身につけましょう!

スクールの詳細