Apa yang dimaksud dengan kata kunci "get" sebelum fungsi di kelas?

106

Apa getartinya di kelas ES6 ini? Bagaimana cara mereferensikan fungsi ini? Bagaimana saya harus menggunakannya?

class Polygon {
  constructor(height, width) {
    this.height = height;
    this.width = width;
  }

  get area() {
    return this.calcArea()
  }

  calcArea() {
    return this.height * this.width;
  }
}
Matthew Harwood
sumber
5
Kemungkinan besar hanya pengambil tetapi di dalam kelas, bukan objek. Ini tidak benar-benar spesifik untuk ES6.
pengguna4642212
@ Xufox bagaimana maksud Anda itu tidak spesifik ES6?
Keith Nicholas
1
@KeithNicholas: Itu bekerja di ES5 sama.
Bergi
@KeNicholas Getters ada sejak ES5, saya pikir. Satu-satunya hal yang ES6 di sini adalah classsintaksnya, tetapi getter bukanlah hal baru.
pengguna4642212

Jawaban:

109

Artinya, fungsinya adalah pengambil properti.

Untuk menggunakannya, cukup gunakan namanya seperti yang Anda lakukan pada properti lainnya:

'use strict'
class Polygon {
  constructor(height, width) {
    this.height = height;
    this.width = width;
  }

  get area() {
    return this.calcArea()
  }

  calcArea() {
    return this.height * this.width;
  }
}

var p = new Polygon(10, 20);

alert(p.area);

Amit
sumber
2
Kelas secara implisit dalam mode ketat btw. ecma-international.org/ecma-262/6.0/#sec-strict-mode-code
Kit Sunde
1
@KitSunde - setidaknya di browser saya (Chrome, Win7), tanpa pernyataan itu saya mendapatkan kesalahan konsol alih-alih sampel yang berfungsi. Dan ini bukan bagian dari "Jawaban", seperti halnya tombol "Jalankan cuplikan kode".
Amit
4
Bisakah kamu tidak menelepon saja p. calcArea? jika tidak, mengapa tidak?
ksav
9
Apakah kata kunci get / set hanya gula sintaksis - karena panggilan ke Polygon.calcArea () juga akan bertindak sebagai pengambil juga?
Craig O. Curtis
jadi fungsi get getkata kunci tidak boleh memiliki parameter?
jay1234
47

Ringkasan:

Kata getkunci akan mengikat properti objek ke fungsi. Saat properti ini dicari, sekarang fungsi pengambil dipanggil. Nilai kembali dari fungsi pengambil kemudian menentukan properti mana yang dikembalikan.

Contoh:

const person = {
    firstName: 'Willem',
    lastName: 'Veen',
    get fullName() {
        return `${this.firstName} ${this.lastName}`;
    }

}

console.log(person.fullName);
// When the fullname property gets looked up
// the getter function gets executed and its
// returned value will be the value of fullname

Willem van der Veen
sumber
2
Jempol untuk contoh praktisnya!
Niket Pathak
8
Saya rasa saya bisa menyederhanakannya lebih jauh. 'Get' memungkinkan Anda memperlakukan metode kelas, seolah-olah itu adalah properti sederhana dalam sebuah objek. Jika Anda meninggalkan 'get', Anda masih dapat mengakses nilainya dengan memanggil .area () alih-alih hanya .area
dwilbank
21

Ini getter, sama seperti Objects and Classes di OO JavaScript. Dari Dokumen MDN untuk get:

The getsintaks mengikat properti objek untuk fungsi yang akan dipanggil ketika properti yang mendongak.

Praveen Kumar Purushothaman
sumber
0

atau lebih sederhananya cukup dengan memanggil fungsi tersebut tanpa perlu user "()" hanya dengan mengetikkan nama fungsinya

dua fungsi di atas adalah perhatian yang sama ke person.fullName () dan person.fullName

const person = {
    firstName: 'Willem',
    lastName: 'Veen',
    fullName() {
        return `${this.firstName} ${this.lastName}`;
    }

}

console.log(person.fullName());

const person = {
    firstName: 'Willem',
    lastName: 'Veen',
    get fullName() {
        return `${this.firstName} ${this.lastName}`;
    }

}

console.log(person.fullName);

nima sarayan
sumber