オブジェクト向けの生活符号化プログラミングの授業を見て整理した内容です.
昨日、昨日は、オブジェクトの作成と使用方法を学習します.今、対象に対する理解に基づいて、私はもっと深い内容を学びたいです!

1. constructor

1-1. コンストラクション関数の必要性

以前のようにオブジェクトを作成すると、

const kim = {
  name: "kim",
  first: 10,
  second: 20,
  sum: function () {
    return this.first + this.second;
  },
};

const lee = {      //다른사람을 또 하나 만들어본다.
  name: "lee",
  first: 10,
  second: 10,
  sum: function () {
    return this.first + this.second;
  },
};

console.log(kim.sum());  //30
console.log(lee.sum());  //20

→残念ながら、オブジェクトの動作方式が変わって(例えば、thirdが追加されている)修正が必要な場合は、それだけでなく、同じ形状のすべてのオブジェクトに適用されるはずです.もしこのような仕事が1億個も与えられるとしたら、?🤦🏻‍♀️

const kim = {
  name: "kim",
  first: 10,
  second: 20,
  third: 30,    				   //여기도 추가해주고
  sum: function () {
    return this.first + this.second + this.third;  //여기도 추가해주고
  },
};

const lee = {    
  name: "lee",
  first: 10,
  second: 10,
  third: 10,    				   //여기도 추가해주고
  sum: function () {
    return this.first + this.second + this.third;  //여기도 추가해주고
  },
};

console.log(kim.sum());  //60
console.log(lee.sum());  //30

→つまり、このようにオブジェクトの基本的な動作方法を変えたら、同じ趣旨のオブジェクトはこのように~~~変えるべきだ.
👏🏻 そこで、このような形式のオブジェクトを印刷する工場(コンストラクション関数)を作成し、この工場を使用してオブジェクトを量産しましょう.✨

1-2. コンストラクション関数の例

JavaScriptには、時間を特定するためにDateと呼ばれるものがあります.

とDateを使用する場合は、newキーワード、

を使用してください.
現在の日付は、

およびDate(かっこ)に記載されています.

そしてd 1なら
=>内部では、2020年12月28日にデータ(ステータス)と呼ばれる新しいオブジェクトをd 1として作成します.

(比較)の上に、作成したconst lee、constkimはオブジェクトの設計図を露出し、

Date()では、最終的に作成されたオブジェクトの設計図が見えません.

ですが、d 1という名前のオブジェクトを使用することができます.

const d1 = new Date("2020-12-28");

console.log(d1.getFullYear()); //그 객체에게 연도를 물어본거다.    ... 2020
console.log(d1.getMonth());// 11 이 나오는데 ... month는 0부터 count 되기 때문이다. 

const d1 = new Date("2020-12-28");←これは関数を呼び出しているように見えますよね?👀 .. そうだ.そのDateが関数だから!console.log(Date);を印刷すると下の写真のように解けば….Dateは関数、native codeは内蔵関数という意味です.

1-3. コンストラクタの作成

次に、Dateのようにオブジェクトを印刷する工場を作成します.🙂

function Person() {
    this.name = "kim";
    this.first = 10;
    this.second = 20;
    this.third = 30;
    this.sum = function () {
      return this.first + this.second + this.third;
    };
}

→そして先ほど作成したPersonという関数を直接呼び出します!

console.log(Person());  //undefined

🤔 なぜundefinedが現れたのでしょうか?=>Person関数は何も返さなかったからです.
🤚🏻 でもPersonの前にnewというキーワードを付けたら?今ではPersonという関数が全く違う存在になっています!

console.log(new Person());    //Person {name: "kim", first: 10, second: 20, third: 30, sum: f}

→結果としてPersonという名前のオブジェクトが作成された…このオブジェクトのプロパティはnameがkim、firstが10...sumという関数もあります!

をまとめると、直接関数を呼び出すと、それが関数です.

でも前にnewというキーワードをつけると、今ではこの関数は一般的な関数ではありません!

オブジェクトを生成するジェネレータ!!!では、ジェネレータは英語で?constructor!

だからnew Person()のように前にnewが貼ってあったら!脈絡の上でそれを構造関数と呼ぶことも覚えておいてください.

では、今どのように変化しているのか見てみましょう.

const kim2 = new Person();
const lee2 = new Person();

そして運転中に何が起こるか見てみましょう!

console.log(kim2.sum()); //60
console.log(lee2.sum()); //60

🤔 ... どちらも60ですが、理由は何ですか?
→kim 2でのnew Personとlee 2でのnew Personは内部的に同じ状態であるため.
👏🏻 では、今私は何をしたいですか?
Dateオブジェクトと同様(const d1 = new Date("2020-12-28");)、
コンストラクション関数の実行時に入力値を注入できるように、私たちもできます!それを試してみましょう.

function Person3(name, first, second, third) {
    this.name = name;
    this.first = first;
    this.second = second;
    this.third = third;
    this.sum = function () {
      return this.first + this.second + this.third;
    };
}

