JavaScript:函数返回一个对象


85

我正在codecademy.com上一些JavaScript / jQuery的课程。通常,这些课程提供了答案或提示,但是对于这一课程它没有任何帮助,我对说明感到有些困惑。

它说要使函数makeGamePlayer返回带有三个键的对象。

//First, the object creator
function makeGamePlayer(name,totalScore,gamesPlayed) {
    //should return an object with three keys:
    // name
    // totalScore
    // gamesPlayed
}

我不确定是否应该这样做

//First, the object creator
function makeGamePlayer(name,totalScore,gamesPlayed) {
    //should return an object with three keys:
    // name
    // totalScore
    // gamesPlayed

         this.name =  name;
         this.totalScore = totalScore;
         this.gamesPlayed = gamesPlayed;
}

或类似的东西

 //First, the object creator
    function makeGamePlayer(name,totalScore,gamesPlayed) {
        //should return an object with three keys:
        // name
        // totalScore
        // gamesPlayed

         var obj = {
             this.name =  name;
             this.totalScore = totalScore;
             this.gamesPlayed = gamesPlayed;
          }
    }

创建对象后,我必须能够修改其属性。

Answers:


143

在JavaScript中,大多数函数都是可调用的和可实例化的:它们都具有[[Call]][[Construct]]内部方法。

作为可调用对象,您可以使用括号来调用它们,可以选择传递一些参数。调用的结果是,该函数可以返回一个value

var player = makeGamePlayer("John Smith", 15, 3);

上面的代码调用函数makeGamePlayer,并将返回的值存储在变量中player。在这种情况下,您可能想要定义如下函数:

function makeGamePlayer(name, totalScore, gamesPlayed) {
  // Define desired object
  var obj = {
    name:  name,
    totalScore: totalScore,
    gamesPlayed: gamesPlayed
  };
  // Return it
  return obj;
}

此外,当您调用函数时,还需要在底层传递一个附加参数,该参数确定this函数内部的值。在上述情况下,由于makeGamePlayer未作为方法调用,因此该this值在草率模式下将是全局对象,而在严格模式下将是未定义。

作为构造函数,您可以使用new运算符实例化它们。此运算符使用[[Construct]]内部方法(仅在构造函数中可用),该方法是这样的:

  1. 创建一个继承自.prototype构造函数的新对象
  2. 调用传递此对象作为this值的构造方法
  3. 如果它是对象,则返回构造函数返回的值,否则返回在步骤1创建的对象。
var player = new GamePlayer("John Smith", 15, 3);

上面的代码创建的实例,GamePlayer并将返回值存储在变量中player。在这种情况下,您可能想要定义如下函数:

function GamePlayer(name,totalScore,gamesPlayed) {
  // `this` is the instance which is currently being created
  this.name =  name;
  this.totalScore = totalScore;
  this.gamesPlayed = gamesPlayed;
  // No need to return, but you can use `return this;` if you want
}

按照约定,构造函数名称以大写字母开头。

使用构造函数的优点是实例继承自GamePlayer.prototype。然后,您可以在那里定义属性并使它们在所有实例中都可用


4
@OP还请注意,当您打算使用new关键字调用它时,我建议使用大写字母开头该名称MakeGamePlayer
PeeHaa 2012年

3
@PeeHaa好的建议,使用构造函数时,更典型的命名约定是new GamePlayer()
Matt Zeunert 2012年

@RobG谢谢,这就是我复制粘贴代码而不深入查看代码时发生的情况。
Oriol 2012年

47

您可以使用对象常量简单地做到这一点:

function makeGamePlayer(name,totalScore,gamesPlayed) {
    return {
        name: name,
        totalscore: totalScore,
        gamesPlayed: gamesPlayed
    };
}

3
您好,如何访问返回属性,当我使用makeGamePlayer.name时不起作用
iKamy

1
var player1 = makeGamePlayer(“ Bobby Fischer”,15,5); player1.name;
mrturtle

5

两种风格都可以进行调整。

第一种方法使用Javascript构造函数,就像大多数事物一样,它具有优缺点。

 // By convention, constructors start with an upper case letter
function MakePerson(name,age) {
  // The magic variable 'this' is set by the Javascript engine and points to a newly created object that is ours.
  this.name = name;
  this.age = age;
  this.occupation = "Hobo";
}
var jeremy = new MakePerson("Jeremy", 800);

另一方面,如果我没记错的话,您的另一种方法称为“显示关闭模式”。

function makePerson(name2, age2) {
  var name = name2;
  var age = age2;

  return {
    name: name,
    age: age
  };
}

被称为“公开模块模式”,但通常将其包装为私有闭包(function(){return {}})()
FelipeQuirós19年

3

使用ES2016 JavaScript的最新方法

let makeGamePlayer = (name, totalScore, gamesPlayed) => ({
    name,
    totalScore,
    gamesPlayed
})

2

我将这些指示的意思是:

  function makeGamePlayer(name,totalScore,gamesPlayed) {
        //should return an object with three keys:
        // name
        // totalScore
        // gamesPlayed

         var obj = {  //note you don't use = in an object definition
             "name": name,
             "totalScore": totalScore,
             "gamesPlayed": gamesPlayed
          }
         return obj;
    }

1
为什么对象中有分号?
亚历克斯G

@AlexG不错,自我首次发布此答案以来的四年中,简直无法相信。毫无疑问,这是我和其他人所做的OP原始对象的糟糕的粘贴粘贴工作。
scrappedcola
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.