JavaScriptのOops -オブジェクトとDunderプロトにより深く

In this post, originally published here we shall dive a bit deeper into nature of objects, and cover the Dunder Proto concept.

This post is part of the Advanced JavaScript series where I try to explain essential advanced JS concepts in a simple manner.

物体の性質
以下のオブジェクトを考えてください.

let details = {
name: 'Richard Hendricks',
company: 'Pied Piper',
};

上記のオブジェクトで、プロパティにアクセスしようとするとcompany , から可能ですcompany の既存のプロパティですdetails オブジェクト.
しかしながら、以下の断片は戻りますundefined -

console.log(details.designation); //undefined

これは所有権がないからですdesignation 内部details . これは、オブジェクトが振舞うのをどのように予想するかということです.
ただし、以下の例を見てください.

let arr = [1, 2, 4, 5, 7];

console.log(arr.map( () => 21 );

出力は以下の通りです.

でもmap() 内部メソッドではありませんarr . では、これはどのように計算され、どこから来るのですか?

dunder proto__proto__JavaScript内のすべてのオブジェクトの内部にあると呼ばれる特殊なプロパティDunder Proto . 名前はこのオブジェクトが表現されている方法のために作られます.__proto__ (単語の両側にダブルアンダースコアを伴うproto ).
上記のイメージで見ることができるように、オブジェクトarr (基本的にJSで作成するすべてのオブジェクト)[[Prototype]]:Array 内側にあるプロパティ__proto__ . 拡大すれば[[Prototype]]: Array プロパティの例では、我々は見ることができる必要があります__proto__ , これには、次のような方法の巨大なリストが含まれますevery , forEach , map , splice , など

ここで注意すべき点は、我々が作成する各オブジェクトは、__proto__ プロパティ.
定義されたオブジェクトに存在しないプロパティをコール/アクセスしようとすると、JSエンジンは__proto__ 鎖🐇 の場合は、そのプロパティを検索します.上記の例ではmap() 配列上のメソッド(オブジェクトです)__proto__ 同じものを探すチェーン.
これは、オブジェクトの隠された性質がすべての配列、オブジェクトとストリングメソッドを実行するのを許す方法です.
以来__proto__ オブジェクトの特別なプロパティです.下に新しいプロパティを追加したいとします__proto__ にdetails 上記のオブジェクトです.

details.__proto__.alertMsg = function () {
alert(`Hello Dunder Proto => __proto__`);
}

この関数は__proto__ プロパティは以下の通りです.

JavaScriptのオブジェクトの隠された性質を学び、dunder protoの基礎を学びました.次のポストでは、なぜ私たちのコードをより効率的にするためにdunder protoを使用することができます.
次回まで!🙌