数组显示单个字符而不是完整项

时间:2017-10-22 09:26:51

标签: javascript jquery html

我不确定怎么说出标题。我现在已经试图解决这个问题几个小时了,这让我发疯了。对于我的第一个项目,我试图制作一个基于浏览器的文本游戏。问题在于库存项目如何添加到我的库存清单中。而不是

  • 两个

我正在

  • 0
  • 名词
  • ë
  • Ť
  • 瓦特
  • 0

等等。

它仍然添加了项目,但不是整个列表条目。该列表显示该字符具有的默认项目,只是在您选择了某些内容之后。

这是我的代码 -

JS脚本#1:

//change rooms
if (rooms[currentRoom].items !== undefined) {
Object.values(rooms[currentRoom].items).forEach(function(value) {
  $('#game-text').append("<p>" + value + "</p>");
});
} else {
$('#game-text').append("<p>You find nothing.</p>");
   }
}

//pick up items
function pickUp(item){
if (rooms[currentRoom].items[item] !== undefined) {
    inventory = inventory + item;
    $('#game-text').append("<p>A " + item + " has been added to your inventory.</p>");
} else {
    $('#game-text').append("<p>That is not a valid item.</p>");
}
}

//displays player commands
function showHelp() {
$('#game-text').append("<p>Here are the possible commands: </p>");
$('#game-text').append("<p><ul>");
for (var i = 0; i < commands.length; i++) {
    $('#game-text').append("<li>" + commands[i] + "</li>");
}
$('#game-text').append("</ul></p>");
}
//displays player inventory
function showInventory() {
if (inventory.length === 0) {
    $('#game-text').append("<p>You are not carrying anything!</p>");
    //return;
} else {
$('#game-text').append("<p>Here is your inventory: </p>");
$('#game-text').append("<p><ul>");
for (var i = 0; i < inventory.length; i++) {
    $('#game-text').append("<li>" + inventory[i] + "</li>");
}
$('#game-text').append("</ul></p>");
}
}

//converts player input to actions
function playerInput(input) {
var command = input.split(" ")[0];
switch (command) {
    case "go":
        var dir = input.split(" ")[1];
        changeRoom(dir);
        break;
    case "help":
        showHelp();
        break;
    case "inventory":
        showInventory();
        break;
    case "examine":
        examineRoom();
        break;
    case "pickup":
        var item = input.split(" ")[1];
        pickUp(item);
        break;
    default:
        $('#game-text').append("<p>Invalid command!</p>");
}
}

//Manipulates DOM (screen)
$(document).ready(function() {
$('#game-text').append("<p>" + rooms.start.description + "</p>");

$(document).keypress(function(key) {
    if (key.which === 13 && $('#user-input').is(':focus')) {
        var value = $('#user-input').val().toLowerCase();
        $('#user-input').val("");
        playerInput(value);

    }
})
})

在上一个脚本中,我相当确定问题在于pickUp function,showInventory function,或&#34; pickup&#34;案件。它是从这里得出的 脚本 -

JS脚本#2:

var rooms = {
"start": {
    "description": "You are in a dark, cold place and you see a light to 
<b>north</b>\
 and you hear the sound of running water to the <b>west</b>",
    "directions": {
        "north": "clearing1",
        "west": "bridge1"
    },
    "items": {
        "dagger": "You spot a rusty old dagger. Better than nothing I 
suppose.",
    },
},
"clearing1": {
    "description": "You arrive to a clearing, you see a lighthouse to the 
<b>north</b>\
 and there is a strange smell coming from the <b>east</b>",
    "directions": {
        "south": "start",
        "north": "lighthouse",
        "east": "trolls"
    },
    "items": {
        "shield": "You spot a worn leather shield."
    },
},
"lighthouse": {
    "description": "You arrive to the lighthouse and walk up to the door. A 
strange old lady\
 opens the door. What do you do?",
    "directions": {
        "south": "clearing1"
    }
},
"trolls": {
    "description": "You arrive to another clearing, there are some trolls 
roasting some mysterious meat\
 They haven't seen you yet. What do you do?",
    "directions": {
        "west": "clearing1"
    }
},
"bridge1": {
    "description": "You see a river and there is a bridge to the 
<b>west</b>",
    "directions": {
        "east": "start",
        "west": "bridge2"
    }
},
"bridge2": {
    "description": "You try to cross the bridge but a troll jumps out and 
bites your leg!",
    "directions": {
        "east": "bridge1"
    }
}
}

任何帮助或指导都会受到重视。提前致谢。

1 个答案:

答案 0 :(得分:2)

您的广告资源是string,您将其视为数组。

使用push并将您的广告资源声明为数组(它是全球性的)

inventory.push(item);

字符串具有length属性,它告诉我们字符串中有多少个字符。你可以迭代它们。这会导致代码中出现不需要的行为:

&#13;
&#13;
console.log("--String--");
    var inventory = "Hello world";
    for (var i = 0; i < inventory.length; i++)
    {
        console.log(inventory[i]);
    }
    
    //as opposed to:
    console.log("--Array--");
    
    var inventory = ["String one", "String two", "String three"];
    inventory.push("String four"); //use push to expand array
    for (var i = 0; i < inventory.length; i++)
    {
        console.log(inventory[i]);
    }
&#13;
&#13;
&#13;