在对象函数中定义getter/setter答案

【问题标题】：Define getter / setter in object function在对象函数中定义getter/setter
【发布时间】：2015-07-16 08:40:16
【问题描述】：

我正在学习 JavaScript，想知道是否可以在对象函数中定义 getter 和 setter。主要区别在于调用方式，如果定义为getFullName = function()，我应该将方法调用为myObj.getFullName()，但是，对于数组，getter 允许将其作为简单属性调用myObj.fullName（无需括号）。

正如我在 MDN 参考资料 (http://mzl.la/1CIUuIw) 中看到的，在 Object Literals 中很容易做到：

var obj = {
    get var(){
        return "something";
    }
}

但是，我不能像这样在对象函数上这样做：

function obj(name, lname){
    this.name = name;
    this.lastName = lname;

    get fullName(){
         return this.name + " " + this.lastName;
    }
}

收到“意外标识符”错误...

【问题讨论】：

发布你看到这个的参考因为这对我来说看起来不对

标签： javascript oop setter getter

【解决方案1】：

因为get XX(){} 用于var obj = {}; 但这里使用构造函数来创建新对象。所以你应该使用MDN - Object.defineProperty()。

如果您希望 fullName 应用于从 obj 创建的所有对象，请将其应用于其原型。

function obj(name, lname){
  this.name = name;
  this.lastName = lname;
}

Object.defineProperty(obj.prototype, 'fullName', {
  get : function() {
    return this.name + " " + this.lastName;
  }
});

var aObj = new obj("first", 'lastN');
console.log(aObj.fullName);

更新：如果您想要更直接的方式，并且不害怕尝试新事物，那么ES2015 的类符号可以更轻松地做到这一点：

// ES2015 - class
class obj {
  constructor(name, lname) {
    this.name = name;
    this.lname = lname;
  }

  // Define getter method for fullName
  get fullName() {
    return this.name + " " + this.lastName;
  }
}

var aObj = new obj('Billy', 'Hallow');
console.log(aObj.fullName);

目前大多数浏览器不支持，如果你想在你的站点中使用它，你需要使用像Babel这样的js编译器将它从ES2015转译成ES5。

Babel 还提供了playground 给对 ES2015 感兴趣的朋友，你可以将上面的代码复制到 Playground 看看它是如何工作的。

【讨论】：

你好@fuyushimoya，我想知道你是否知道如何让getter和setter与私有变量交互。例如，我有一个构造函数：function person(){ var a = 0; }，我在其中添加了一个 getter get: function() { return a;}。但它会抛出 a is not defined... 显然 this.a 也未定义...有什么想法吗？
如果没有其他(function/var) ref 到a，a 将在函数执行后被收集，你会在jsfiddle 上创建一些sn-p 来显示你想要实现的目标吗？
我创建了一个jsfiddle，也许这就是你所期望的。
非常感谢！问题是Object.defineProperty 在构造函数之外，使用constructorName.prototype。
那不行，你在构造函数中的a 只对构造函数和其中定义的函数可见，所以你必须使用我在那个jsfiddle上发布的内容来访问它。

【解决方案2】：

Javascript 使用prototype 继承，其函数以function 关键字开头。按照惯例，对象的第一个字符大写。

function Obj(name, lname){
    this.name = name;
    this.lastName = lname;
}

Obj.prototype.get = function() {
     return this.name + " " + this.lastName;
}

var person = new Obj('luke', 'lim');
console.log(person.get()); // 'luke lim'

【讨论】：

【解决方案3】：

只需创建一个变量并将函数分配给它。

function obj(name, lname){
    this.name = name;
    this.lastName = lname;

    this.fullName = function(){
        return this.name + " " + this.lastName;
    };
}

如果您想了解更多信息，请尝试阅读有关 Javascript closure 的内容。

此外，此链接Javascript methods 正在准确解释您需要什么，即向对象添加方法。传统上，getter 只是一种方法。

【讨论】：

getter 和method 的区别在于调用它时不需要括号，就像length 用于数组一样。我只是想知道这是否可能
据我所知，在 Javascript 中没有 get 这样的标识符，所以我猜这就是您的错误的来源。在 Javascript 中，您可以使用闭包或嵌套函数。我向你展示了闭包，这是一个 Javascript 方法w3schools.com/js/js_object_methods.asp。你的例子就在那里！
我理解该评论，但请查看问题中的参考链接。 JavaScript 接受 getter 和 setter 作为函数，使它们能够被称为属性而不是方法。您还可以查看@fuyushimoya 接受的答案
@JoColina 是的，但话又说回来，完全一样。 fuyushimoya 方法的缺点是语法比较复杂。
事实上，闭包的结果是一样的。我只是想知道为什么我不能在构造函数中添加一个getter。非常感谢！

【解决方案4】：

function obj(name, lname){
    this.name = name;
    this.lastName = lname;
}
obj.prototype.getfullName = function(){
    return this.name + " " + this.lastName;
}

把它当作

a = new obj("My","Name");
a.getfullName() //"My Name"

【讨论】：