[Javascript] Prototype

プロトタイプとは?

既存のパフォーマンスを活用して拡張する必要がある場合があります.あるいは、同じプログラムを複数のオブジェクトに分けて使用する場合があります.こういうときに使うのが原型です.例えば、userという名前のオブジェクトにleeというpropertyを追加する必要がある場合、__proto__を使用して追加することができる.これを「継承」と形容する.プロトタイプは、プロトタイプを読むときにのみ使用されます.

__proto__

let walker = {
  legs:4
};
let animal = {
  eats: true
};
let rabbit = {
  jumps: true
};

animal.__proto__ = walker;
rabbit.__proto__ = animal;
console.log(rabbit.eats);

最後の行では、ウサギにrabbit.__proto__ = animal;を加えるとanimalのpropertyであり、rabbit은 animal을 상속받는다と表現される.では、コンソールの出力はtrueである.

動物をブラウザコンソールに出力すると、eatsをpropertyとして足を継承することが決定されます.

このように継承できます.
for,,inを使用してオブジェクト内でpropertyを確認すると、継承されたpropertyを確認できます.

しかし、keyとvalueが出力されると、継承された番組の価格が得られない.このように,プロトタイプはプロトタイプを読み取ることができるが,値と鍵を読み取ることはできない.__proto__は現業界ではあまり使われていない方法で、必要に応じてのみ使用することが望ましい.

prototype

Case1

const car = function(color){
	this.color = color;
    };

car.prototype.wheels = 4;
car.prototype.drive = function(){
console.log("driving~");
}

let bus = new car('red');
let taxi = new car('blue');

car.prototype.wheelはホイールをcar関数に継承し、car.prototype.driveはdrive関数を継承することができる.newを使用してジェネレータ(オブジェクトシェイプ)に変換して格納できます.

const car = function(color){
    this.color = color;
    this.wheel = 4;
    this.drive = function(){
        console.log("driving~");
        }
    };

このコードと同じ内容ですが、car関数で属性を再利用して値を取得する場合はprototypeを使用します.
また、プロトコル・タイプを使用すると、再利用性が向上し、メモリ効率が向上します.

Case2

function Person(name, first, second,third){
    this.name = name;
    this.first = first;
    this.second = second;
    this.sum = function(){
	return 'prototype : '+(this.first+this.second);
}

let kim = new Person('kim', 10, 20);
let lee = new Person('lee', 10, 20);
console.log(kim.sum());
console.log(lee.sum());

上記のように、Person関数でもう1つの関数を宣言し、メソッドを作成し、コンストラクション関数を生成し、必要な値を出力することができます.ただし、kimが実行されると、leeが実行されるたびにsum()が呼び出される.数が少なければ問題ないと思いますが、呼び出す関数が多ければ、プログラムに相応の遅延が生じるので、あまりよくありません.
しかし、下図に示すように、sum関数をprototypeに継承すると、personメソッドが実行されるたびに呼び出されるのではなく、呼び出された後にsum()関数が共有される.複雑なコードやコンストラクション関数を複数回繰り返すと、プログラムのパフォーマンスが向上し、メモリ効率が向上します.

function Person(name, first, second,third){
    this.name = name;
    this.first = first;
    this.second = second;
}

Person.prototype.sum = function(){
	return 'prototype : '+(this.first+this.second);
}

let kim = new Person('kim', 10, 20);
let lee = new Person('lee', 10, 20);
console.log("kim.sum()",kim.sum());
console.log("lee.sum()",lee.sum());