javascript高級プログラム設計---6対象向けプログラミング

オブジェクトを作成
1、工場モード
ECMAScriptではクラスを作成できませんので、特定のインターフェースでオブジェクトを作成するための詳細を関数で実装します.

function createPerson (name: string, age: number, job: string) {
  const o: any = new Object();
  o.name = name;
  o.age = age;
  o.job = job;
  o.sayName = function () {
    console.log(this.name);
  }
  return o;
}

const person1 = createPerson('Nicholas', 27, 'engineer');
const person2 = createPerson('Greg', 57, 'Doctor');

console.log(person1.sayName()); // Nicholas
console.log(person2.sayName()); // Greg

類似した複数のオブジェクトを作成する問題は工場関数モードで解決されたが、オブジェクト識別の問題は解決されなかった.
2、コンストラクタモード
ECMAScriptの構造関数は、特定のタイプのオブジェクトを作成するために使用されます.前の例を次のように書き直す.

function Person(this: any, name: string, age: number, job: string){
  this.name = name;
  this.age = age;
  this.job = job;
  this.sayName = function () {
    console.log(this.name);
  }
}

const person1 = new (Person as any)('Nicholas', 27, 'engineer');
const person2 = new (Person as any)('Greg', 57, 'Doctor');

console.log(person1.sayName()); // Nicholas
console.log(person2.sayName()); // Greg

console.log(person1 instanceof Person); // true
console.log(person1 instanceof Object); // true

このモデルは工場モデルと比べて、以下の違いがあります.

は、オブジェクトを明示的に作成しない

.

は、直接に属性と方法をthis変数

に与えた.

リセット文がありません.

また、関数名の頭文字を大文字にします.構造関数はいつも大文字で始まります.非構造関数は小文字で始まるべきです.ここでPersonの新しい例を作って、newオペレータを使わなければなりません.このプロセスは次の4つのステップを経験します.

新しいオブジェクトを作成します.

は、構造関数のスコープを新しいオブジェクトに割り当てます.

は、コンストラクタ内のコード(この新しいオブジェクトに属性を追加)を実行します.

は新しいオブジェクトを返します.

工場の関数と比べて、対象の種類が表示されていますか?

console.log(person1 instanceof Person); // true
console.log(person1 instanceof Object); // true
console.log(person2 instanceof Person); // true
console.log(person2 instanceof Object); // true

  

console.log(person1.constructor === Person); // true
console.log(person2.constructor === Person); // true

person 1とperson 2はObjectの例であり、Personの例でもある.
ps:コンストラクタは普通の関数としてコンストラクタと普通の関数を使用する唯一の違いとしてもいいです.任意の関数は、newオペレータを通じて呼び出されれば、構造関数として機能することができます.
コンストラクタはオブジェクトタイプの標識の問題を解決しましたが、共有属性と方法の問題が解決されず、メモリが無駄になりました.
3、原型モード
各関数にはプロトタイプの属性があります.この属性は、あるオブジェクトを指します.

export const Person =  function () {

}

Person.prototype.name = 'Nicholas';
Person.prototype.age = 27;
Person.prototype.job = 'engineer';
Person.prototype.sayName = function () {
  console.log(this.name);
};

const person1 = new (Person as any)();
const person2 = new (Person as any)();
console.log(person1.sayName());
console.log(person2.sayName());
console.log(person1.sayName === person2.sayName); // true

4、コンストラクタモードとプロトタイプモードを組み合わせて使用する(最も広く使用されており、許容度が最も高い)
ユーザー定義のタイプを作成するための最も一般的な方法.コンストラクタモードは、実例的な属性を定義するために使用され、コンストラクタへの参照が可能です.プロトタイプモードは、メソッドと共有属性を定義するために使用され、メモリを最大限に節約します.

export const Person = function (this: any, name: string, age: number, job: string) {
  this.name = name;
  this.age = age;
  this.job = job;
  this.friends = ['Shelby', 'Court'];
}

Person.prototype = {
  constructor: Person,
  sayName: function () {
    console.log(this.sayName());
  }
}

const person1 = new (Person as any)('Nicholas', 27, 'engineer');
const person2 = new (Person as any)('Greg', 57, 'Doctor');

person1.friends.push('Van');
console.log(person1.friends); // [ 'Shelby', 'Court', 'Van' ]
console.log(person2.friends); // [ 'Shelby', 'Court' ]

console.log(person1.sayName === person2.sayName); // true

5、ダイナミックモデル
すべての情報をコンストラクタに封入し,プロトタイプをコンストラクタ内で初期化することによって(必要な場合のみ),コンストラクタとプロトタイプを同時に使用する利点を維持した.

export const Person = function(this: any, name: string, age: number, job: string){
  this.name = name;
  this.age = age;
  this.job = job;

  //   if               。          ，              。
  if (typeof this.sayName !== 'function') {
    Person.prototype.sayName = function(){
      console.log(this.name);
    }
  }
}

const person1 = new (Person as any)('Nicholas', 27, 'engineer');
const person2 = new (Person as any)('Greg', 57, 'Doctor');
console.log(person1.sayName());
console.log(person2.sayName());