Ein vorläufiges Verständnis der objektorientierten Javascript-Fähigkeiten

Vorwort

Klassenbasierte Objekte: Wir alle wissen, dass ein offensichtliches Zeichen in objektorientierten Sprachen das Konzept von Klassen ist. Durch Klassen, die Vorlagen ähneln, können wir viele Objekte mit denselben Eigenschaften und Methoden erstellen. Allerdings gibt es in ECMAScript kein Klassenkonzept, daher unterscheidet es sich natürlich von Objekten in klassenbasierten Sprachen.

Objekte in js: Eine ungeordnete Sammlung von Attributen, die Grundwerte, Objekte und Funktionen umfassen können. Das heißt, ein Objekt in js ist eine Reihe von Werten in keiner bestimmten Reihenfolge. Jede Eigenschaft oder Methode des Objekts hat einen eigenen Namen und jeder Name entspricht einem Wert.

Objekt verstehen

So erstellen Sie Objekte

1 Der einfachste Weg, ein Objekt zu erstellen, besteht darin, eine Objektinstanz zu erstellen und ihr dann Eigenschaften und Methoden hinzuzufügen.

Zum Beispiel

  var person = new Object();
    person.name='谦龙';
    person.sex='男';
    person.sayNameAndSex=function(){
      console.log(this.name,this.sex)
    }
    person.sayNameAndSex(); // 谦龙 男

2 Verwenden Sie die Objektliteralform

Zum Beispiel

  var person={
    name:'谦龙',
    sex:'男',
    sayNameAndSex:function(){
      console.log(this.name,this.sex)
    }
  }
   person.sayNameAndSex(); // 谦龙 男

Attributtyp

ECMAScript verfügt über zwei Arten von Datenattributen: Datenattribute und Zugriffsattribute.

Datenattribute

Das Datenattribut enthält den Speicherort eines Datenwerts. An dieser Stelle können Werte gelesen und geschrieben werden. Es gibt vier Eigenschaften, die sein Verhalten beschreiben.

1.[[Konfigurierbar]]: Gibt an, ob das Attribut neu definiert werden kann, indem es durch Löschen gelöscht wird... Der Standardwert ist wahr

2.[[Enumerable]]: Gibt an, ob das Attribut über eine for-Schleife zurückgegeben werden kann ... Der Standardwert ist true

3.[[Schreibbar]]: Gibt an, ob der Wert des Attributs geändert werden kann ... Der Standardwert ist wahr

4.[[Wert]]: Gibt den Wert dieses Attributs an. Der Standardwert ist undefiniert

Um die Standardeigenschaften einer Eigenschaft zu ändern, müssen Sie die ES5-Methode Object.defineProperty() verwenden, die drei Parameter empfängt: das Objekt, in dem sich die Eigenschaft befindet, den Namen der Eigenschaft und ein Objekt, das die Eigenschaftseigenschaften beschreibt (konfigurierbar, aufzählbar, beschreibbar, Wert). Durch Festlegen einer oder mehrerer davon können die entsprechenden Eigenschaften

geändert werden

DEMO

var person={};
Object.defineProperty(person,'name',{
 configurable:false,//表示不允许通过delete删除属性
 writable:false,//表示不允许重写
 ennumerable:false,//表示不允许通过for in遍历
 value:'谦龙'//设置该对象中属性的值
})
person.name='谦龙2';//尝试重新设置 结果不生效
delete person.name;//尝试删除 结果不生效
for(var attr in person){
 console.log(person[attr]);// false
}
console.log(person.name);//谦龙

Hinweis: Nachdem „configurable“ auf „false“ gesetzt wurde, darf es nicht erneut auf „true“ geändert werden. Darüber hinaus sind beim Aufruf der Methode „Object.defineProperty()“ die Standardwerte „configurable“, „ennumerable“ und „writable“ „false“.

Accessor-Eigenschaften

