javascript - 如何以对象文字表示法创建方法？

Question

我了解到有两种类型的创建对象。第一个：对象文字表示法，第二个：对象构造函数。我知道还有方法和函数，但是我不明白如何以对象文字表示法创建方法？在对象构造函数中，我只写：

var bob = new Object();
bob.age = 30;
bob.setAge = function(newAge) {
  bob.age = newAge;
};

你能告诉我在编写对象文字符号时如何做同样的事情吗？

var bob = {
  age: 30
};

Answer 1

从语法上讲，更改非常简单：

var bob = {
  age: 30,
  setAge: function (newAge) {
    bob.age = newAge;
  }
};

但是正如您所看到的，存在一个问题：在您的代码中，它使用外部bob变量，因此如果您更改变量的值，这将不起作用bob。

你可以用

var bob = {
  age: 30,
  setAge: function (newAge) {
    this.age = newAge;
  }
};

请注意，此时您应该检查您需要的实际上是否不是class，如果您有多个实例，它将带来一些性能改进。

更新： ECMAScript 6 现在允许以相同的方式定义方法，无论它们是否在对象字面量中：

var bob = {
  age: 30,
  setAge (newAge) {
    this.age = newAge;
  }
};

Answer 2

它没有什么不同，而且很简单

var bob = {
    age:     30,
    setAge:  function( newAge ) {
        this.age = newAge;
    }
};

---

或者，您可以通过调用或简单地创建一个真正的setter函数Object.defineProperty()

var bob = {
    age:       30,
    firstName: 'j',
    lastName:  'Andy',
    set setName( newName ) {
        var spl = newName.split( /\s+/ );
        this.firstName = spl[ 0 ];
        this.lastName  = spl[ 1 ];
    }
}

你可以去哪里

bob.setName = "Thomas Cook";  // which sets firstName to "Thomas" and lastName to "Cook"

Answer 3

您发布的最后一个代码缺少逗号。此外，您不需要';' 在对象属性的函数定义之后。像这样：

var object2 = {
name: "Fred",
age: 28,
club: "Fluminense",
bio2: function (){
    console.log(this.name +" is "+ this.age + " years old and he is playing in "+             this.club);
    }
};

Answer 4

这是使用文字对象创建方法解决此练习的方法：

var setAge = function (newAge) {
  this.age = newAge;
};

var bob = new Object();
bob.age = 30;
bob.setAge = setAge;

var susan = {
    age: 25,
    setAge: setAge
}

susan.setAge(35);

Answer 5

如果要封装，可以使用以下语法（自执行函数）。这里年龄不能从对象 bob 的外部访问。

var bob = (function() {
    //...private
    var age = 30;

    function setAge(newAge) {
        age = newAge;
    };

    function getAge() {
            return age;
        }
    // Public api
    return {
        setAge: setAge,
        getAge: getAge
    }
}());
bob.setAge(50);
alert(bob.getAge());

jsfiddle：http: //jsfiddle.net/61o9k98h/1/

Answer 6

从 ECMAScript 2015 开始，引入了一种更短的对象初始化方法定义语法。它是分配给方法名称的函数的简写

---

const bob = {
    age: 30,
    setAge(age) {
        this.age = age;
    },
};
alert(bob.age); // 30
bob.setAge(63); // set age = 63
alert(bob.age); // 63

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Method_definitions

Answer 7

像这样：

var bob = {
    age: 30,
    setAge: function (age) {
        this.age = age;
    }
}
alert(bob.age); // 30
bob.setAge(45); // set age = 45
alert(bob.age); // 45