ホームページ > ウェブフロントエンド > jsチュートリアル > オブジェクトを作成するためのモードは何ですか?

オブジェクトを作成するためのモードは何ですか?

零下一度
リリース: 2017-06-26 11:29:27
オリジナル
1515 人が閲覧しました

1 new Object()

まず Object インスタンスを作成し、次にそれにプロパティとメソッドを追加します

var Person = new Object()
Person.name = 'hl'
Person.sayName = function () {
  console.log(this.name)
}
ログイン後にコピー

2 オブジェクト リテラル メソッド

オブジェクト リテラル メソッドは、オブジェクトを作成するための最も速くて便利な方法であり、多くのオブジェクトで使用されますシナリオ。

var Person = {
  name: 'hl',
  sayName: function () {
    console.log(this.name)
  }
}
ログイン後にコピー

オブジェクト リテラル メソッドの欠点は、同じ型の複数のオブジェクトを作成するときに、大量の重複コードが生成されるため、ファクトリ パターンになることです。

3 ファクトリ パターン

ファクトリ パターンは、関数を使用してオブジェクト作成の詳細をカプセル化し、関数を呼び出すときにオブジェクトのプロパティを渡してオブジェクトを返します。

function createPerson (name) {
  return {
    name: name,
    sayName: function () {
      console.log(this.name)
    }
  }
}
var person = createPerson('hl')
var person = new createPerson('hl') // 寄生构造函数模式
ログイン後にコピー

new 演算子を使用しても同じ結果が得られます。このメソッドは寄生コンストラクター パターンと呼ばれ、関数を直接呼び出すのと何ら変わりません。
ファクトリ パターンは、同じタイプの複数のオブジェクトを作成する問題を解決しますが、オブジェクトの特定のタイプを識別することはできません。

4 コンストラクター パターン

コンストラクターを通じて作成されたオブジェクトの場合、instanceof 演算子を使用してオブジェクトのタイプを決定できます。プログラミング規約に従って、コンストラクター名は通常の関数と区別するために大文字にする必要があります。

function Person (name) {
  this.name = name
  this.sayName = function () {
    console.log(this.name)
  }
}
p = new Person('hl')
p instanceof Person // true
ログイン後にコピー
造のコンストラクタの特徴:

  • 表示されない作成オブジェクト

  • Return文を使わずにthis

  • に直接代入されるメソッドの属性とメソッド

  • 新しい関数の欠点は、各メソッドがインスタンスごとに再作成され、メモリの無駄が発生することです。

    5 プロトタイプ パターン
プロトタイプ パターンを使用すると、オブジェクトにプロパティとメソッドを簡単に追加できます。

function Person () {
}
var p = new Person()
Person.prototype.name = 'hl'
Person.prototype.sayName = function () {
  console.log(this.name)
}
p.sayName() // hl
ログイン後にコピー
プロトタイプは動的です。つまり、最初にオブジェクトが作成され、次にプロトタイプが変更され、インスタンスは対応するプロパティとメソッドを取得することもできます。

プロトタイプ モードには欠点がないわけではありません。まず、プロトタイプ モードでは初期化パラメータを渡すことができないため、各インスタンスが同じプロパティを取得します。次に、参照型の値については、すべてのインスタンスが同じオブジェクトを参照します。

function Person () {
}
Person.prototype.relative = ['father','mother']

var person1 = new Person()
var person2 = new Person()
person1.relative.push('sister')
console.log(person2.relative) // [ 'father', 'mother', 'sister' ]
ログイン後にコピー

person1 の属性を変更すると、person2 の属性も変更されます。通常、インスタンスは独自の属性を持つ必要があるため、プロトタイプ パターンが単独で使用されることはほとんどありません。

6 コンストラクター パターンとプロトタイプ パターンを組み合わせて使用​​する

オブジェクトを作成する最も一般的な方法は、コンストラクター パターンとプロトタイプ パターンを組み合わせて使用​​することです。コンストラクターはカスタム プロパティに使用され、プロトタイプ パターンは共有プロパティとメソッドを定義するために使用されます。

function Person (name) {
  this.name = name
}
Person.prototype.sayName = function () {
  console.log(this.name)
}
ログイン後にコピー
7 動的プロトタイプ パターン

プロトタイプをコンストラクターで初期化し、オブジェクト作成プロセスをより適切にカプセル化できます。

function Person(name) {
  this.name = name
  if (typeof this.sayName !== 'function') {
    Person.prototype.setName= function (name) {
      this.name = name
    }
    Person.prototype.sayName = function () {
      console.log(this.name)
    }
  }
}
ログイン後にコピー
if を使用してすべてのプロパティまたはメソッドをチェックするのではなく、プロトタイプの初期化後に存在するはずのプロパティまたはメソッドの 1 つだけをチェックします。

8 安全なコンストラクター パターン

安全なオブジェクトとは、パブリック プロパティを持たず、そのプロパティとメソッドがこのオブジェクトを参照せず、オブジェクトの作成に new 演算子が使用されないことを意味します。データの変更を防ぐためのセキュリティが必要な一部の環境での使用に適しています。

function Person (name) {
  return {
    sayName: function () {
      console.log(name)
    }
  }
}
var person = Person('hl')
ログイン後にコピー
セーフ モードで作成されたオブジェクトには、コンストラクターで定義されたメソッドを使用する以外に、コンストラクターに渡された元のデータを変更したりアクセスしたりする方法はありません。

以上がオブジェクトを作成するためのモードは何ですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート