ホームページ  >  記事  >  ウェブフロントエンド  >  JavaScript クラスと継承プロトタイプ property_js オブジェクト指向

JavaScript クラスと継承プロトタイプ property_js オブジェクト指向

WBOY
WBOYオリジナル
2016-05-16 18:20:15972ブラウズ

第 1 章で、クラスと継承の実装をシミュレートするために、prototype 属性をすでに使用しました。プロトタイプ プロパティは本質的に JavaScript オブジェクトです。 そして、すべての関数にはデフォルトのプロトタイプ属性があります。
この関数がカスタム オブジェクトを作成するシナリオで使用される場合、この関数をコンストラクターと呼びます。 たとえば、以下の簡単なシナリオ:

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

/ /Constructor
function person(name) {
this.name = name;
}
// Person のプロトタイプを定義します。プロトタイプ内の属性は、カスタム オブジェクト
person によって参照できます。 .prototype = {
getName: function() {
return this.name;
}
}
var zhang = new Person("ZhangSan"); zhang.getName() ); // "ZhangSan"

例として、JavaScript のデータ型 (文字列、数値、配列、オブジェクト、日付) を考えてみましょう。 これらの型は、次のような JavaScript 内のコンストラクターとして実装されていると考える理由があります。

コードをコピー コードは次のとおりです。
// JavaScript の定義済みタイプとして配列のコンストラクターを定義します。
function Array() {
// ...
}
// インスタンス配列の初期化
var arr1 = new Array(1, 56, 34, 12);
// ただし、次の構文定義をお勧めします:
var arr2 = [1, 56, 34 , 12] ;

同時に配列を操作する多くのメソッド (concat、join、push など) も、prototype 属性で定義する必要があります。
実際、JavaScript のすべての組み込みデータ型には読み取り専用のプロトタイプ属性があります (これは理解できます。これらの型のプロトタイプ属性が変更されると、事前定義されたメソッドが消滅するためです)。しかし、それに独自の拡張メソッドを追加することができます。 。

コードをコピー コードは次のとおりです:
// JavaScript 固有の型に拡張します。最小値を取得する配列
Array.prototype.min = function() {
var min = this[0];
for (var i = 1; i if (this[i]
) {
min = this[i]>}
}
return
}; Array の任意のインスタンスで min メソッドを呼び出します。
console.log([1, 56, 34, 12].min()); // 1


注: ここには罠があります。 、それを Array のプロトタイプに追加します 拡張メソッドの後に、for-in を使用して配列をループすると、この拡張メソッドもループアウトされます。
次のコードはこれを示しています (min メソッドが Array プロトタイプに拡張されていると仮定しています):


コードをコピー コード次のように:
var arr = [1, 56, 34, 12];
var total = 0;
for (var i in arr) {
total = parseInt ( arr[i], 10);
}
console.log(total); // NaN


解決策も非常に簡単です:


コードをコピーします コードは次のとおりです。
var arr = [1, 56, 34, 12]; total = 0;
for (var i in arr) {
if (arr.hasOwnProperty(i)) {
total = parseInt(arr[i], 10); }
コンソール .log(合計) // 103

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