[javascript] JavaScript : 객체를 반환하는 함수

Program / 글쓴이

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

개체를 만든 후 개체의 속성을 수정할 수 있어야합니다.

답변

JavaScript에서 대부분의 함수 는 호출 가능하고 인스턴스화 가능합니다. 이들은 [[Call]] 및 [[Construct]] 내부 메서드를 모두 가지고 있습니다.

호출 가능한 객체로서 괄호를 사용하여 호출 할 수 있으며 선택적으로 일부 인수를 전달할 수 있습니다. 호출의 결과로 함수는 값을 반환 할 수 있습니다 .

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값은 sloppy 모드에서 전역 객체가되거나 엄격 모드에서 정의되지 않습니다.

생성자로서 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. 그런 다음 거기에서 속성을 정의하고 모든 인스턴스에서 사용할 수 있도록 할 수 있습니다.

답변

객체 리터럴을 사용하여 다음과 같이 간단히 할 수 있습니다 .

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

답변

두 가지 스타일 모두 약간만 수정하면 작동합니다.

첫 번째 방법은 대부분의 경우 장단점이있는 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);

반면에 내가 올바르게 기억하면 다른 방법은 ‘Revealing Closure Pattern’이라고합니다.

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

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

답변

ES2016 JavaScript로이를 수행하는 최신 방법

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

답변

나는 그 지시를 의미합니다.

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

답변