So verwenden Sie Setter- und Getter-Methoden in JavaScript

In diesem Artikel werden hauptsächlich die Setter- und Getter-Methoden von JavaScript vorgestellt, die einen gewissen Referenzwert haben.

Ich habe sie noch nie beim Schreiben von Projekten verwendet von Javascript sind ein Konzept, das verstanden werden muss. Heute habe ich diesen Wissenspunkt in einem Buch gesehen, aber er war noch vage, also habe ich beschlossen, ihn zu studieren.

Eigenschaften von Javascript-Objekten Es besteht aus einem Namen, ein Wert und eine Reihe von Eigenschaften. Werfen wir also zunächst einen Blick auf die beiden Eigenschaften von Objekten:

Dateneigenschaften, die wir häufig verwenden, und Sie sollten mit
Accessor-Eigenschaften, auch Accessor-Eigenschaften genannt

, vertraut sein Was ist das Storage-Getter-Attribut? Es handelt sich um eine Reihe von Funktionen, die Werte abrufen und festlegen. In ECMAScript5 können Eigenschaftswerte mit einer oder zwei Methoden festgelegt werden. Die beiden Methoden sind Getter und Setter. Daher werden durch Getter und Setter definierte Eigenschaften als Accessor-Eigenschaften bezeichnet.

var o = {
  get val(){
    /*函数体*/
    return ;
  },
  set val(n){
    /*函数体*/
  }
}

Das Obige ist die einfachste Möglichkeit, ein Accessor-Attribut zu definieren. Es ist ersichtlich, dass die Getter- und Setter-Methoden tatsächlich Funktionen sind, die Funktionen ersetzen.

var o = {
  a:3,
  get val(){
    return Math.pow(this.a,2);
  }
}

console.log(o.val);//9
o.val = 100;
console.log(o.val);//9

Die Getter-Methode hat keine Parameter und einen Rückgabewert. Wenn die Getter-Methode separat festgelegt wird, kann sie nur den Attributwert abrufen und den definierten Attributwert nicht ändern, um die Sicherheit der Daten zu gewährleisten 🎜 >

var o = {
  a:3,
  set val(n){
    this.a = n;
  }
}

console.log(o.val);//undefined

Die Setter-Methode hat Parameter und keinen Rückgabewert; wenn die Setter-Methode alleine gesetzt ist, kann der Attributwert nicht gelesen werden

var o ={
  a:3,
  get val(){
    return Math.pow(this.a,n);
  },
  set val(n){
    this.a = Math.max(this.a,n);
  }
}

console.log(o.a);//3
console.log(o.val);//9
o.val = 10;
console.log(o.a);//10
console.log(o.val);//100

Wie aus dem obigen Code ersichtlich ist, bezieht sich dies auf Sein Objekt (das heißt das „o“ im Code);

var o ={
   a:3,
  get val(){
    return Math.pow(this.a,n);
  },
  set val(n){
    this.a = Math.max(this.a,n);
  }
}

o.val = 10;
var foo = Object.create(o);
console.log(foo.val);//10
foo.val = 9;
console.log(foo.val);//10

Das Obige ist das, was ich für alle zusammengestellt habe. Ich hoffe, dass es in Zukunft für alle hilfreich sein wird.

Verwandte Artikel:

Informationen dazu, wie Vue.js das Laden mit unendlichem Scrollen implementiert

Chrome Firefox wird mit Debugging-Tools geliefert (ausführliches Tutorial)

So schreiben Sie eine Ajax-Anfragefunktion mit JS

So erstellen Sie Vue mit vue-cli+webpack

Das obige ist der detaillierte Inhalt vonSo verwenden Sie Setter- und Getter-Methoden in JavaScript. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!