Accessor-Eigenschaften enthalten keine Datenwerte. Sie enthalten ein Paar von Getter- und Setter-Funktionen (diese beiden Funktionen sind jedoch nicht erforderlich). Beim Lesen der Accessor-Eigenschaften wird diese Funktion für die Rückgabe von a verantwortlich sein gültig Beim Schreiben der Accessor-Eigenschaft wird die Setter-Funktion aufgerufen und der neue Wert übergeben. Diese Funktion ist für die Verarbeitung der Daten verantwortlich.

Accessor-Eigenschaften haben die folgenden Eigenschaften

[[konfigurierbar]] gibt an, ob Attribute durch Löschen gelöscht werden können, um neue Attribute zu definieren

[[enumerable]] gibt an, ob die zurückgegebenen Attribute durch eine for-in-Schleife

durchlaufen werden können

[[get]] Funktion, die beim Lesen von Eigenschaften aufgerufen wird, der Standardwert ist undefiniert

[[set]] Die Funktion, die beim Schreiben der Funktion aufgerufen wird. Der Standardwert ist undefiniert

Hinweis: Accessor-Eigenschaften können nicht direkt definiert werden und müssen über Object.defineProterty() definiert werden

DEMO

 var book={
 _year:2015, //这里的下划线是常见的记号，表示只能通过对象的方法才能访问的属性
 edition:1
}
Object.defineProperty(book,'year',{
 get:function(){
  return this._year; //即默认通过 book.year获取值的时候 返回的是 boot._year的值
 },
 set: function (value) {//在对 boot.year设置值的时候 默认调用的方法 对数据进行处理
  var _year=this._year;
  if(value > _year){
   this._year=value;
   this.edition+=value-_year;
  }
 }
})
book.year = 2016;
console.log(book.year,book.edition); // 2016 2

Mehrere Attribute definieren

Wir können einem Objekt über die Methode Object.defineProperties() in ES5 mehrere Eigenschaften hinzufügen. Diese Methode akzeptiert zwei Objektparameter. Der erste Parameter ist das Objekt, dessen Eigenschaften hinzugefügt und geändert werden sollen, und der zweite Parameter ist The Attribute entsprechen den Attributen, die im ersten Objekt hinzugefügt und geändert werden sollen.

DEMO

var book={};
Object.defineProperties(book,{
 _year:{
  value:2015,
  writable:true //注意这里设置成true 才可以 "写" 默认是false 
 },
 edition:{
  value:1,
  writable:true //注意这里设置成true 才可以 "写" 默认是false
 },
 year:{
  get:function(){
   return this._year;
  },
  set: function (value) {
   var _year=this._year;
   if(value > _year){
    this._year=value;
    this.edition+=value-_year;
   }
  }
 }
})
book.year=2016;
console.log(book.year,book.edition); // 2016 2

Eigenschaften von Objekteigenschaften lesen

Mit der Methode Object.getOwnPropertyDescriptor() in ES5 können Sie den Deskriptor einer bestimmten Eigenschaft abrufen.

Diese Methode empfängt zwei Parameter: das Objekt, in dem sich das Attribut befindet, und den Attributnamen des zu lesenden Deskriptors. Was zurückgegeben wird, ist ein Datenattribut, die zurückgegebenen Attribute sind konfigurierbar, aufzählbar, beschreibbar, Wert. Wenn es sich um ein Zugriffsattribut handelt, sind die zurückgegebenen Attribute konfigurierbar, aufzählbar, get, set

DEMO

var book={};
Object.defineProperties(book,{
 _year:{
  value:2015,
  writable:true
 },
 edition:{
  value:1,
  writable:true
 },
 year:{
  get:function(){
   return this._year;
  },
  set: function (value) {
   var _year=this._year;
   if(value > _year){
    this._year=value;
    this.edition+=value-_year;
   }
  }
 }
})
//对象遍历函数
function showAllProperties(obj){
 for(var attr in obj){
  console.log(attr+':'+obj[attr]);
 }
}
var descriptor= Object.getOwnPropertyDescriptor(book,'_year');//数据属性
var descriptor2= Object.getOwnPropertyDescriptor(book,'year');//访问器属性
showAllProperties(descriptor);
console.log('============================');
showAllProperties(descriptor2);

Das ist die obige Einführung in das vorläufige Verständnis von objektorientiertem JavaScript. Beachten Sie.