JavaScript の継承パターンの簡単な説明_JavaScript スキル
本当の意味では、JavaScript はオブジェクト指向言語ではなく、従来の継承メソッドを提供しません。ただし、JavaScript 自体が提供するプロトタイプのプロパティを使用して継承を実現します。 Javascript のプロトタイプ継承は腐っていると言われていますが、私はこの問題を完全には理解していませんでした。今日は「Javascript Patterns」のプロトタイプ継承のいくつかのメソッドをもう一度読んでみました。 JS での単純な継承方法。異なる意見がある場合は、ご提案をお願いします。
最も基本的なプロトタイプ チェーンの継承についてはここでは繰り返しませんが、主に他の継承モードについて説明します。
1. コンストラクターの継承を借用します
function Father (name) { this.name=name; } function Son (name) { Father.call(this,name); //在子类型中调用超类型的构造函数 this.age=15; } var me=new Son("Su");
利点: 画像内の name 属性など、サブタイプのパラメーターを渡すことができます。
欠点: 1. メソッドはコンストラクター内で定義されているため、再利用できません。 2. スーパータイプのプロトタイプで定義されたメソッドは、サブタイプには表示されません。
2. 結合された継承 (包括的なプロトタイプチェーンとコンストラクター)
//超类型构造函数function Father (name) { this.name=name; this.famMember=[]; }//超类型构造函数原型方法 Father.prototype.sayName=function () { alert(this.name); }//子类型构造函数 function Son (name,age) { Father.call(this,name); //构造函数方法 this.age=age; } Son.prototype=new Father(); //重写子类型原型对象 Son.prototype.constructor=Son; //重写构造函数属性指向子类型 Son.prototype.sayAge=function () { alert(this.age); } //重写原型对象后再加入方法 var me=new Son("Su",15); me.famMember.push("dad","mom"); //子类型可以调用超类型构造函数内的方法var he=new Son("Li",14);alert(he.famMember); // []
利点: 異なるサブクラスは独自のプロパティを持つことも、同じメソッドを使用することもできます。
欠点: このメソッドではスーパータイプ コンストラクターを 2 回呼び出す必要があり、同じ名前の属性メソッドは 1 回オーバーライドされます。
3. プロトタイプの継承 (Object.create() と同様)
function object (o) { function F () {} F.prototype=o; return new F(); }var obj={}; //将obj对象传入作为新对象的原型。var me=object(obj);
この継承方法を使用するには、プロトタイプ オブジェクトとしてオブジェクトが必要であるため、それを継承するすべてのサブタイプの属性メソッドは共通です。
ES5 は、新しい Object.creatr() メソッドを通じてプロトタイプの継承を標準化します。
4. 寄生継承 (プライベートメソッドを設定できるプロトタイプの継承)
function object (o) { function F () {} F.prototype=o; return new F(); } var obj={}; //将obj对象传入作为新对象的原型。到这里都与原型式继承相同function creObj(o) { var clone=object(obj); clone.sayHi=function () { alert("Hi"); };return clone; } var me=creObj(obj);
利点: このメソッドは、パブリック プロパティ メソッドのみを使用してプロトタイプ継承の欠点を補い、サブタイプがプライベート プロパティ メソッドを持つことができるようにします。
5. 寄生結合継承
function inherit (father,son) { var pro=Object(father.prototype); //创建超类型原型对象的副本 pro.constructor=son; son.prototype=pro; //将副本作为子类型的原型对象 }
このメソッドは、結合継承における属性メソッドの適用範囲の問題を補うために使用されます。
上記のコードを使用して、結合継承内のコード Son.prototype=new Father(); を置き換えます。このように、親型のコンストラクターは 1 回呼び出すだけで済み、冗長で不要な属性メソッドの作成を回避し、プロトタイプ チェーンを変更しないで済む理想的な参照型の継承方法です。
js 継承モードについて大まかに説明します。詳細については、引き続き Script House の Web サイトをご覧ください。

ホットAIツール

Undresser.AI Undress
リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover
写真から衣服を削除するオンライン AI ツール。

Undress AI Tool
脱衣画像を無料で

Clothoff.io
AI衣類リムーバー

AI Hentai Generator
AIヘンタイを無料で生成します。

人気の記事

ホットツール

メモ帳++7.3.1
使いやすく無料のコードエディター

SublimeText3 中国語版
中国語版、とても使いやすい

ゼンドスタジオ 13.0.1
強力な PHP 統合開発環境

ドリームウィーバー CS6
ビジュアル Web 開発ツール

SublimeText3 Mac版
神レベルのコード編集ソフト(SublimeText3)

ホットトピック











JavaScript文字列置換法とFAQの詳細な説明 この記事では、javaScriptの文字列文字を置き換える2つの方法について説明します:内部JavaScriptコードとWebページの内部HTML。 JavaScriptコード内の文字列を交換します 最も直接的な方法は、置換()メソッドを使用することです。 str = str.replace( "find"、 "置換"); この方法は、最初の一致のみを置き換えます。すべての一致を置き換えるには、正規表現を使用して、グローバルフラグGを追加します。 str = str.replace(/fi

楽なWebページレイアウトのためにjQueryを活用する:8本質的なプラグイン jQueryは、Webページのレイアウトを大幅に簡素化します。 この記事では、プロセスを合理化する8つの強力なjQueryプラグイン、特に手動のウェブサイトの作成に役立ちます

それで、あなたはここで、Ajaxと呼ばれるこのことについてすべてを学ぶ準備ができています。しかし、それは正確には何ですか? Ajaxという用語は、動的でインタラクティブなWebコンテンツを作成するために使用されるテクノロジーのゆるいグループ化を指します。 Ajaxという用語は、もともとJesse Jによって造られました

10の楽しいjQueryゲームプラグインして、あなたのウェブサイトをより魅力的にし、ユーザーの粘着性を高めます! Flashは依然としてカジュアルなWebゲームを開発するのに最適なソフトウェアですが、jQueryは驚くべき効果を生み出すこともできます。また、純粋なアクションフラッシュゲームに匹敵するものではありませんが、場合によってはブラウザで予期せぬ楽しみもできます。 jquery tic toeゲーム ゲームプログラミングの「Hello World」には、JQueryバージョンがあります。 ソースコード jQueryクレイジーワードコンポジションゲーム これは空白のゲームであり、単語の文脈を知らないために奇妙な結果を生み出すことができます。 ソースコード jquery鉱山の掃引ゲーム

記事では、JavaScriptライブラリの作成、公開、および維持について説明し、計画、開発、テスト、ドキュメント、およびプロモーション戦略に焦点を当てています。

このチュートリアルでは、Ajaxを介してロードされた動的なページボックスの作成を示しており、フルページのリロードなしでインスタントリフレッシュを可能にします。 JQueryとJavaScriptを活用します。カスタムのFacebookスタイルのコンテンツボックスローダーと考えてください。 重要な概念: ajaxとjquery

このチュートリアルでは、jQueryを使用して魅惑的な視差の背景効果を作成する方法を示しています。 見事な視覚的な深さを作成するレイヤー画像を備えたヘッダーバナーを構築します。 更新されたプラグインは、jQuery 1.6.4以降で動作します。 ダウンロードしてください

このJavaScriptライブラリは、Cookieに依存せずにセッションデータを管理するためにWindow.nameプロパティを活用します。 ブラウザ全体でセッション変数を保存および取得するための堅牢なソリューションを提供します。 ライブラリは、セッションの3つのコア方法を提供します
