それでは、段階的に構築していきましょう。まず、元の書き方を見てみましょう。 コードをコピーします コード <br>var = function(name, age) { <br>this.name = name; <br>this.age = age; >} <br>person.prototype.SayHello = function () { <br>alert(this.name "," this.age) <br>}; <br>var プログラマー = function (名前、年齢、給与); { <br> person.call(this, 名前, 年齢); <br>this.salary = 給与; <br>Programmer.prototype = new Person(); "kym", 21, 500); <br>pro.SayHello(); <br><br> <br>実際、継承のルートはこのステップにあることがわかります。 .prototype= newperson()。つまり、プロトタイプ チェーンに person を追加します。この点については、JavaScript学習ノート7 - プロトタイプチェーンの原理で詳しく説明されています。 <br>つまり、実装の鍵はプロトタイプチェーンの作成にあります。 <br>上記では、JSON を使用してプロトタイプを作成しました。そのプロトタイプ チェーンは p.__proto__=person です。次に、これに対する継承をカプセル化したいと考えます。その場合、プロトタイプ チェーンは p.__proto__.__proto__=SuperClass、つまり Person.__proto__=SuperClass になるはずです。ただし、上記のコードの継承メソッドによれば、プロトタイプ チェーンの関係は Person.__proto__=SuperClass.prototype になります。 </div>これは上で行ったことと同じです。私たちの方法は、補助関数を使用して元の関数の属性をカプセル化に割り当てることです。 <br>それでは、このアイデアに従って、プロトタイプ チェーンの継承関係を使用してカプセル化を実装しましょう。 <br><br><br><br><br>コードをコピーします<div class="codetitle"> <span><a style="CURSOR: pointer" data="57425" class="copybut" id="copybut57425" onclick="doCopy('code57425')"> コードは次のとおりです。<u></u> </a><script> </span>var Factory = { </div>作成: function (className, params) { <div class="codebody" id="code57425">var temp = function () { <br>className.Create.apply(this, params); <br>temp.prototype =クラス名; <br>var result = new temp(); <br>return result; <br>CreateBaseClass: function (baseClass, subClass) { <br>var temp = function () { <br> (subClass の var メンバー) { <br>this[member] = subClass[member]} <br>}; <br>temp.prototype = <br>return new temp(); } <br>}; <br>var People = { <br>作成: 関数 (名前, 年齢) { <br>this.name = 名前 <br>}, <br>SayHello: function () { <br>alert("こんにちは、私の名前は「this.name」です。私は「this.age」です); <br>var Temp = { <br>作成: function (名前, 年齢, 給与) { <br>People.Create.call(this, name, age); <br>this.salary = 給与; <br>導入: function () { <br>alert(this.name "$" this.age "$" this.salary); <br>} <br>}; var pro = Factory.Create(Programmer, ["kym", 21, 500]); <br><br> <br> これで継承が完了します。関係のカプセル化。もちろん、別の変数を記述する必要はありません: <br><br><br><br><br> コードをコピーします <br><br><br> コードは次のとおりです: <br> <br> <br>var Programmer = Factory.CreateBaseClass(People, <br>{ <br>Create: function (名前, 年齢, 給与) { <br>People.Create.call(this, 名前, 年齢); </div>this.salary = 給与 ; <br>}, <br>紹介: function () { <div class="codetitle">alert(this.name "$" this.age "$" this.salary); >}); <span> <a style="CURSOR: pointer" data="35399" class="copybut" id="copybut35399" onclick="doCopy('code35399')"> <u>もちろん、これはすべて個人の好みによって異なりますが、個人的には最初の方法の方がより明確だと思いますが、2 番目の方法の方が洗練されています。</u></a></span> </div>
![[Web フロントエンド] Node.js クイック スタート](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
