JavaScript Prototypeを簡単に理解

16314 ワード


なぜPrototypeを再ポップアップして作成しますか?

JavaScriptPrototypeに基づく言語と呼ばれている.以前にもPrototypeについて勉強したことがありますが、大体分かりました.でも今からPrototypeを見ると、何を言っているのかよく覚えていません.
要するに、JavaScriptPrototypeに基づく言語であることが重要である.つまり、PrototypeはJavaScriptの核心と基礎である.その基礎を身につけてこそ、言語を制御するのに役立つと思います.

プロトタイプベース?それは何ですか。

프로토타입 기반 프로그래밍は、オブジェクト向けプログラミングの形式である.Classのオブジェクト指向言語を使用して、Classに記載された内容に従ってインスタンスを生成し、オブジェクトを使用する.JavaScriptはオブジェクト向けの言語ですが、Prototypeをベースにしています.Prototypeを使用して、新しいオブジェクトを継承および拡張して生成します.ES5以降,Classを用いて表現され,プロトタイプがClassベースに変換されただけでなく,文法のみが変更された.

ではなぜJavaScriptはClassではなくPrototypeに基づいて作成されたのでしょうか。


Classよりも少ないメモリを使用します。


これはPrototypeの利点であり、Classベースよりもメモリをより少なく使用する.VrGearという青写真があります.この青写真に基づいた製品には共通の機能が必要であり、追加する製品にも同じ機能が含まれている必要があります.
function VrGear() {
 this.hello = function(){ console.log("I'am A")};
 this.introduce = function(){ console.log("I'am B")};
}

let Quest2 = new VrGear();
let Vive = new VrGear();

console.log(Quest2);
console.log(Vive);

図に示すように、helloおよびintroduceの機能は、それぞれの製品に割り当てられる.それでは全部で4つ!4つの変数がメモリに割り当てられます.Lift SReverbなどの製品を引き続き発売すると、2つ増加するごとにメモリも比例してスペースを占有します.
このような問題はPrototypeで解決できる.
//VrGear이라는 원형 청사진을 만든다.
function VrGear() {}

VrGear.prototype.handTracking = function(){console.log("possible?")};
VrGear.prototype.frequency = function() {
                                  const hertz =[60, 120, 144]; 
				  for(let hz of hertz){
                                   console.log(`${hz}hz`)
                                  }
                             };

let Quest2 = new VrGear();
let Vive = new VrGear();

console.log(Quest2);
console.log(Vive);

簡単に言えば、VrGear.prototypeというある場所に存在する空のオブジェクトに、いくつかの機能が追加され、作成された製品Quest2Viveが、ある場所に存在するオブジェクトにおける機能(属性)をもたらし、使用する.
最終的に、両方の製品は、プロパティをどこかで共有するために同じ機能を使用すると解釈されます.
では、なぜ可能なのかよく理解してみましょう.

なぜ共有できるのでしょうか?


JAvascriptにはPrototype LinkPrototype Objectが存在し、総称してPrototypeと呼ばれる.Prototypeをより容易に理解するために、多く参考して、いくつかの種類に分けて書きます.整理した内容を見て、Prototypeを理解してください!!

1.オブジェクトは常に関数です。


言い換えれば、객체は常に함수(Function)を生成する.
function A() {} //함수
let func = new A(); //func는 함수로 객체 생성

let arr = [];
let obj = {};
funcは、関数A()によって生成される単一のオブジェクトである.arrobjも実は関数によって生成されます.
let arr = new Array();
let obj = new Object();
arrobjはJavaScriptに組み込まれた関数なので、すべてのオブジェクトは関数から始まります.

すべてのタイプを関数に印刷します.undefinednullを除いて

2.Constructor資格を持つ関数「」のみnewキーワードを使用可能

Constructor資格が付与されている場合、newキーワードを使用してオブジェクトを作成できます.

上のイメージのように近づくと、googlechromeお兄さんは資格がないと拒否します.
最終的には、すべての関数がConstructorになります.したがって、newを使用できるのは関数のみです.

3.Prototypeオブジェクトはプロトタイプのコピーであり、すべてのオブジェクトの拡張はここで完了します。

VrGearという名前の関数が定義されています.関数を定義すると、独自の定義とともにPrototype Objectというコピーも作成されます.基本的には__proto__Constructorの資格を持っています.

Constructorは自分のオリジナルを指し、prototypeはコピーを指す.
現在、開発者は製品を設計する際に、いくつかの汎用機能を追加しようとしています.Prototype Objectは通常のオブジェクトであるため、レプリカに機能を追加するためにprototypeという属性でアクセスすることができる.
開発者が希望する機能を追加または削除できる方法が分かった.
VrGear.prototype.handTracking = function(){console.log("possible?")};
VrGear.prototype.frequency = function() {
                                  const hertz =[60, 120, 144]; 
				  for(let hz of hertz){
                                   console.log(`${hz}hz`)
                                  }
                             };

let Quest2 = new VrGear();
let Vive = new VrGear();

4.protoは自分の祖先に知らせる族譜、鍵です。

__proto__部分を見て、Assassin's Creedというゲームを思い出しました.なぜこいつは祖先を教える族譜と鍵なのか.
上には、VrGearというオリジナルコピーの青写真を使用して、各製品が使用できるように汎用機能を追加した開発者もいます.しかし、ViveおよびQuest2の内部にはこの機能は存在しない.Prototype Objectに存在する機能の使用については、参照方法を理解する必要があります.
その存在は、各ゲストが持つ__proto__の属性と鍵である.

これらの機能はコピーVrGear.prototypeに存在することが分かった.VrGear.prototypeにもないと仮定すると、__proto__の属性を使用して、対応する機能が見つかるまで、最も高いObjectPrototype Objectに達するまで探索することができる.見つからない場合は、よくあるundefinedTypeErrorを見学することができます.

このように一番上から一番下までのオブジェクトは情報を共有し、一番下のオブジェクトは__proto__属性で一番上まで接続された接続リングをPrototype Chainと呼ぶ.

3行の概要

  • Prototypeはオブジェクト向けの方法であり、Classよりもメモリ消費量が少ない
  • Prototypeは、任意のオブジェクトを作成するためにその母体となるやつ
  • である.
  • ファミリースペクトル
  • の最後の部分


    もう忘れないで
    ref: プロトタイプの理解 , りん酸赤型 , JavaScriptのプロトタイプを使用する理由