javascript - 使用 JSON 更改显示的数字或字符串？

Question

(免责声明:这是我第一次在这里发帖，所以如果我犯了错误，请纠正我!)我正在为桌面 Angular 色扮演游戏制作一个 Angular 色生成器，我想让用户选择一个 Angular 色种族(半人马、 Sprite 、人类等)。选择后，我怎样才能让所选种族改变玩家 Angular 色的其他变量，例如初始统计数据(例如增加力量或敏捷度)或特殊技能？

我当前的 HTML5 端代码:

<form>

<label>Enter Character Name:</label>
      <!-- Input character name in text field. Name is recorded to JSON variable. -->
      <input type="text" id="pcName" name="pcName" required onchange="setName(name)"/>

<label>Select Race: </label>
   <!-- Select Race from dropdown menu. On selection, stats/skills/magic are changed.
    Also adds racial skills/abilities to proper fields. -->
 <select id = "raceList" name="raceList" required onchange="setRace(name)">
 <option name="Centaur" id="Centaur">Centaur</option>
 <option name="Elf" id="Elf">Elf</option>
 <option name="Fae" id="Fae">Fae</option>
 <option name="Human" id="Human">Human</option>
</select>
</form>

<label>Enter Attribute Points: </label>
    <!-- Enter stats for the character. Based on these numbers entered, attribute tables are altered.
      Check to ensure that the numbers entered are not invalid. Recorded to JSON variable. If there were points added from selecting a race, add them here.-->
<input type="text" id="Strength" name="Strength"/>
<input type="text" id="Dexterity" name="Dexterity"/>
<input type="text" id="Intellect" name="Intellect"/>
<input type="text" id="Knowledge" name="Knowledge"/>
<input type="text" id="Endurance" name="Endurance"/>

还有我的 JSON 代码，包含比赛数据和要记录 PC 数据的区域。选择比赛后，函数(此后的伪代码)解析 JSON 数据并根据需要进行更改。例如，“statModifiers”部分添加了额外的统计点(例如，选择半人马会让你 +10 力量)。

{"raceList": [

{"raceName": "Centaur", 
"raceAbilities": ["Large Size", "Speed"], 
  "raceCombatSkills": ["Deadly Charge", "Trample"],
  "statModifiers": [10, 0, 0, 0, 0], 
  "skillModifiers": [0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0], 
  "magicModifiers": [0,0,0,0]},

  {"raceName": "Elf", 
  "raceAbilities": [], 
  "raceCombatSkills": ["Archery"],
  "statModifiers": [0, 5, 10, 0, 0], 
  "skillModifiers": [0,0,0,10,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0], 
  "magicModifiers": [5,0,0,0]},

{"raceName": "Fae", 
  "raceAbilities": ["Silent Casting", "Cast While Moving"], 
  "raceCombatSkills": [],
  "statModifiers": [5, 0, 0, 0, 5], 
  "skillModifiers": [0,0,0,0,0,0,0,10,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,10,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0], 
  "magicModifiers": [15,0,0,15]},

 {"raceName": "Human", 
  "raceAbilities": [], 
  "raceCombatSkills": [],
  "statModifiers": [5, 5, 5, 0, 5], 
  "skillModifiers": [0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0], 
  "magicModifiers": [0,0,0,0]},

"pc": [
{"pcName": "name", 
    "pcRace": "race",
    "pcBuild": "build", 
    "pcStats": [5,5,5,5,5], 
    "pcSkills"[20,20,20,20,20,20,20,20,20,20,20,20,20,20,20,20,20,20,20,20,20,20,20,20,20,20,20,20,20,20,20,20,20,20,20,20,20,20,20,20,20],
    "pcArmor": [], 
    "pcItems": []}
] 

和 JavaScript 本身(或者更确切地说，代码应该做什么，因为我不确定要使用什么代码):

//Function that, on call, goes through the JSON array for a race object. Then, updates pcRace and pc object with appropriate data.
function setRace(race) {
    for (int i = 0; i < raceName.length; i++) {
        if (raceList.i.raceName === race) {
            pc.pcRace = race;
            //Parse JSON data from selected race here, modify "Attribute Points" and related numbers as well
            return;
        }
    }
}

Answer 1

就我个人而言，我会将您的 raceList 重新组织为一个从种族名称中删除的对象文字:

raceList = {"Fae" : { 
    "raceAbilities": ["Silent Casting", "Cast While Moving"], 
    "raceCombatSkills": [],
    "statModifiers": [5, 0, 0, 0, 5], 
    "skillModifiers": [0,0,0,0,0,0,0,10,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,10,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0], 
    "magicModifiers": [15,0,0,15] }, 
    { "Human" : { //... }
}

现在要找到相关的条目，我可以只键入名称而不是遍历数组:

function setRace(race){
    var raceStats = raceList[race];
}

但如果您做不到，那么搜索数组也可以。

现在要更新您的电脑，只需遍历 raceStats 中的修饰符并将它们添加到您的电脑，例如:

for(var i=0; i < pc.pcStats.length; i++) {
    pcStats[i] += raceStats.statModifiers[i];
}

等等……