ホームページ ウェブフロントエンド jsチュートリアル JavaScript オブジェクト指向のカプセル化と継承_JavaScript スキル

JavaScript オブジェクト指向のカプセル化と継承_JavaScript スキル

May 16, 2016 pm 04:30 PM
javascript カプセル化 継承する オブジェクト指向

jsオブジェクト指向におけるカプセル化と継承について整理してみましょう。

1. カプセル化
js でカプセル化を実装するにはさまざまな方法があります。一般的に使用される方法をいくつか紹介します。

1.1 オリジナルモード生成オブジェクト
メンバーをオブジェクトに直接書き込み、関数で返します。 欠点: パターンのインスタンスを確認するのが困難です。

コード:

コードをコピーします コードは次のとおりです:

関数 Stu(名前, スコア) {
return {
名前: 名前、
スコア: スコア
}
}
var stu1 = Stu("张三", 80);
var stu2 = Stu("李思", 90);
console.log(stu1.name); // チャン・サン

1.2 構築パターンオブジェクトの生成

js は、コンストラクターを使用してオブジェクトを生成するパターンを提供します。いわゆる「コンストラクター」は実際には通常の関数ですが、this 変数は内部で使用されます。 new キーワードを使用してコンストラクターのインスタンスを生成すると、この変数はインスタンス オブジェクトにバインドされます。

コードを直接入力します:

コードをコピーします コードは次のとおりです:

関数 Stu(名前, スコア) {
This.name = 名前,
This.score = スコア
}
var stu1 = new Stu("张三", 80);
var stu2 = new Stu("李思", 90);
console.log(stu1.name "/" stu2.score) // 張三 90
console.log((stu1.constructor == Stu) "/" (stu2.constructor == Stu)); // true true
console.log((stu1 インスタンスオブ Stu) "/" (stu2 インスタンスオブ Stu)); // true true

js コンストラクターによって生成されたオブジェクトが、C# のクラスによって生成されたオブジェクトとまったく同じであることを確認するのは難しくありません。どちらもテンプレートを使用してオブジェクト メンバーを定義し、new キーワードを通じてインスタンス化します。

C# コードを使用して同じ Stu オブジェクトを生成します

コードをコピーします コードは次のとおりです:

クラスストゥ
{
パブリック文字列名;
公開ダブルスコア;  ̄ ̄ ̄ ̄ ̄
}

OK、これで基本的なオブジェクトができました。 したがって、すべてのオブジェクトに共通で、このメソッドの作成を 1 回だけ許可するメソッドが必要になります。 (object newで繰り返し作成されない)どうすればいいでしょうか? C# では静的メンバーを使用できることは誰もが知っています。では、jsでそれを行うにはどうすればよいでしょうか?

1.3 プロトタイプモード

js では、各コンストラクターにはプロトタイプ属性があり、このオブジェクトのすべてのプロパティとメソッドはコンストラクターのインスタンスによって継承されます。この場合、メンバーをプロトタイプに直接追加することは、C# で静的メンバーを宣言することと同じになります。

コード:

コードをコピー コードは次のとおりです:

関数 Stu(名前, スコア) {
This.name = 名前,
This.score = スコア
}
Stu.prototype.type='学生';
Stu.prototype.log = 関数 (s) {
console.log(s);
}
var stu1 = new Stu("张三", 80);
var stu2 = new Stu("李思", 90);
console.log(stu1.type "/" stu2.type); // 学生 学生
; stu1.log('hello') // こんにちは
; console.log(stu1.log == stu2.log); // true

カプセル化についてはこれで終わりです。js で継承がどのように実装されるかを見てみましょう。

2. 継承

2.1 コンストラクターのバインディング

子関数の call または apply メソッドを直接呼び出して、親オブジェクトのコンストラクターを子オブジェクトにバインドします。

コードをコピー コードは次のとおりです:

関数 Stu(名前, スコア) {
Grade.apply(this, 引数);
//Grade.call(this, argument);
This.name = 名前,
This.score = スコア
}
関数 Grade() {
This.code = "中学校";
This.ask = function () {
console.log("皆さんこんにちは");
}
}
var stu1 = new Stu("张三", 80);
var stu2 = new Stu("李思", 90);
console.log(stu1.code); // 中学校
stu1.ask(); // 皆さんこんにちは

ここでの apply は 2 つのことを行い、最初のパラメーター this を Grade コンストラクター (呼び出し元) に渡し、その後 Grade でコードを実行します。 Gradeでこれで定義したメンバーをStuで再度実行するのと同じです。

2.2 プロトタイプによる継承
まずはコードを見てください

コード:

コードをコピーします コードは次のとおりです:

関数 Stu(名前, スコア) {
This.name = 名前,
This.score = スコア
}
関数 Grade() {
This.code = "中学校";
}
Stu.prototype = new Grade();
Stu.prototype.constructor = Stu; //継承連鎖の乱れを防ぎ、ステートメントを手動でリセットします
var stu1 = new Stu("张三", 80);
var stu2 = new Stu("李思", 90);
console.log(Stu.prototype.constructor); // 独自のコンストラクター
console.log(stu1.code); // 中学校

前に述べたように、プロトタイプは C# の静的メンバーに相当するため、親クラスのすべてのメンバーを独自の静的メンバーに変換して継承を実現します。

プロトタイプによる継承には欠点があります。継承されたメンバーはすべて静的であるため、オブジェクトのメンバーを継承するにはどうすればよいでしょうか?

2.3 継承のコピー

親オブジェクトのすべてのプロパティとメソッドを子オブジェクトにコピーして、継承を実現します。

コード:

コードをコピーします コードは次のとおりです:

関数 Stu(名前, スコア) {
This.name = 名前,
This.score = スコア
}
関数 Grade() {}
Grade.prototype.code = "中学校";
}
//関数のカプセル化
関数 extend(C, P) {
var p = P.prototype;
var c = C.prototype;
for (var i in p) {
c[i] = p[i];
}
}
extend(Stu, Grade);
var stu1 = new Stu("张三", 80);
var stu2 = new Stu("李思", 90);
stu1.code='高校';
console.log(stu1.code); // 高校
console.log(stu2.code); // 中学校
console.log(Stu.prototype.constructor);
console.log(Grade.prototype.constructor)

これで、JS オブジェクト指向の組織は静的ではなくなり、使用時に必要に応じて変更できます。良いことわざがあります。正しいものが最善です。

ここではカプセル化と継承のみを分析します。今後、JavaScript オブジェクト指向プログラミングをより深く理解していただくために、他の記事もいくつか取り上げる予定です。もちろん、これらはすべて個人的な理解です。漏れがある場合は、ご連絡ください。

このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

ホットAIツール

Undresser.AI Undress

Undresser.AI Undress

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

AI Clothes Remover

AI Clothes Remover

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

Undress AI Tool

Undress AI Tool

脱衣画像を無料で

Clothoff.io

Clothoff.io

AI衣類リムーバー

Video Face Swap

Video Face Swap

完全無料の AI 顔交換ツールを使用して、あらゆるビデオの顔を簡単に交換できます。

ホットツール

メモ帳++7.3.1

メモ帳++7.3.1

使いやすく無料のコードエディター

SublimeText3 中国語版

SublimeText3 中国語版

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

ゼンドスタジオ 13.0.1

ゼンドスタジオ 13.0.1

強力な PHP 統合開発環境

ドリームウィーバー CS6

ドリームウィーバー CS6

ビジュアル Web 開発ツール

SublimeText3 Mac版

SublimeText3 Mac版

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

C++関数継承の詳しい解説:継承で「基底クラスポインタ」と「派生クラスポインタ」を使うには? C++関数継承の詳しい解説:継承で「基底クラスポインタ」と「派生クラスポインタ」を使うには? May 01, 2024 pm 10:27 PM

関数の継承では、「基底クラス ポインター」と「派生クラス ポインター」を使用して継承メカニズムを理解します。基底クラス ポインターが派生クラス オブジェクトを指す場合、上方変換が実行され、基底クラスのメンバーのみにアクセスされます。派生クラス ポインターが基本クラス オブジェクトを指す場合、下向きキャストが実行される (安全ではない) ため、注意して使用する必要があります。

TrendForce: Nvidia の Blackwell プラットフォーム製品により、TSMC の CoWoS 生産能力は今年 150% 増加します TrendForce: Nvidia の Blackwell プラットフォーム製品により、TSMC の CoWoS 生産能力は今年 150% 増加します Apr 17, 2024 pm 08:00 PM

4月17日の当サイトのニュースによると、TrendForceは最近、Nvidiaの新しいBlackwellプラットフォーム製品に対する需要は強気で、2024年にはTSMCのCoWoSパッケージング総生産能力が150%以上増加すると予想されるレポートを発表した。 NVIDIA Blackwell の新しいプラットフォーム製品には、B シリーズ GPU と、NVIDIA 独自の GraceArm CPU を統合する GB200 アクセラレータ カードが含まれます。 TrendForce は、サプライチェーンが現在 GB200 について非常に楽観的であることを確認しており、2025 年の出荷台数は 100 万台を超え、Nvidia のハイエンド GPU の 40 ~ 50% を占めると予想されています。 Nvidiaは今年下半期にGB200やB100などの製品を提供する予定だが、上流のウェーハパッケージングではさらに複雑な製品を採用する必要がある。

AMD「Strix Halo」FP11のパッケージサイズを公開:Intel LGA1700と同等、Phoenixより60%大きい AMD「Strix Halo」FP11のパッケージサイズを公開:Intel LGA1700と同等、Phoenixより60%大きい Jul 18, 2024 am 02:04 AM

このWebサイトは7月9日、AMD Zen5アーキテクチャの「Strix」シリーズプロセッサには2つのパッケージングソリューションがあり、小型のStrixPointはFP8パッケージを使用し、StrixHaloはFP11パッケージを使用すると報じた。出典: videocardz 出典 @Olrak29_ 最新の事実は、StrixHalo の FP11 パッケージ サイズが 37.5mm*45mm (1687 平方ミリメートル) であり、これは Intel の AlderLake および RaptorLake CPU の LGA-1700 パッケージ サイズと同じであるということです。 AMD の最新の Phoenix APU は、サイズ 25*40mm の FP8 パッケージング ソリューションを使用しています。これは、StrixHalo の F

C++ 関数の継承の詳細な説明: 継承のエラーをデバッグするには? C++ 関数の継承の詳細な説明: 継承のエラーをデバッグするには? May 02, 2024 am 09:54 AM

継承エラーのデバッグのヒント: 正しい継承関係を確認します。デバッガーを使用してコードをステップ実行し、変数値を調べます。仮想修飾子を正しく使用してください。隠れた相続によって引き起こされる相続ダイアモンド問題を調べてください。抽象クラスに実装されていない純粋仮想関数がないか確認します。

C++ 関数の継承の詳細な説明: 継承における 'is-a' と 'has-a' の関係を理解するには? C++ 関数の継承の詳細な説明: 継承における 'is-a' と 'has-a' の関係を理解するには? May 02, 2024 am 08:18 AM

C++の関数継承を詳しく解説:「is-a」と「has-a」の関係をマスターしよう 関数継承とは?関数の継承は、派生クラスで定義されたメソッドを基本クラスで定義されたメソッドに関連付ける C++ の手法です。これにより、派生クラスが基本クラスのメソッドにアクセスしてオーバーライドできるようになり、基本クラスの機能が拡張されます。 「is-a」および「has-a」関係 関数継承では、「is-a」関係は、派生クラスが基本クラスのサブタイプであること、つまり、派生クラスが基本クラスの特性と動作を「継承」することを意味します。基本クラス。 「has-a」関係は、派生クラスに基本クラス オブジェクトへの参照またはポインターが含まれていること、つまり、派生クラスが基本クラス オブジェクトを「所有」していることを意味します。構文関数継承を実装する方法の構文は次のとおりです: classDerivedClass:pu

Go でオブジェクト指向プログラミングを探索する Go でオブジェクト指向プログラミングを探索する Apr 04, 2024 am 10:39 AM

Go 言語は、型定義とメソッドの関連付けを通じてオブジェクト指向プログラミングをサポートします。従来の継承はサポートされていませんが、合成を通じて実装されます。インターフェイスは型間の一貫性を提供し、抽象メソッドを定義できるようにします。実際の事例では、顧客操作の作成、取得、更新、削除など、OOP を使用して顧客情報を管理する方法を示します。

継承とポリモーフィズムは C++ のクラス結合にどのような影響を与えますか? 継承とポリモーフィズムは C++ のクラス結合にどのような影響を与えますか? Jun 05, 2024 pm 02:33 PM

継承とポリモーフィズムはクラスの結合に影響します。派生クラスは基本クラスに依存するため、継承により結合が増加します。ポリモーフィズムにより、オブジェクトは仮想関数と基本クラス ポインターを通じて一貫した方法でメッセージに応答できるため、結合が軽減されます。ベスト プラクティスには、継承を控えめに使用すること、パブリック インターフェイスを定義すること、基本クラスへのデータ メンバーの追加を回避すること、依存関係の注入を通じてクラスを分離することが含まれます。ポリモーフィズムと依存性注入を使用して銀行口座アプリケーションの結合を軽減する方法を示す実践的な例。

C++ 関数はコードをカプセル化することで GUI 開発の効率をどのように向上させますか? C++ 関数はコードをカプセル化することで GUI 開発の効率をどのように向上させますか? Apr 25, 2024 pm 12:27 PM

コードをカプセル化することにより、C++ 関数は GUI 開発効率を向上させることができます。 コードのカプセル化: 関数はコードを独立した単位にグループ化し、コードの理解と保守を容易にします。再利用性: 関数はアプリケーション間で再利用できる共通の機能を作成し、重複やエラーを削減します。簡潔なコード: カプセル化されたコードにより、メイン ロジックが簡潔になり、読みやすく、デバッグしやすくなります。

See all articles