ホームページ  >  記事  >  ウェブフロントエンド  >  JavaScriptでオブジェクトを作成する方法_javascriptスキル

JavaScriptでオブジェクトを作成する方法_javascriptスキル

WBOY
WBOYオリジナル
2016-05-16 17:24:13931ブラウズ

オブジェクトとは何ですか?
JavaScript の定義によれば、オブジェクトは順序付けされていないプロパティのコレクションであり、そのプロパティには基本的な値、オブジェクト、または関数を含めることができます。つまり、オブジェクトは、特定の順序ではない属性のセットであり、値はデータまたはオブジェクトのセットである値にマップされます。

最も単純なオブジェクト
JavaScript の中括弧 {} のペアでオブジェクトを定義できます。この記述方法は、実際には Object

のコンストラクターを呼び出すのと同じです。

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

var obj={};
var obj2= 新しいオブジェクト();

この方法で構築されたオブジェクトには、オブジェクトのプロトタイプへのポインターのみが含まれています。valueOf、hasQwnProperty、およびその他のメソッドを使用できますが、カスタム オブジェクトには常にいくつかのカスタム プロパティとメソッドが含まれています。

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

var obj={};
=0; a:0,
fn:function( ){
アラート(this);

オブジェクトを定義した後に「.」を使用してプロパティとメソッドを追加することも、オブジェクトの定義時にリテラル割り当てメソッドを使用してプロパティとメソッドを追加することもできます。 Attributes と同じメソッドは、クラスの静的変数や静的関数と同様に、オブジェクト参照を直接使用できます。この方法でオブジェクトを作成する場合には明らかな欠陥があります。多数のオブジェクトを定義するのは非常に手間がかかり、次のことを行う必要があります。ほぼ繰り返しのコードを何度も繰り返して書きます。


抽象化

コードは繰り返されるため、関数を使用してこれらの繰り返しタスクを実行し、オブジェクトの作成時に特別に作成されたメソッドを呼び出すことができます。異なる属性値の場合のみです。さまざまなパラメータを渡すだけです。


コードをコピー

コードは次のとおりです。

function createObj(a,fn){

obj={};

obj.a=a; obj.fn=fn; return obj; } var obj=createObj(2,function( ){ アラート(this.a);

このように、多数のオブジェクトを作成する場合、このメソッドを呼び出すことで繰り返し作業を行うことができます。多くの場合、作成されたオブジェクトのタイプを決定する必要があるためです。上記のコードでは、元の Object オブジェクト インスタンスは一部のプロパティとメソッドのみを拡張しています。

スタイル

JavaScript では関数がオブジェクトになります。これは、オブジェクトを作成するときに、関数を直接オブジェクトとして使用するための特殊な性質にあります。物体としての機能。

1. 関数はパラメータを受け入れ、パラメータに基づいて同じ型および異なる値のオブジェクトを作成できます

2. 関数がコンストラクターとして使用される場合 (new 演算子を通じて呼び出されます)、コンストラクターの基本的な知識は、貧困層および下位中流階級の農民バージョンの jQuery で説明されています。

コンストラクターの戻り値は 2 つの状況に分けられます。関数が return ステートメントを持たない場合、または基本型 (bool、int、string、unknown、null) を返す場合、new によって作成された匿名オブジェクトを返します。これは関数インスタンスです。関数本体が参照型オブジェクト (配列、関数、オブジェクトなど) を返す場合、そのオブジェクトは戻り値として new によって作成された匿名オブジェクトを上書きします。

3. では、関数を使用して型識別の問題を解決するにはどうすればよいでしょうか? 各関数インスタンス オブジェクトにはコンストラクター属性があります (「ある」ではなく、対応することができます)。 instanceof 演算子を使用して、オブジェクトが XXX のインスタンスであるかどうかを判断します。

練習せずに話すだけではなく、

をコーディングしてください

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

function Person(name){
this.name =name;
this.fn=function(){
alert(this.name);
}
}

var person1=new Person('バイロン' );

console.log(person1.constructor==person);//true
console.log(person1 インスタンスオブ パーソン) //true

これは完璧ですね、いいえ!コンストラクターはオブジェクト固有にすることができますが、メソッドはオブジェクトのすべてのインスタンスで繰り返す必要があります。

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

function Person(name){
this.name =name;
this.fn=function(){
alert(this.name);
}
}

var person1=new Person('バイロン' );
var person2=new Person('Frank');

console.log(person1.fn==person2.fn);//false

2 つのインスタンスの fn はまったく同じですが、同じものではありません。関数オブジェクトに 1,000 個のメソッドがある場合、そのインスタンスのそれぞれにこれらのメソッドのコピーが含まれている必要があり、これは非常に面倒です。思い出は言葉にならない。

これ以上ナンセンスはありません

繰り返しの作業を必要とせず、スタイリッシュで、オブジェクトの一般的なメソッドの繰り返しを必要としない、オブジェクトを構築するほぼ完璧な方法はあるでしょうか? ?実際、関数の使用はすでに要件に近いことがわかります。唯一の違いは、関数オブジェクトのすべてのインスタンスで共有されるコンテナーが必要であるということです。このコンテナーでは、インスタンスが属性とメソッドを共有する必要があります。このコンテナの準備ができたこと - プロトタイプ。プロトタイプを知らない学生は、JavaScript プロトタイプ

を見てみましょう。

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

function person(name){
this.name=name;
}

person.prototype.share=[];

人物のプロトタイプ。 printName=function(){
;

console.log(person1.printName==person2.printName);//true



このようにして、各 Person インスタンスは独自の属性名を持ち、すべてのインスタンスで共有される属性共有とメソッド printName を持ちます。一般的なオブジェクト処理に関する基本的な問題は、いつでもこのスタイリッシュで魅力的な方法を作成できます。 . オブジェクトモード。
声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。