ホームページ  >  記事  >  ウェブフロントエンド  >  オブジェクト指向 JavaScript とは何ですか? js のオブジェクトを理解する

オブジェクト指向 JavaScript とは何ですか? js のオブジェクトを理解する

不言
不言オリジナル
2018-08-31 10:33:4618346ブラウズ

この記事の内容は、JavaScriptのオブジェクト指向とは何か? js のオブジェクトの理解には一定の参考価値があります。必要な方は参考にしていただければ幸いです。

オブジェクト指向 JavaScript とは何ですか? js のオブジェクトを理解する

1. オブジェクト指向

オブジェクト指向言語の最も基本的なシンボルは、クラスの概念です。クラスとは何ですか?クラスは複数のプロパティとメソッドを含むコレクションです。クラスのインスタンスは オブジェクト です。
歴史的な理由により、ECMAScript (以下、JS) のオブジェクトの概念は、クラスベース言語のオブジェクトとは異なります。 ECMA-262 では、オブジェクトを「順序のない属性のコレクション。その属性には基本的な値、オブジェクト、または関数を含めることができる」と定義されています。
各オブジェクトは参照型に基づいて作成されます。

2. オブジェクトを理解する

2.1. JS でオブジェクトを作成するには 2 つの方法があります:

// 第一种:创建Object实例
var person = new Object();
person.name = 'tom';
person.age = 20;
person.sayIt = function(){console.log(this.name, this.age)}

// 第二种:对象字面量值
var person = {
   name: 'tom',
   age: 20,
   sayIt: function(){console.log(this.name, this.age)}
}

上記 2 つの例で作成されたオブジェクトは同じであり、同じプロパティとメソッドを持ちます。

2.2. データ属性とアクセサー属性

JS オブジェクトの keys (つまり、name やsayIt などの属性とメソッド) は、データ属性とアクセサー属性の 2 種類の属性に分類されます。

2.2.1. データ属性

データ属性には、値を読み書きできるデータ値の場所が含まれます。次の 4 つの特性が含まれます:

Configurable: delete で属性を削除できるかどうか、および属性記述子のタイプを変更できるかどうかを示します。この値を指定せずにインスタンスを作成すると、デフォルト値は true になります。
Enumerable: 属性が列挙可能 (for-in) かどうかを示します。この値を指定せずにインスタンスを作成した場合、デフォルト値は false になります。
Writable: 属性値を変更できるかどうかを示します。この値を指定せずにインスタンスを作成すると、デフォルト値は true になります。
Value: 属性の値を表します。デフォルト値は未定義です。この値を指定せずにインスタンスを作成すると、デフォルトで未定義になります。

インスタンスを作成する場合:

var person = {
    name: 'tom'
}

person オブジェクトの属性名のデータ属性 Configurable、Enumerable、および Writable はすべて true、つまり、name 属性は削除、列挙、および現在の値の書き換えが可能です。 name 属性のは「tom」です。
属性のデータ属性を変更する場合は、ES5 が提供する Object.defineProperty() メソッドを使用して、オブジェクトに新しい属性を追加することもできます。このメソッドには、ターゲット オブジェクトという 3 つのパラメーターがあります。定義または変更する必要がある名前、データ属性
person インスタンスの name 属性を次のように変更します:

var person = {
    name: 'tom'
}
Object.defineProperty(person, 'name', {
    configurable: false,
    enumerable: false,
    writable: false,
    value: 1
})
console.log(person.name); // 1,name属性的值已修改为1

delete person.name; 
console.log(person.name); // 1, name属性依然存在

for(var i in person){
    console.log(i); // undefined,name属性不可枚举
}

person.name = 2; 
console.log(person.name); // 1,name的值依然为1,不可修改

注: Object.defineProperty() メソッドは、それ以外のプロパティを変更できません。 configurable を false に設定すると書き込み可能になります。

2.2.2. アクセサープロパティ

アクセサープロパティにはデータ値はなく、関数は 2 つだけです:

getter 関数、有効な値を取得します

setter 関数、有効な値を設定します

アクセサー プロパティを使用する一般的な方法は次のとおりです。他の属性を変更するには、属性の値を設定します。アクセサー属性には、次の 4 つの特性も含まれます。

Configurable: delete で属性を削除できるかどうか、および属性記述子のタイプを変更できるかどうかを示します。この値を指定せずにインスタンスを作成した場合、デフォルト値は false になります。
Enumerable: 属性が列挙可能 (for-in) かどうかを示します。この値を指定せずにインスタンスを作成した場合、デフォルト値は false になります。
Get: 属性を読み取るときに呼び出される関数。デフォルト値は undefine です。
Set: 属性を書き込むときに呼び出される関数。デフォルト値は undefine です。

var book = {
    _year: 2004,
     edition: 1
};
Object.defineProperty(book, "year", {
     get: function(){
         return this._year;
     },
     set: function(newValue){
         if (newValue > 2004) {
             this._year = newValue;
             this.edition += newValue - 2004;
         }
     }
});
book.year = 2005;
console.log(book.edition); //2
ここで、year はアクセサー属性、_year はデータ属性です。

アクセサー属性 year の Configurable および Enumerable が設定されていないため、これは false、つまり、アクセサー属性 year を削除または列挙することはできません。

Object.getOwnPropertyDescriptor() メソッドを通じてプロパティのプロパティを読み取ることができます:

var descriptor = Object.getOwnPropertyDescriptor(book, '_year'); 
console.log(descriptor.writable); // true
console.log(descriptor.configurable); // true

概要:

javasc のオブジェクトは複数のプロパティとメソッドのコレクションのインスタンスであり、そのプロパティはデータに分割されますプロパティとアクセサー プロパティ どちらのタイプも、Object が提供するさまざまなメソッドを通じてオブジェクトのプロパティを読み取り、変更できます。

関連する推奨事項:

JavaScript のオブジェクト指向の概要_js オブジェクト指向

JavaScript オブジェクト指向のオーバーロード_js オブジェクト指向

以上がオブジェクト指向 JavaScript とは何ですか? js のオブジェクトを理解するの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

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