想法：

要使用Javascript / jQuery创建基于文本的游戏，游戏将是讲述故事的游戏，然后您可以选择选项。

我的想法是使用textarea来允许用户输入（选择一个选项）和输出文本（来自故事）。

我有多远？

这就是我到目前为止所创造的。

的JavaScript / jQuery的：

var current, text, location, option1, option2;
location = ''; // house, car, moon
current = 0;
gameOver = false;
pick = false;

jQuery("textarea").keypress(function (e) {
    if (e.which == 13) {
        var content = this.value;
        var lastLine = content.substr(content.lastIndexOf("\n") + 1);

        // Story
        if (current == 0 && pick == false) {
            option1 = 'Look around';
            option2 = 'Check you have arms (Check arms)';
            text = 'You open your eyes \n\nOptions: \n' + option1 + '\n' + option2;
            pick = true;

        } else if (current == 0 && lastLine == 'Check arms' && pick == true) {
            text = 'You check your arms, they seem fine';
            pick = false;
        } else if (current == 0 && lastLine == 'Look around' && pick == true || current == 2 && lastLine == 'Get Out') {
            option1 = 'Walk to a nearby house';
            option2 = 'Get in a rocket that is next to you (Get in rocket)';
            text = 'You do a 360 spin, you see you have limited options \n\nOptions: \n' + option1 + '\n' + option2;
            pick = false;
            if (current == 2 && lastLine == 'Get Out') {
                current = 1;
            } else {
                current++;
            }
        }

        //House Story
        else if (current == 1 && lastLine == 'Walk to house' && pick == false) {
            option1 = 'Knock on the front door';
            option2 = 'Jump through the front window';
            text = 'You walk to the house and see there are no lights on, the building is old and appears to be burnt out\n\nOptions: \n ' + option1 + '\n ' + option2;
            pick = false;
            current++;
        }

        // Rocket story
        else if (current == 1 && lastLine == 'Get in rocket' && pick == false) {
            option1 = 'Get out of the rocket(Get out)';
            option2 = 'Hit the biggest button you can find(Hit Button)';
            text = 'You hop into the rocket, there are a lot of buttons infront of you\n\nOptions: \n ' + option1 + '\n ' + option2;
            pick = false;
            current++;
        }

        $('textarea ').val($('textarea ').val() + '\n\n ' + text + '\n ');
    }
});

它的工作原理（有点），但这样的代码变得越来越复杂。对我来说它非常混乱，我试图重新编写它，但我找不到一种方法来使这个整洁/更容易编码。

看看演示：

如果你想尝试帮助我，请看看演示，因为你会很好地了解我想要实现的目标。

演示演练：

DEMO HERE

在textarea点击enter to start
在游戏中键入其中一个选项（选项：检查手臂或环顾四周）
在游戏中键入其中一个选项（选项：步行到附近的房子或进入火箭）
演示结束

注意：输入选项后，单击“输入”继续。目前，所有选项都必须完全按照所示类型输入（如果选项包含括号，则输入该选项）

这是一个简短的演示，但你应该明白这一点。我已经四处搜索，无法找到/想出一个合适的方法来编写这个游戏。

说到问题是什么？

我的问题是：是一种合适的方法来编写这个游戏？

适合：易于维护/阅读+添加新故事“部分”等。

Answer 1

我会选择某种策略模式。创建即游戏构造函数

var Game = new function(strategy) {
    this.strategy = strategy;
}

Game.prototyp.playScene = function() {
    return this.strategy();
}

然后您可以创建scenes放置逻辑的位置

var sceneOne = function() {
    console.log('First scene logic here');
}

var sceneTwo = function() {
    console.log('Second scene logic here');
}

最后你可以按如下方式调用这些逻辑：

var game;
if(e.which == 13) {
    if(condition1) {
        game = new Game(sceneOne);
    } else {
        game = new Game(sceneTwo);
    } 

    game.playScene();
}

fiddle

Answer 2

我在这里看到的最大问题是，随着游戏/故事的扩展，您的代码将会不断发展壮大。你实际上是在代码本身中编写游戏逻辑。

作为替代方案，我建议将您的逻辑拆分为步骤和逻辑。例如：

var allTiles = 
[
  {location: 'Forest', description: 'Deep, dark and scary'},
  {location: 'Castle', description: 'High, made from stone and very dramatic'},
];

var currentState = 
{
  equipment: ['Sword', 'Bow', '3 gold coins'];
  currentLocationIndex: 0
};

这些当然可以在不同的文件中，因此您可以向您的世界添加位置。

接下来你需要你的核心逻辑类，这看起来很像你已经拥有的那个：

jQuery("textarea").keypress(function (e) {
    var currentLocation = allTiles[currentState.currentLocationIndex];
    printDescription(currentLocation.Description);


   // process commands... into pseudo code territory
   if(userDoesAction1){
     currentLocation.doAction1();
   }
}

我在这里没有详细介绍 - 它在很大程度上取决于游戏的结构。就个人而言，我喜欢在你所在的位置创建一个数组函数的想法，这是你可以在你的位置做的事情......实际上，JS是一种非常好的语言来做这种游戏！

Answer 3

您可以使用我的jQuery terminal。然后，您可以编写对JSON对象中的数据起作用的游戏核心。如果您编写类似这样的内容，您将能够更改数据（更新或替换）而无需更改代码，它称为数据驱动编程（Eric Raymond写得很好chapter in his book about it）

Answer 4

制作游戏时，我认为面向对象的方法最好是将事物分开并易于编码和查找：

例如，您可以在不同的功能结构中分离游戏中的不同房间。

var parentFunction = function(){

  var protectedValue = ‘variable’;

  var childFunction = function(){

    alert(protectedValue);

  }

  childFunction();

}
var object = new parentFunction();

每次移动到相关环境时都会初始化该功能，并将玩家可以执行的操作放在子功能中。但我想这里的答案太大了：你应该花一些时间开始制定你的游戏将遵循的逻辑方案，以及你希望如何分离事物（以及它们如何相互关联）。

创建基于文本的游戏的更好方法

想法：

我有多远？

看看演示：

说到问题是什么？

4 个答案: