JavaScript : fonction retournant un objet

Question

Je suis des cours de JavaScript/jQuery sur codecademy.com. Normalement, les leçons fournissent des réponses ou des conseils, mais pour celle-ci, il n'y a pas d'aide et je suis un peu perdu par les instructions.

Il est dit que la fonction makeGamePlayer doit retourner un objet avec trois clés.

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

Je ne suis pas sûr que je doive faire ça.

//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;
}

ou quelque chose comme ceci

 //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;
          }
    }

Je dois être en mesure de modifier les propriétés de l'objet après sa création.

Answer 1

En JavaScript, la plupart des fonctions sont à la fois appelables et instanciables : ils ont à la fois une [[Appel]] y [[Construire]] les méthodes internes.

En tant qu'objets appelables, vous pouvez utiliser des parenthèses pour les appeler, en passant éventuellement des arguments. À la suite de l'appel, la fonction peut retourner une valeur .

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

Le code ci-dessus appelle la fonction makeGamePlayer et stocke la valeur retournée dans la variable player . Dans ce cas, vous pouvez définir la fonction comme suit :

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

De plus, lorsque vous appelez une fonction, vous passez également un argument supplémentaire sous le capot, qui détermine la valeur de la fonction this à l'intérieur de la fonction. Dans le cas ci-dessus, puisque makeGamePlayer n'est pas appelé en tant que méthode, le this La valeur sera l'objet global dans le mode sloppy, ou indéfini dans le mode strict.

En tant que constructeurs, vous pouvez utiliser les new opérateur pour les instancier. Cet opérateur utilise le [[Construire]] (disponible uniquement dans les constructeurs), qui fait quelque chose comme ceci :

1. Crée un nouvel objet qui hérite de l'objet .prototype du constructeur
2. Appelle le constructeur en passant cet objet en tant que this valeur

3. Elle renvoie la valeur retournée par le constructeur si c'est un objet, ou l'objet créé à l'étape 1 sinon.

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

Le code ci-dessus crée une instance de GamePlayer et stocke la valeur retournée dans la variable player . Dans ce cas, vous pouvez définir la fonction comme suit :

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
}

Par convention, les noms des constructeurs commencent par une lettre majuscule.

L'avantage d'utiliser des constructeurs est que les instances héritent de GamePlayer.prototype . Ensuite, vous pouvez y définir des propriétés et les rendre disponibles dans toutes les instances.

Answer 2

Vous pouvez simplement le faire comme ceci avec un objet littéral :

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

Answer 3

La dernière façon de le faire avec ES2016 JavaScript

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

Answer 4

Les deux styles, avec un peu d'ajustement, pourraient fonctionner.

La première méthode utilise un constructeur Javascript, qui, comme la plupart des choses, présente des avantages et des inconvénients.

 // 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);

D'autre part, votre autre méthode s'appelle le "modèle de fermeture révélatrice" si je me souviens bien.

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

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

Answer 5

Je prendrais ces indications pour dire :

  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;
    }