JavaScriptのオブジェクトは何ですか?
7706 ワード
オブジェクトは、それぞれの名前と値を持つプロパティの順序なしコレクションです.プロパティ名は通常文字列ですので、オブジェクトは文字列を値にマップします.この文字列から値へのマッピングは、“ハッシュ”、“ハッシュテーブル”、“辞書”、または“連想配列”の名前の下で、基本的なデータ構造に既に精通している様々な名前に従います.
オブジェクトの作成
オブジェクトは、オブジェクトリテラル、新しいキーワード、およびオブジェクトで作成できます.create ()関数.以下の各部分について説明する.
オブジェクトリテラル
オブジェクトを作成する最も簡単な方法は、JavaScriptコード内のオブジェクトリテラルを含めることです.オブジェクトリテラルはコロンで区切られた名前のコンマ区切りのリストです.
新しい演算子は新しいオブジェクトを作成して初期化します.
JavaScriptのほぼすべてのオブジェクトには、JavaScriptオブジェクトが関連付けられています.この2番目のオブジェクトはプロトタイプとして知られ、最初のオブジェクトはプロトタイプからプロパティを継承します.
オブジェクトリテラルによって作成されたすべてのオブジェクトは、同じプロトタイプオブジェクトを持ち、このプロトタイプオブジェクトをJavaScriptコードでオブジェクトとして参照できます.プロトタイプ
オブジェクト.create ()
オブジェクト.create ()は、そのオブジェクトのプロトタイプとして最初の引数を使用して新しいオブジェクトを作成します.
delete演算子はオブジェクトからプロパティを削除します.その単一オペランドはプロパティアクセス式でなければなりません
JavaScriptオブジェクトは、プロパティのセットとして考えられます.また、セット内のメンバーシップをテストすることで、オブジェクトが指定した名前のプロパティを持っているかどうかを確認できます
オブジェクトのシリアル化
オブジェクト直列化は、オブジェクトの状態を後でそれを回復できる文字列に変換するプロセスです.関数JSONstringIf ()とJSONparse ()はJavaScriptオブジェクトをシリアル化して復元します.
オブジェクトメソッド
tostring ()メソッド
toString ()メソッドは引数をとりません;これは、何らかの理由で呼び出されるオブジェクトの値を表す文字列を返します.JavaScriptは、オブジェクトを文字列に変換する必要があるときはいつでも、オブジェクトのこのメソッドを呼び出します
たとえば、+演算子を使用して文字列をオブジェクトに連結したり、オブジェクトを文字列を期待するメソッドに渡すときに発生します
基本的なtoString ()メソッドに加えて、オブジェクトはすべてtolocalestring()を持ちます.このメソッドの目的は、オブジェクトのローカライズされた文字列表現を返すことです.オブジェクトによって定義されたデフォルトのtolocEnumeration ()メソッドは、ローカライズ自体を行いません.
value ()メソッドはtoString ()メソッドとよく似ていますが、JavaScriptがオブジェクトを通常の文字列以外のいくつかのプリミティブ型に変換する必要があるときに呼び出されます.JavaScriptは、原始的な値が要求されるコンテキストでオブジェクトが使用されている場合、自動的にこのメソッドを呼び出します
オブジェクト.プロトタイプDOEは実際にtojson ()メソッドを定義していません.stringIf ()メソッドは、シリアル化を要求されたオブジェクトのtojson ()メソッドを探します.このメソッドがシリアル化されるオブジェクトに存在する場合、それは呼び出され、元のオブジェクトの代わりに戻り値がシリアル化されます.
速記性
変数xとyに格納された値を持ち、xとyというプロパティを持つオブジェクトを作成したい場合は、それらの値を保持します.
場合によっては、特定のプロパティを持つオブジェクトを作成する必要がありますが、そのプロパティの名前は、コンパイル時定数ではなく、文字通りソースコードに入力することができます.代わりに、必要なプロパティ名を変数に格納するか、呼び出す関数の戻り値です.
計算されたプロパティ構文は、他の非常に重要なオブジェクトリテラル機能を有効にします.ES 6以降では、プロパティ名は文字列またはシンボルでありえます.変数または定数にシンボルを割り当てると、そのシンボルを使用して、プロパティ名として使用することができます.
既存のオブジェクトのプロパティを“Spread演算子”を使用して新しいオブジェクトにコピーできます.オブジェクトリテラル内で
関数がオブジェクトのプロパティとして定義されている場合、その関数を呼び出します.オブジェクトのリテラルでメソッドを定義するのは、オブジェクトの他のプロパティを定義するだけで、関数定義式を使用してメソッドを定義します.
オブジェクトの作成
オブジェクトは、オブジェクトリテラル、新しいキーワード、およびオブジェクトで作成できます.create ()関数.以下の各部分について説明する.
オブジェクトリテラル
オブジェクトを作成する最も簡単な方法は、JavaScriptコード内のオブジェクトリテラルを含めることです.オブジェクトリテラルはコロンで区切られた名前のコンマ区切りのリストです.
let empty = {}; // object with no properties
let point = { x: 0, y: 0 }; // Two numeric properties
let p2 = { x: point.x, y: point.y+1 }; // More complex values
let book = {
"main title": "JavaScript", // These property names include spaces,
"sub-title": "The Definitive Guide", // and hyphens, so use string literals.
for: "all audiences", // for is reserved, but no quotes.
author: { // The value of this property is
firstname: "David", // itself an object.
surname: "Flanagan"
}
};
新しいオブジェクトの作成新しい演算子は新しいオブジェクトを作成して初期化します.
let o = new Object(); // Create an empty object: same as {}.
let a = new Array(); // Create an empty array: same as [].
let d = new Date(); // Create a Date object representing the current time
let r = new Map(); // Create a Map object for key/value mapping
プロトタイプJavaScriptのほぼすべてのオブジェクトには、JavaScriptオブジェクトが関連付けられています.この2番目のオブジェクトはプロトタイプとして知られ、最初のオブジェクトはプロトタイプからプロパティを継承します.
オブジェクトリテラルによって作成されたすべてのオブジェクトは、同じプロトタイプオブジェクトを持ち、このプロトタイプオブジェクトをJavaScriptコードでオブジェクトとして参照できます.プロトタイプ
オブジェクト.create ()
オブジェクト.create ()は、そのオブジェクトのプロトタイプとして最初の引数を使用して新しいオブジェクトを作成します.
const person = {
isHuman: false,
printIntroduction: function() {
console.log(`My name is ${this.name}. Am I human? ${this.isHuman}`);
}
};
const me = Object.create(person);
me.name = 'Matthew'; // "name" is a property set on "me", but not on "person"
me.isHuman = true; // inherited properties can be overwritten
me.printIntroduction();
// expected output: "My name is Matthew. Am I human? true"
プロパティの削除delete演算子はオブジェクトからプロパティを削除します.その単一オペランドはプロパティアクセス式でなければなりません
delete book.author; // The book object now has no author property.
delete book["main title"]; // Now it doesn't have "main title", either.
プロパティのテストJavaScriptオブジェクトは、プロパティのセットとして考えられます.また、セット内のメンバーシップをテストすることで、オブジェクトが指定した名前のプロパティを持っているかどうかを確認できます
オブジェクトのシリアル化
オブジェクト直列化は、オブジェクトの状態を後でそれを回復できる文字列に変換するプロセスです.関数JSONstringIf ()とJSONparse ()はJavaScriptオブジェクトをシリアル化して復元します.
オブジェクトメソッド
tostring ()メソッド
toString ()メソッドは引数をとりません;これは、何らかの理由で呼び出されるオブジェクトの値を表す文字列を返します.JavaScriptは、オブジェクトを文字列に変換する必要があるときはいつでも、オブジェクトのこのメソッドを呼び出します
たとえば、+演算子を使用して文字列をオブジェクトに連結したり、オブジェクトを文字列を期待するメソッドに渡すときに発生します
let s = { x: 1, y: 1 }.toString(); // s == "[object Object]"
この既定の方法では有用な情報が表示されないため、多くのクラスがtoString ()の独自のバージョンを定義しています.たとえば、配列が文字列に変換された場合、配列要素のリストを取得することができます.このような独自のtoString ()メソッドを定義することができます.let point = {
x: 1,
y: 2,
toString: function() { return `(${this.x}, ${this.y})`; }
};
String(point) // => "(1, 2)": toString() is used for string conversions
クラスlocate ()メソッド基本的なtoString ()メソッドに加えて、オブジェクトはすべてtolocalestring()を持ちます.このメソッドの目的は、オブジェクトのローカライズされた文字列表現を返すことです.オブジェクトによって定義されたデフォルトのtolocEnumeration ()メソッドは、ローカライズ自体を行いません.
let point = {
x: 1000,
y: 2000,
toString: function() { return `(${this.x}, ${this.y})`; },
toLocaleString: function() {
return `(${this.x.toLocaleString()}, ${this.y.toLocaleString()})`;
}
};
point.toString() // => "(1000, 2000)"
point.toLocaleString() // => "(1,000, 2,000)": note thousands separators
value ()メソッドvalue ()メソッドはtoString ()メソッドとよく似ていますが、JavaScriptがオブジェクトを通常の文字列以外のいくつかのプリミティブ型に変換する必要があるときに呼び出されます.JavaScriptは、原始的な値が要求されるコンテキストでオブジェクトが使用されている場合、自動的にこのメソッドを呼び出します
let point = {
x: 3,
y: 4,
valueOf: function() { return Math.hypot(this.x, this.y); }
};
Number(point) // => 5: valueOf() is used for conversions to numbers
point > 4 // => true
point > 5 // => false
point < 6 // => true
tojson ()メソッドオブジェクト.プロトタイプDOEは実際にtojson ()メソッドを定義していません.stringIf ()メソッドは、シリアル化を要求されたオブジェクトのtojson ()メソッドを探します.このメソッドがシリアル化されるオブジェクトに存在する場合、それは呼び出され、元のオブジェクトの代わりに戻り値がシリアル化されます.
let point = {
x: 1,
y: 2,
toString: function() { return `(${this.x}, ${this.y})`; },
toJSON: function() { return this.toString(); }
};
JSON.stringify([point]) // => '["(1, 2)"]'
拡張オブジェクトリテラル構文速記性
変数xとyに格納された値を持ち、xとyというプロパティを持つオブジェクトを作成したい場合は、それらの値を保持します.
let x = 1, y = 2;
let o = {
x: x,
y: y
};
ES 6以降では、コロンと識別子の1つのコピーを削除し、より簡単なコードで終了できます.let x = 1, y = 2;
let o = { x, y };
o.x + o.y // => 3v
計算されたプロパティ名場合によっては、特定のプロパティを持つオブジェクトを作成する必要がありますが、そのプロパティの名前は、コンパイル時定数ではなく、文字通りソースコードに入力することができます.代わりに、必要なプロパティ名を変数に格納するか、呼び出す関数の戻り値です.
const PROPERTY_NAME = "p1";
function computePropertyName() { return "p" + 2; }
let o = {};
o[PROPERTY_NAME] = 1;
o[computePropertyName()] = 2;
計算されたプロパティとして知られているES 6機能を使って、このようなオブジェクトを設定するのはずっと簡単です.前のコードから角括弧を取り、オブジェクトリテラルに直接移動させることができます.const PROPERTY_NAME = "p1";
function computePropertyName() { return "p" + 2; }
let p = {
[PROPERTY_NAME]: 1,
[computePropertyName()]: 2
};
p.p1 + p.p2 // => 3
プロパティ名としてのシンボル計算されたプロパティ構文は、他の非常に重要なオブジェクトリテラル機能を有効にします.ES 6以降では、プロパティ名は文字列またはシンボルでありえます.変数または定数にシンボルを割り当てると、そのシンボルを使用して、プロパティ名として使用することができます.
const extension = Symbol("my extension symbol");
let o = {
[extension]: { /* extension data stored in this object */ }
};
o[extension].x = 0; // This won't conflict with other properties of o
拡がり演算子既存のオブジェクトのプロパティを“Spread演算子”を使用して新しいオブジェクトにコピーできます.オブジェクトリテラル内で
let position = { x: 0, y: 0 };
let dimensions = { width: 100, height: 75 };
let rect = { ...position, ...dimensions };
rect.x + rect.y + rect.width + rect.height // => 175
スプレッドされたオブジェクトと、そのオブジェクトが両方ともスプレッドされているオブジェクトが同じ名前のプロパティを持つ場合、そのプロパティの値は最後になるものになります.let o = { x: 1 };
let p = { x: 0, ...o };
p.x // => 1: the value from object o overrides the initial value
let q = { ...o, x: 2 };
q.x // => 2: the value 2 overrides the previous value from o.
短縮法関数がオブジェクトのプロパティとして定義されている場合、その関数を呼び出します.オブジェクトのリテラルでメソッドを定義するのは、オブジェクトの他のプロパティを定義するだけで、関数定義式を使用してメソッドを定義します.
let square = {
area: function() { return this.side * this.side; },
side: 10
};
square.area() // => 100
オブジェクトのリテラル構文は、関数のキーワードとコロンが省略されたショートカットを許可するよう拡張されました.let square = {
area() { return this.side * this.side; },
side: 10
};
square.area() // => 100
Reference
この問題について(JavaScriptのオブジェクトは何ですか?), 我々は、より多くの情報をここで見つけました https://dev.to/digomic/what-is-an-object-in-javascript-3j7bテキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol