ホームページ > ウェブフロントエンド > jsチュートリアル > JavaScript の壊れたスレッド、プロトタイプ、プロトタイプ チェーン

JavaScript の壊れたスレッド、プロトタイプ、プロトタイプ チェーン

灭绝师太
リリース: 2021-11-04 12:00:01
オリジナル
1440 人が閲覧しました

JavaScript の壊れたスレッド、プロトタイプ、プロトタイプ チェーン

プロトタイプとプロトタイプ チェーンの関係は JavaScript のオブジェクトを介して実行され、JavaScript のすべてはオブジェクトであるため、プロトタイプとプロトタイプチェーンの方が重要 JavaScript の概念、今日は JavaScript のプロトタイプとプロトタイプ チェーンを見ていきます。

#1. 概念を理解する (これら 2 つの名詞を知っておくだけ)

  1. プロトタイプ (

    )プロトタイプ<em></em>)

  2. #プロトタイプ チェーン (
  3. __

    proto__<em>)</em>

#2. 所属関係を理解する

prototype  => 函数的一个属性         : 同时也是一个 对象{} (称之为原型对象亦可)

__proto__ => 对象Object的一个属性   : 同时也是一个 对象{}   (__proto__也就是[[Prototype]])
ログイン後にコピー
注: オブジェクトの __proto__ は、オブジェクトのコンストラクターのプロトタイプを保存します

a. コンストラクターを宣言します

    function Test() { }
  
    //prototype 是函数的一个属性
    console.dir(Test);
    console.log(Test.prototype);
    // Test.prototype也是一个对象
    console.log(typeof Test.prototype);
ログイン後にコピー

b. オブジェクトを宣言します

    const test = new Test();
    
    console.log(test);
    //验证test为一个对象
    console.log(typeof test);
    //__proto__是对象的一个属性
    console.log(test.__proto__);
    console.log(Test.prototype);
    //对象的__proto__属性存储着Test.prototype
    console.log(test.__proto__ === Test.prototype);
    // test.__proto__也是一个对象
    console.log(typeof test.__proto__);
ログイン後にコピー
function Test() {}
console.log(Test.prototype); //验证函数是否有prototype属性

let test = new Test();
console.dir(test.__proto__); //验证对象是否有__proto__属性
console.log(test.__proto__ === Test.prototype);//验证对象的__ptoto__是否保存着该对象的构造函数的prototype

console.log(Test.prototype.__proto__ === Object.prototype);//Test.prototype(是一个对象)的__proto__属性是否是对象的原型属性
console.log(Object.prototype.__proto__);//原型链的顶层没有__proto__属性 null
ログイン後にコピー

3. In-プロトタイプチェーン、プロトタイプ、およびプロトタイプの継承についての深い理解

##

    function Test(){}
    let test =new Test();
    test.a= 10;
    //test.__proto__ === test.constructor.prototype
    test.__proto__.b1=11;//对象的__proto__属性存储着对象构造函数的prototype属性
    Test.prototype.b2=11;
   
    test.__proto__.__proto__.c1=12;
    Object.prototype.c2=12;
    console.log(test);
    console.log(Test.prototype);
    console.log(Object.prototype.__proto__);
   
    /*逐层解析
    * test{
    *        a = 10
    *        __proto__:Test.prototype{
    *                 b = 11
    *                 __proto__:Object.prototype{
    *                           c = 12
    *                           X__prototype__:null
    *                 }         
    *        }
    *     }
    *
    * */
ログイン後にコピー
# 4. 概要


##__proto__

  • を使用して直接アクセスすることはお勧めできません。

    は、

    prototype
  • をプロトタイプ ノードとして、

    __proto__<span style="color: rgb(0, 0, 0);"></span> をプロトタイプ ノードとして取得すると単純に要約できます。プロトタイプチェーン。 <span style="color: rgb(0, 0, 0);"></span>すべてのインスタンス オブジェクト (

    object
  • ) にはプライベート プロパティ (

    __proto__<span style="color: rgb(0, 0, 0);"> </span> と呼ばれる) があります。コンストラクターのプロトタイプ オブジェクト (prototype<span style="color: rgb(0, 0, 0);"></span>) を指します。プロトタイプ オブジェクトには、独自のプロトタイプ オブジェクト (__proto__<span style="color: rgb(0, 0, 0);"></span>) もあり、オブジェクトのプロトタイプ オブジェクトが null<span style="color: rgb(0, 0, 0);"></span> になるまで階層化されます。定義上、null<span style="color: rgb(0, 0, 0);"></span> にはプロトタイプがなく、このプロトタイプ チェーンの最後のリンクとして機能します。 <span style="color: rgb(0, 0, 0);"></span>

  • someObject.[[Prototype]]
  • シンボルは <span style="color: rgb(0, 0, 0);">someObject を指すために使用されます</span>,someObject.[[Prototype]]<span style="color: rgb(0, 0, 0);"></span> === <span style="color: rgb(0, 0, 0);"></span>__proto__## のプロトタイプ#(JavaScript の非標準プロパティですが、多くのブラウザーで実装されています)。 <span style="color: rgb(0, 0, 0);"></span><span style="color: rgb(0, 0, 0);"></span>#Object.prototype

  • 属性は、

    Object<span style="color: rgb(0, 0, 0);"># のプロトタイプを表します。 ## 物体。 </span> コンストラクターによって作成されたインスタンス オブジェクトの <span style="color: rgb(0, 0, 0);">[[Prototype]]</span>

  • func
  • を指します。

    <span style="color: rgb(0, 0, 0);">プロトタイプ</span> 属性。 <span style="color: rgb(0, 0, 0);"></span># おすすめ動画: 「JavaScript 入門_翡翠少女般若心経シリーズ」、<span style="color: rgb(0, 0, 0);">「独具九品 (6)_jQuery ビデオチュートリアル」</span>

以上がJavaScript の壊れたスレッド、プロトタイプ、プロトタイプ チェーンの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート