คีย์เวิร์ด“ get” ก่อนฟังก์ชันในคลาสคืออะไร


115

อะไรgetเฉลี่ยในชั้นเรียน ES6 นี้หรือไม่? ฉันจะอ้างอิงฟังก์ชันนี้ได้อย่างไร? ฉันควรใช้มันอย่างไร?

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

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

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

5
มันมีโอกาสมากที่สุดเพียงทะเยอทะยานแต่ภายในชั้นเรียนแทนของวัตถุ ไม่ใช่เฉพาะ ES6 จริงๆ
user4642212

@ Xufox คุณหมายถึงมันไม่เฉพาะ ES6 ได้อย่างไร?
Keith Nicholas

1
@KeithNicholas: มันทำงานใน ES5 เหมือนกัน
Bergi

@KeithNicholas Getters มีอยู่ตั้งแต่ ES5 ฉันคิดว่า สิ่งเดียวที่เป็น ES6 ที่นี่คือclassไวยากรณ์ แต่ getters ไม่มีอะไรใหม่
user4642212

คำตอบ:


117

หมายความว่าฟังก์ชั่นคือ getter สำหรับคุณสมบัติ

ในการใช้งานเพียงแค่ใช้ชื่อตามที่คุณต้องการ:

'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);


2
ชั้นเรียนเป็นโดยปริยายในโหมดเข้มงวด btw ecma-international.org/ecma-262/6.0/#sec-strict-mode-code
Kit Sunde

2
@KitSunde - อย่างน้อยบนเบราว์เซอร์ของฉัน (Chrome, Win7) โดยไม่มีคำสั่งนั้นฉันได้รับข้อผิดพลาดของคอนโซลแทนที่จะเป็นตัวอย่างการทำงาน และนี่ไม่ใช่ส่วนหนึ่งของ "คำตอบ" เหมือนกับว่าปุ่ม "เรียกใช้ข้อมูลโค้ด" ไม่ใช่
Amit

5
อย่าเพิ่งโทรได้p. calcAreaไหม ถ้าไม่ทำไมไม่?
ksav

11
คำหลักรับ / ตั้งค่าเป็นเพียงน้ำตาลสังเคราะห์หรือไม่เนื่องจากการเรียกใช้ Polygon.calcArea () จะทำหน้าที่เป็นตัวรับด้วยหรือไม่?
Craig O. Curtis

1
ดังนั้น function get getkeyword ไม่มีพารามิเตอร์?
jay1234

49

สรุป:

getคำหลักที่จะผูกคุณสมบัติวัตถุที่จะฟังก์ชั่น เมื่อคุณสมบัตินี้ถูกค้นหาตอนนี้ฟังก์ชัน getter จะถูกเรียกใช้ ค่าที่ส่งคืนของฟังก์ชัน getter จะกำหนดคุณสมบัติที่ส่งคืน

ตัวอย่าง:

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


2
ยกนิ้วให้กับตัวอย่างที่ใช้ได้จริง!
Niket Pathak

9
ฉันคิดว่าฉันสามารถทำให้มันง่ายขึ้นได้อีก 'get' ช่วยให้คุณปฏิบัติต่อเมธอดคลาสราวกับว่ามันเป็นคุณสมบัติง่ายๆในออบเจ็กต์ หากคุณออกจาก 'get' คุณยังสามารถเข้าถึงค่าได้โดยโทร .area () แทนที่จะเป็นเพียง .area
dwilbank

22

เป็น getter เช่นเดียวกับ Objects และ Classes ใน OO JavaScript จาก MDN Docs สำหรับget:

getไวยากรณ์ผูกวัตถุคุณสมบัติฟังก์ชั่นที่จะถูกเรียกเมื่อทรัพย์สินที่จะเงยหน้าขึ้นมอง


0

หรือวิธีที่ง่ายกว่านั้นก็แค่เรียกใช้ฟังก์ชันโดยไม่จำเป็นต้องใช้ผู้ใช้ "()" เพียงแค่พิมพ์ชื่อฟังก์ชัน

ทั้งสองฟังก์ชั่นข้างต้นมีความสนใจเท่ากันกับ person.fullName () และ 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);

โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.