在目标函数中定义 getter / setter

Question

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

正如我在 MDN 参考资料 (http://mzl.la/1CIUuIw) 中看到的那样，它很容易在对象文字中完成：

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

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

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

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

出现 "Unexpected identifier" 错误...

Answer 1

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

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

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

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

此外，这个 link、Javascript methods 准确地解释了您的需要，即向对象添加方法。 getter 传统上只是一种方法。

Answer 2

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"

Answer 3

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'

Answer 4

因为 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 的 class 符号可以更容易地做到这一点：

// 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看看效果如何

在目标函数中定义 getter / setter

Define getter / setter in object function

javascript

oop

getter

setter