ホームページ  >  記事  >  ウェブフロントエンド  >  詳細_JavaScript スキルにおける JavaScript オブジェクトのプロパティとプロトタイプの関係は何ですか?

詳細_JavaScript スキルにおける JavaScript オブジェクトのプロパティとプロトタイプの関係は何ですか?

WBOY
WBOYオリジナル
2016-05-16 19:10:561114ブラウズ

ECMAScript は 2 種類のオブジェクトを認識できます。1 つはネイティブ オブジェクトと呼ばれ、言語カテゴリに属します。もう 1 つはホスト オブジェクトと呼ばれ、ドキュメント オブジェクトや
Dom ノードなど
などの実行環境によって提供されます。ネイティブ オブジェクトは緩やかな構造であり、プロパティは動的に追加できます。すべてのプロパティには名前と値があります。この値は、別のオブジェクト
への参照、または組み込みデータ型 (文字列、数値、ブール値、または未定義)
次の簡単な例は、JavaScript オブジェクトがプロパティの値を設定する方法と、プロパティの値を読み取る方法を説明します。

代入操作
オブジェクトの属性の作成は、代入操作によって直接完了できます。
コード

1. var objectRef = new Object(); // 汎用 JavaScript オブジェクトを作成します。


このようにして、testNumber という名前のプロパティを作成できます。
コード

1. objectRef.testNumber = 5;
2. /* - または:- */
3. objectRef["testNumber"] = 5; >
コピーされた属性名がすでに存在する場合、その属性は再度作成されません。割り当て操作では属性
Code

1 の値がリセットされるだけです。 > 2 . /* - または:- */
3. objectRef["testNumber"] = 8;



js オブジェクトのプロトタイプ自体をオブジェクトにすることもできます。属性 (プロパティ) が存在する可能性があり、js オブジェクト (プロトタイプ) の代入操作は、通常のオブジェクト プロパティ
の作成と変わりません。

値の操作
値の操作では、プロパティとプロトタイプは異なります。最初に最も単純なプロパティの値の操作を見てみましょう。
コード

1. /*オブジェクトの属性に値を割り当てます。オブジェクトにこの属性がない場合、割り当て操作の後、オブジェクトはこの属性を持ちます */
2. objectRef.testNumber = 8;
3. /* この属性の値を読み取ります */
4. var val = objectRef.testNumber;
6. /* val はobjectRef の値は 8*/


プロトタイプが明らかに

しかし、すべてのオブジェクトはプロトタイプを持つことができ、プロトタイプ自体もオブジェクトなので、プロトタイプを持つこともできます。このようにサイクルが続きます。プロトタイプ チェーンが形成されます。
このチェーンは、チェーン内のフォーメーションのプロトタイプが null であることが判明すると終了します。(Object のデフォルトのプロトタイプは null です)
コード

1. var objectRef = new Object(); // 汎用 JavaScript オブジェクトを作成します。


新しい js を作成します。オブジェクトの場合、このオブジェクトのプロトタイプは現時点では Null なので、objectRef のプロトタイプ チェーンには 1 つのオブジェクトのみが含まれます。 Object.prototype
次のコードを見ています
Code

1. /* MyObject1 の型コンストラクター
2. MyObject1 - type.
3. */
4. function MyObject1(formalParameter){
5. /* オブジェクトの testNumber という名前のプロパティを作成します。 6. */
7. this.testNumber = officialParameter;
8. }
9.
10. /* MyObject2 型のコンストラクターを構築します
11. MyObject2 - type:-
12. */
13. function MyObject2(formalParameter){
14. /* オブジェクトの testString という名前のプロパティを作成します*/
15. this.testString = officialParameter; 16 . }
17.
18. /* 次のステップでは、MyObject2 のデフォルトのプロトタイプ属性を MyObject1 オブジェクトに置き換えます*/
19. MyObject2.prototype = new MyObject1(8); .
21. /* 最後に MyObject2 型のオブジェクトを作成します*/
22.
23. var objectRef = new MyObject2("String_Value");


objectRef これMyObject2 タイプのオブジェクトにはプロトタイプ チェーンがあります。チェーンの最初のオブジェクトは MyObject1 オブジェクトです。
このプロトタイプは Object.prototype のデフォルトのプロトタイプです。このプロトタイプ チェーンは終了します。
値操作が発生すると、objectRef のプロトタイプ チェーン全体が動作し始めます
コード

1. var val = objectRef.testString;


objectRef オブジェクトがありますtestString という属性がある場合、このコードは testString の値を val
コード

1 に割り当てます。 var val = objectRef.testNumber; objectRef には属性がありません。オブジェクト内の testNumber ですが、val は undefine ではなく値 8 に達しています。これは、インタプリタが現在のオブジェクトで探している属性
を見つけられなかった後に、オブジェクトのプロトタイプと objectRef をチェックするためです。プロトタイプは MyObject1 オブジェクトです。このオブジェクトには属性 testNumber があるため、val は値 8 を取得します。
コード

1. var val = objectRef.toString;


MyObject1 ではないため、この関数は Object.prototype のプロパティです。 MyObject2 にもそれはありません。toString プロパティ
を定義して、Object.prototype が返されるようにします。
コード

1. var val = objectRef.madeUpProperty;


MyObject1、MyObject2、および Object がプロパティ madeUpProperty を定義していないため、最後の val は未定義です。 get は未定義です。

読み取り操作は、obj 自体とプロトタイプ チェーンで見つかった同じ名前の最初の属性値を読み取ります。
書き込み操作は、obj オブジェクト自体に同じ名前の属性を作成します。 (属性名がそうでない場合、
の存在は、objectRef.testNumber = 3 が testNumber という名前の objectRef オブジェクトにプロパティを作成することを意味します。次回 testNumber が読み取られるとき、
propertype チェーンは動作せず、objectRef のプロパティのみが取得されます。 MyObject1 の testNumber プロパティは変更されません。次のコードを検証できます。
Code

1. /* MyObject1 型のコンストラクターを構築します
2. MyObject1 - type.
3. */
4. function MyObject1 (formalParameter){
5. /* オブジェクト 6 の testNumber という名前のプロパティを作成します。 */
7. this.testNumber =
8. }
9.
10. /* MyObject2 型のコンストラクターを構築します
11. MyObject2 - type:-
12. */
13. function MyObject2(formalParameter){
14. /* オブジェクトの場合、プロパティを作成しますnamed testString*/
15. this.testString = officialParameter;
16. }
17.
18. /* 次のステップでは、デフォルトの MyObject2 を MyObject1 オブジェクト プロトタイプ プロパティに置き換えます */
19. var obj1 = new MyObject1(8);
20. MyObject2.prototype = obj1;
21.
22. /* 最後に、タイプ MyObject2* /
23 . var objectRef = new MyObject2("String_Value");
25.
26. alert(objectRef.testNumber);
27. objectRef.testNumber = 5; );
29. アラート(obj1.testNumber);

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。