자바스크립트에서 'this' 키워드를 이용한 게임 랭킹 시스템 구현 방법

18 Sep 2023

javascript

자바스크립트를 사용하여 게임 랭킹 시스템을 구현하는 방법은 다양한 접근 방식이 있습니다. 이 중에서 ‘this’ 키워드를 이용하는 방법을 알아보겠습니다.

게임 랭킹 시스템 설계

우선, 게임 랭킹 시스템을 구현하기 위해 다음과 같은 설계를 고려해야 합니다:

플레이어의 이름과 점수를 저장하는 객체를 만듭니다.
플레이어가 게임을 플레이하고 점수를 얻을 때마다, 플레이어 객체에 점수를 업데이트합니다.
랭킹은 점수를 기준으로 정렬하여 보여주어야 합니다.

이제 코드에서 ‘this’ 키워드를 이용하여 게임 랭킹 시스템을 구현하는 방법을 살펴보겠습니다.

게임 랭킹 시스템 예제 코드

function Player(name) {
  this.name = name;
  this.score = 0;
}

Player.prototype.updateScore = function(score) {
  this.score += score;
}

function RankingSystem() {
  this.players = [];
}

RankingSystem.prototype.addPlayer = function(player) {
  this.players.push(player);
  this.sortRanking();
}

RankingSystem.prototype.sortRanking = function() {
  this.players.sort((a, b) => b.score - a.score);
}

RankingSystem.prototype.getRanking = function() {
  return this.players.map((player, index) =>
    `Rank ${index + 1}: ${player.name} (Score: ${player.score})`
  );
}

// Example usage
const rankingSystem = new RankingSystem();

const player1 = new Player('John');
const player2 = new Player('Emily');
const player3 = new Player('Mike');

player1.updateScore(100);
player2.updateScore(200);
player3.updateScore(150);

rankingSystem.addPlayer(player1);
rankingSystem.addPlayer(player2);
rankingSystem.addPlayer(player3);

console.log(rankingSystem.getRanking());

위의 예제 코드에서는 ‘Player’와 ‘RankingSystem’이라는 두 개의 클래스를 사용하여 게임 랭킹 시스템을 구현하였습니다. ‘Player’ 클래스는 플레이어의 이름과 점수를 저장하고 업데이트하는 역할을 합니다. ‘RankingSystem’ 클래스는 플레이어 객체를 관리하고 랭킹을 정렬하여 보여주는 역할을 합니다.

이제 ‘Player’ 객체를 생성하고 점수를 업데이트한 후, ‘RankingSystem’ 객체에 플레이어를 추가하여 랭킹을 확인할 수 있습니다.

위의 코드를 실행하면 다음과 같은 결과가 출력됩니다:

Rank 1: Emily (Score: 200)
Rank 2: Mike (Score: 150)
Rank 3: John (Score: 100)

이와 같이 ‘this’ 키워드를 이용하여 자바스크립트에서 게임 랭킹 시스템을 구현할 수 있습니다. 이를 기반으로 추가적인 기능을 구현하거나 UI와 연동하여 사용자에게 보기 좋은 랭킹 시스템을 제공할 수 있습니다.

#게임랭킹 #자바스크립트