const kim3 = new Person3("kim", 10, 20, 30);
const lee3 = new Person3("lee", 10, 10, 10);

console.log(kim3.sum());  //60
console.log(lee3.sum());  //30

これが、オブジェクト印刷ファクトリ構造関数を作成する方法です.✨
😇✨ だからconstructor functionを作るメリットは!

の前に、カッコでオブジェクトを作成するたびに、オブジェクトを再定義する必要があります.

const kim = {
  name: "kim";
  first: 10;
  second: 20;
  sum: function () {
    return this.first + this.second;
  };
};   //.. 이렇게

現在、このconstructor functionを作成した場合、newを前に使用します.実行するたびに、大量のオブジェクトが生成されます.

そして!constructor functionの内容が変更された場合、このconstructor functionを使用して作成されたすべてのオブジェクトはです.丸いパン.変化する爆発的な効果が得られます.🥳 🎉

では、constructor関数とは何か、constructor関数を書くメリットがあることを知っています.🙂

2. prototype

原型は韓国語で「原型」と訳すことができる.どんな物事の共通の姿ですか.それとも本来の姿?
JavaScriptでのプロトタイプは何ですか?JavaScriptをオブジェクト向け言語(オブジェクト向け言語)と呼ぶように、プロトタイプベース言語(プロトタイプベース言語)とも呼ばれる.このように叫ぶ!プロトタイプはJavaScriptを支える基礎といえる.

2-1. なぜプロトタイプが必要ですか?

function Person(name, first, second, third) {   //Person이라고 하는 함수가 이거 *
    this.name = name;
    this.first = first;
    this.second = second;
    this.third = third;
    this.sum = function () { 
      return this.first + this.second + this.third;
    };
}

const kim = new Person("kim", 10, 20, 30);  //kim이라는 객체를 생성하는게 이거 *
const lee = new Person("lee", 10, 10, 10);

constructor functionを利用してここまで作られていますが、残念な点があります.
今から見れば,kimオブジェクトを生成する際に,構造関数としてPersonという関数∮を用いた.しかしこの構造関数にはthisがありますsumという関数が含まれているため、オブジェクトを作成するたびに一緒に作成および実行され、コンピュータのメモリが浪費されます.また、作成するオブジェクトが非常に多いと仮定すると、この関数の作成に時間がかかり、パフォーマンスが低下する可能性があります.
🚨 だからこの部分を修正します!

2-2. プロトタイプを使用して再利用性を向上

ジェネレータによって作成されたすべてのオブジェクトで共通に使用されるプロパティを作成するには、プロトタイプという概念を使用します.prototypeを用いて、それぞれ生成サブ関数から共通の使用方法を減算する.

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

//Person이라는 생성자 함수에 공통적으로 사용할 sum이라는 method를 이렇게 만든다!
Person.prototype.sum = function () {
  //그럼 여기안에서 수정해도 Person을 통해 만든 객체 전부에게 적용된다.
  return this.first + this.second + this.third ;
}; 

// 출력해보면,
const kim = new Person("kim", 10, 20, 30);
const lee = new Person("lee", 10, 10, 10);

console.log(kim.sum()); //60
console.log(lee.sum()); //30

→出力の結果は同じ!このようにするのは違いがある.

Personという名前のコンストラクション関数(コンストラクション関数)にはsumが定義されていないため、オブジェクトを作成するたびに実行されず、一度だけ実行されます.
:一度だけ定義するので、パフォーマンスとメモリを節約できます.

および1つの関数は、多くのオブジェクトによって共有され得る.(Prototypeを使用して作成した1つの関数でのみ変更できます.)
:パフォーマンスとメモリを節約できます.

多くの同類オブジェクトの中で、1つのオブジェクトだけを修正する方法も可能です!

kim.sum = function () {
  return "this method has changed!";
};

console.log(kim.sum());  //this method has changed!
console.log(lee.sum());  //30

🤔 変数kimが指すオブジェクトのsum methodだけが異なる役割を果たすのはなぜですか?(プロトタイプの特徴.)
→JavaScript kimオブジェクトのsumメソッド(kim.sum())を呼び出すと、まず、そのオブジェクト自体がsumと呼ばれる属性を持っているかどうかを調べる.(=その属性は現在ここでは関数)であるため、kim.sum = function () { return "this method has changed!"; };を実行させ、そこで終了させる.
しかしleeという名前のオブジェクトは、const lee = new Person("lee", 10, 10, 10);が作成されてからsumという方法を定義したことがありません!JavaScriptでは、検索するオブジェクト自体が(lee.sum())leeと呼ばれていない場合、オブジェクト作成者Personのプロトタイプsumと呼ばれ、見つかった場合に実行されるメソッドが定義されているかどうかを検索します.
これらの質問に答えることができます.🙂

プロトタイプは何を意味しますか?

プロトタイプを使用しないで、この構造関数で直接方法または属性を定義すると、どのような低効率

が生成されますか.

プロトタイプによってその低効率をどのように克服するか