Heim > Web-Frontend > js-Tutorial > So verwenden Sie Setter- und Getter-Methoden in JavaScript

So verwenden Sie Setter- und Getter-Methoden in JavaScript

亚连
Freigeben: 2018-06-23 16:57:59
Original
1700 Leute haben es durchsucht

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){
    /*函数体*/
  }
}
Nach dem Login kopieren

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
Nach dem Login kopieren

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
Nach dem Login kopieren

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
Nach dem Login kopieren

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
Nach dem Login kopieren
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!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage