概要プロトタイプ パターンは、プロトタイプ インスタンスによって作成されるオブジェクトの型を指し、これらのプロトタイプをコピーすることで新しいオブジェクトが作成されます。これは、オブジェクトを作成する、つまり、別のオブジェクトのプロトタイプ プロパティとしてオブジェクトを作成するために使用されるパターンです。 プロトタイプの警告: プロトタイプ モードについて学習する前に、まずプロトタイプ、プロトタイプ チェーン、プロトタイプ、__proto__、コンストラクターなどの知識について学習する必要があります。 プロトタイプパターンの実装ES5 API: Object.create(プロトタイプ、オプションのDescriptorObjects) Object.create() メソッドは 2 つのパラメータを受け取ります。最初のパラメータは __proto__ オブジェクトで、2 番目は prototiesObject です (オプション。2 番目のパラメータは追加のプロパティを初期化するために使用でき、リテラル オブジェクト形式を受け入れます)。 var 車両プロトタイプ = { モデル:"ポルシェ", getModel: 関数 () { console.log('車両モデルは: ' + this.model); } }; var 車両 = Object.create(車両プロトタイプ,{ "モデル":{ 値:"フェラーリ" } }); automobile.getModel(); // 車両モデル: Ferrari 実際に新しいオブジェクト automobilePrototype を作成するには Object.create を使用し、vehiclePrototype のメソッドを継承します。つまり、この時点では、vehicle.__proto__ == automobilePrototype; です。 2 番目のパラメータで「model」の値が初期化され、model の値が「Ferrari」に初期化されるため、この時点で新しく作成されたオブジェクト automobilePrototype にはモデルが 1 つだけ存在し、値は「Ferrari」になります。 Object.create() を使用する代わりに、プロトタイプを使用します。 var 車両プロトタイプ = { init: 関数 (carModel) { this.model = carModel || "ポルシェ"; }, getModel: 関数 () { console.log('車両モデルは: ' + this.model); } }; 関数 車両(モデル) { 関数F(){}; F.prototype = 車両プロトタイプ; var f = 新しい F(); f.init(モデル); f を返します。 } var 車 = 車両('フェラーリ'); car.getModel(); // 車両モデルは: Ferrari 上記のコードでは、コアが車両にあることがわかります。最初に新しいコンストラクタを作成し、関数のプロトタイプをvehiclePrototypeにポイントし、関数をインスタンス化し、最後に継承後にプロトタイプのinitメソッドを呼び出します。最後に、実行結果を返すこともできます。 要約するプロトタイプ パターンは JavaScript に広く普及しており、他の多くのパターンもプロトタイプに基づいて実装されているため、プロトタイプ、__proto__、コンストラクターなどの主要な属性の知識ポイントに重点を置いて、プロトタイプとプロトタイプ チェーンの知識を学習して復習することが重要です。 以上がJavaScriptでプロトタイプパターンを実装する方法の詳細です。JavaScriptプロトタイプパターンの詳細については、123WORDPRESS.COMの他の関連記事に注目してください。 以下もご興味があるかもしれません:
|
<<: CentOS7 に Redis をインストールして設定する方法
>>: MySQL の一般的な問題とアプリケーション スキルの概要
クラスを見るとき、どのような情報を得たいですか?このクラスはどこで使用され、その機能は何ですか?この...
非直交マージンマージンを使用するとマージが発生します次のプロパティはマージンの結合を防止します。国境...
外部一時テーブルCREATE TEMPORARY TABLE によって作成された一時テーブルは、外部...
序文: Vue では、props を使用して、もともと分離されていたコンポーネントを直列に接続するこ...
# Windows および Linux 上の Redis のインストール デーモン構成Redis の...
序文: MySQL を使用すると、時間の表示が正しくない、タイムゾーンが GMT+8 ゾーンにない、...
この記事では、カルーセルマップの効果を実現するためのBootstrapの具体的なコードを参考までに共...
EXPLAIN ステートメントは、MySQL クエリ ステートメント プロセスと EXPLAIN ス...
MySQL データベース テーブルでは、インデックスを作成、表示、再構築、削除できるため、クエリ速度...
目次1. Vue2 構文2. Vue3の使用1. コンポーネントのref値を設定する2. コンポーネ...
目次1. 補助機能2. 例1. mapState と mapGetters 2. mapMutati...
注 1: 上の画像の背景全体がこの Web ページのフルサイズであり、中央の小さなボックスがブラウザ...
以下に、トレーニング機関からのヒントと私自身の要約をいくつか示します。以下のインデックスの内容を説明...
1.backup.shスクリプトファイルを作成する #!/bin/sh ソースフォルダ=/データ ...
この記事では、MySQL 8.0.13のインストールと設定のチュートリアルを参考までに紹介します。具...