函数中的 Getter 和 Setter (javascript)答案

【问题标题】：Getters and Setters in a function (javascript)函数中的 Getter 和 Setter (javascript)
【发布时间】：2016-07-14 06:51:38
【问题描述】：

在这样的对象中使用get 时，get 有效：

var people = {
  name: "Alex",
  get sayHi() {
    return `Hi, ${this.name}!`
    }
};

var person = people;

document.write(person.sayHi);

但是使用函数我得到一个错误。如何在这样的函数中使用 Getter 和 Setter？

function People2() {
  this.name = "Mike";
  get sayHi() {
    return `Hi, ${this.name}!`;
  }
};

var user = new People2();

document.write(user.sayHi);

【问题讨论】：

不确定this是否重复
@bergi - 我搜索过。没有找到关于如何在函数中而不是在对象中使用 Getter 和 Setter 的问题
@AlexeyTseitlin 你可以使用Object.defineProperty 来定义getter 和setter。您还可以将Person2 封装在一个类中，即。 e. class People2 { constructor() { this.name = "Mike"; } get sayHi() { return "Hi, " + this.name;} }

标签： javascript function getter-setter

【解决方案1】：

您只能在类 (ES2015) 和对象字面量中使用实际的 get 和 set 关键字。

ECMAScript 5

在 ES5 中，您通常会使用 Object.defineProperty 来实现您想要实现的目标：

function People2() {
    this.name = "Mike";
}
Object.defineProperty(People2.prototype, "sayHi", {
    get: function() {
        return "Hi, " + this.name + "!";
    }
});

ECMAScript 2015

在 ES2015 中，您还可以使用类来实现所需的行为：

class People2 {
    constructor() {
        this.name = "Mike";
    }
    get sayHi() {
        return `Hi, ${this.name}!`;
    }
}

【讨论】：

【解决方案2】：

你可以试试这个

<script>
function People2(name) {
  this.name = name;  
};

People2.prototype = {
  get sayHi() {
    return `Hi, ${this.name}!`;}
};

var user = new People2('Alex');

document.write(user.sayHi);
</script>

或者这个……

<script>
function people(name) {
    this.name = name;
};

Object.defineProperty(people.prototype, 'sayHi', {
    get: function() { return `Hi, ${this.name}!`; }
});

var person = new people('Alex');

document.write(person.sayHi);
</script>

【讨论】：

我们也可以把“people.prototype”改成“this”=)

【解决方案3】：

如果您想为具有更多控制权的函数定义像name这样的属性，我们可以在函数本身上使用Object.defineProperty，如下所示：

function people(name) {

    //this.name = name; //this can be modified freely by caller code! we don't have any control

    var _name = name; //use a private var to store input `name`
    Object.defineProperty(this, 'name', {
        get: function() { return _name; },  //we can also use `return name;` if we don't use `name` input param for other purposes in our code
        writable: false, //if we need it to be read-only
        //... other configs
    });

};

var person = new people('Alex');
console.log(person.name); //writes Alex

【讨论】：

【解决方案4】：

例如，使用这个：

function People2() {
  this.name = "Mike";
  this.__defineGetter__("sayHi", function() {
    return `Hi, ${this.name}!`;
  });
};

【讨论】：

Object.prototype.__defineGetter__ 已弃用且非标准。 Do not use it.