JavaScriptのオブジェクトのコンストラクタ
- 前のページ JS オブジェクトアクセサー
- 次のページ JS オブジェクトプロトタイプ
インスタンス
function Person(first, last, age, eye) { this.firstName = first; this.lastName = last; this.age = age; this.eyeColor = eye; }
コンストラクタ関数に大文字で始まる名前をつけるのは良い習慣です。
オブジェクトの種類(設計図)(クラス)
前の章の例は制限があります。それらは単一のオブジェクトのみを作成します。
時には、同じ「種類」の多くのオブジェクトの「設計図」を使います。
「オブジェクトの種類」を作成する方法は、オブジェクトのコンストラクタ関数。
上の例では、function Person(first, last, age, eye) { それはオブジェクトのコンストラクタ関数です。
通じて、 new キーワードを呼び出すことで、同じタイプのオブジェクトを作成できます:
var myFather = new Person("Bill", "Gates", 62, "blue"); var myMother = new Person("Steve", "Jobs", 56, "green");
this キーワードと呼ばれます。
JavaScriptでは、 this
のものは、コードの「所有者」です。
this
の値は、オブジェクトを使用する場合、そのオブジェクト自身です。
コンストラクタ関数で、this
値を持っていない。それは新しいオブジェクトの代わりです。新しいオブジェクトが作成されると、thisの値はそのオブジェクトになります。
ご注意ください this
それは変数ではありません。それはキーワードです。this の値を変更することはできません。
オブジェクトに属性を追加する
既存のオブジェクトに新しい属性を追加するのは簡単です:
インスタンス
myFather.nationality = "English";
新しい属性は myFather に追加されました。myMother でもありませんし、他の person オブジェクトでもありません。
オブジェクトにメソッドを追加する
既存のオブジェクトに新しいメソッドを追加するのは簡単です:
インスタンス
myFather.name = function () { return this.firstName + " " + this.lastName; };
新しいメソッドは myFather に追加されました。myMother でもありませんし、他の person オブジェクトでもありません。
構造器に属性を追加する
既存のオブジェクトに新しい属性を追加するのとは異なり、オブジェクトの構造器に新しい属性を追加することはできません:
インスタンス
Person.nationality = "English";
構造器に新しい属性を追加するには、構造器関数に追加する必要があります:
インスタンス
function Person(first, last, age, eyecolor) { this.firstName = first; this.lastName = last; this.age = age; this.eyeColor = eyecolor; this.nationality = "English"; }
このようにしてオブジェクトの属性にはデフォルト値を持つことができます。
構造器にメソッドを追加する
あなたの構造器関数もメソッドを定義できます:
インスタンス
function Person(first, last, age, eyecolor) { this.firstName = first; this.lastName = last; this.age = age; this.eyeColor = eyecolor; this.name = function() {return this.firstName + " " + this.lastName;}; }
既存のオブジェクトに新しいメソッドを追加するのとは異なり、オブジェクトの構造器に新しいメソッドを追加することはできません。
構造器関数内にオブジェクトにメソッドを追加する必要があります:
インスタンス
function Person(firstName, lastName, age, eyeColor) { this.firstName = firstName; this.lastName = lastName; this.age = age; this.eyeColor = eyeColor; this.changeName = function (name) { this.lastName = name; }; }
changeName() 関数は name を person の lastName 属性に割り当てます。
今度は試してみてください:
myMother.changeName("Jobs");
を使用して myMother
代わりに this、JavaScriptは現在処理しているpersonがどれかを知ることができます。
内蔵JavaScript構造子
JavaScriptは原始オブジェクトの構造子を提供します:
インスタンス
var x1 = new Object(); // 新しいObjectオブジェクト var x2 = new String(); // 新しいStringオブジェクト var x3 = new Number(); // 新しいNumberオブジェクト var x4 = new Boolean(); // 新しいBooleanオブジェクト var x5 = new Array(); // 新しいArrayオブジェクト var x6 = new RegExp(); // 新しいRegExpオブジェクト var x7 = new Function(); // 新しいFunctionオブジェクト var x8 = new Date(); // 新しいDateオブジェクト
Math()
オブジェクトはこのリストに含まれません。Mathはグローバルオブジェクトです。new
キーワードはMathで使用できません。
ご存知ですか?
以上のように、JavaScriptは原始データタイプの文字列、数字、ブールのオブジェクトバージョンを提供します。しかし、複雑なオブジェクトを作成する理由はありません。原始値はもっと速いです!
オブジェクトリテラルを使用してください {}
代わりに new Object()
。
文字列リテラルを使用してください ""
代わりに new String()
。
数値リテラルを使用してください Number()
。
ブールリテラルを使用してください new Boolean()
。
配列リテラルを使用してください []
代わりに new Array()
。
パターンリテラルを使用してください new RexExp()
。
関数表現を使用してください () {}
代わりに new Function()
。
インスタンス
var x1 = {}; // 新对象 var x2 = ""; // 新的原始字符串 var x3 = 0; // 新的原始数值 var x4 = false; // 新的原始逻辑值 var x5 = []; // 新しい配列オブジェクト var x6 = /()/ // 新しい正規表現オブジェクト var x7 = function(){}; // 新しい関数オブジェクト
文字列オブジェクト
通常、文字列は原始値として作成されます:var firstName = "Bill"
ただし、以下のように使用することもできます new
キーワードで文字列オブジェクトを作成する:var firstName = new String("Bill")
以下の場所で JS 文字列この章では、なぜ文字列をオブジェクトとして作成すべきでないかを学びます。
数字オブジェクト
通常、数値は原始値として作成されます:var x = 456
ただし、以下のように使用することもできます new
キーワードで数字オブジェクトを作成する:var x = new Number(456)
以下の場所で JS 数字この章では、なぜ数値をオブジェクトとして作成すべきでないかを学びます。
ブールオブジェクト
通常、論理値は原始値として作成されます:var x = false
ただし、以下のように使用することもできます new
キーワードで論理オブジェクトを作成する:var x = new Boolean(false)
以下の場所で JS 論理この章では、なぜ論理値をオブジェクトとして作成すべきでないかを学びます。
- 前のページ JS オブジェクトアクセサー
- 次のページ JS オブジェクトプロトタイプ