Für jede Eigenschaft innerhalb eines Objekts

Ich habe dieses Objekt gemacht, um verschiedene Optionen in meinem Spiel zu behandeln.Für jede Eigenschaft innerhalb eines Objekts

var options = 
{ 
    Option: function(name, value, shortcut) 
    { 
     this.name = name; 
     this.value = value; 
     this.shortcut = shortcut; 
     this.texte = createElement("span",this.name + " : " + this.shortcut + "<br />"); 
     this.texte.parent("options"); 
     this.texte.id(this.name); 
    }, 

    toggle: function(shortcut) 
    { 
     for (var o in this) 
     { 
      console.log(o); 
      console.log(o.shortcut); 
      if (o.shortcut == shortcut) 
      { 
       o.value = !o.value; 
       if (o.value) 
       { 
        o.texte.style("fontWeight","bold"); 
        o.texte.style("color","green"); 
       } 
       else 
       { 
        o.texte.style("fontWeight","normal"); 
        o.texte.style("color","red"); 
       } 
       addText("Toggled"+ o.name); 
      } 
     } 
    }, 

    initiate: function() 
    { 
     this.randomSpeed = new this.Option("Random Speed", true,"R"); 
     //this.randomSpeed.show(); 
     this.oneBall = new this.Option("Spawn one ball", false,"O"); 
     //this.oneBall.show(); 
     this.gravity = new this.Option("gravity", false,"G"); 
     //this.gravity.show(); 
     this.collision = new this.Option("Collision", false,"C"); 
     //this.collision.show(); 
     this.paintBackground = new this.Option("Paint mode",false,"P"); 
     //this.paintBackground.show(); 
     this.wall = new this.Option("Wall Collision", false,"W"); 
     //this.wall.show(); 
     this.unstuck = new this.Option("Unstuck", false,"U"); 
     //this.unstuck.show(); 
     this.blow = new this.Option("Mouse blow", false,"B"); 
     //this.blow.show(); 
     this.attraction = new this.Option("Mouse Attraction", false,"A"); 
     //this.attraction.show(); 
     this.superAttraction = new this.Option("Super attraction", false,"A"); 
     //this.superAttraction.show(); 
    } 
};

Ziel war es, all differents Möglichkeiten des Spiels in einer Art und Weise zu handhaben, dass ich neue Optionen später und mit dem gleichen Code hinzufügen kann, die bereits vorhanden ist.

Ich benutze die Creator-Funktion Option (innerhalb der Hauptobjektoptionen), um neue Optionen zu installieren, wenn ich sie in das Spiel implementiere.

mein Problem ist mit der for (var o in this) Schleife.

console.log(o); gibt mir die Ausgabe I

"Option" "Toggle" "initiieren" "randomSpeed" "oneBall" "Schwerkraft" "Kollision" "Paintbackground" "Wand" "unstuck" „Schlag erwarten " "Attraktion" "superAttraction"

aber dann console.log(o.shortcut); kehrt irgendetwas nicht! Ich habe in der console of my browser eingecheckt, das Objekt existiert, und ist korrekt instanziiert

Vielen Dank!

----------------------------

Außerdem bin ich zum Beispiel dieser Art von Design suchen, aber ich konnte nichts in der Nähe finden. Hast du ein Beispiel, auf das ich mich beziehen kann? Ich bin wirklich neugierig zu sehen, wie es normalerweise gemacht wird.

Quelle

2017-01-11 Albizia

Kann Sie eine funktionierende jsfiddle oder eine URL in dem der Code – GraveyardQueen

entfaltet Dies ist die aktuelle Version http://gosuness.free.fr/ballsOptions/ Dies ist die neueste Arbeitsversion http://gosuness.free.fr/balls/ – Albizia

Die Art und Weise der Verweis auf das Mitglied der dieses Objekt ist falsch gemacht worden ist

Im Code for (var o in this) die Variable o auf den Index des Elements in dem this Objekt so um den Bezug zu nehmen befassen Artikel Sie würden es nennen this[o] wie zu verwenden, wenn mit Bezug eines Arrays, wie unten gezeigt,

for (var o in this) 
    { 
     console.log(this[o].shortcut); 
     if (this[o].shortcut == shortcut) 
     { 
      this[o].value = !this[o].value; 
      if (this[o].value) 
      { 
       this[o].texte.style("fontWeight","bold"); 
       this[o].texte.style("color","green"); 
      } 
      else 
      { 
       this[o].texte.style("fontWeight","normal"); 
       this[o].texte.style("color","red"); 
      } 
      addText("Toggled"+ this[o].name); 
     } 
    }

nachfolgend finden Sie eine Arbeits Schnipsel, es nicht alle Features des Spiels enthält oder den Code, aber es enthält den Code erklärt oben und wenn Sie die Konsole überprüfen, wird der Verknüpfungswert prin sein rechts ted

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
<meta charset="ISO-8859-1"> 
 
<title>Insert title here</title> 
 
</head> 
 
<body> 
 

 
\t \t <div id="game"> 
 
\t \t </div> 
 
\t \t <aside> 
 
\t \t \t <p> 
 
\t \t \t \t Spawn ball: <br/> 
 
\t \t \t \t remove balls: <br/> 
 
\t \t \t \t reset:<br /> 
 
\t \t \t </p> 
 
    \t \t \t <p id="options"> 
 
    \t \t \t \t <span id="randomSpeed">Random velocity:<br /></span> 
 
\t \t \t \t <span id="oneBall">Spawn one ball:<br /></span> 
 
\t \t \t \t <span id="gravity">Gravity:<br /></span> 
 
\t \t \t \t <span id="collision">Collision:<br /></span> 
 
\t \t \t \t <span id="unstuck">Unstuck balls:<br /></span> 
 
\t \t \t \t <span id="paintBackground">PaintMode:<br /></span> 
 
\t \t \t \t <span id="wall">Walls:<br /></span> 
 
\t \t \t \t <span id="blow">Mouse Blow:<br /></span> 
 
\t \t \t \t <span id="attraction">Mouse attraction:<br /></span> 
 
\t \t \t \t <span id="superAttraction">Super attraction:</span> 
 
\t \t \t \t <br /> 
 
\t \t \t \t <br /> 
 
\t \t \t </p> 
 

 
\t \t </aside> 
 
\t \t <input type="text" onkeypress="keyPressed(event)"> 
 

 
<script> 
 
var options = 
 
{ 
 
\t Option: function(name, value, shortcut) 
 
\t { 
 
\t \t this.name = name; 
 
\t \t this.value = value; 
 
\t \t this.shortcut = shortcut; 
 
\t }, 
 
\t 
 
\t toggle: function(shortcut) 
 
\t { 
 
\t \t for (var o in this) 
 
\t \t { 
 
\t \t \t console.log(this[o].shortcut); 
 
\t \t \t if (this[o].shortcut == shortcut) 
 
\t \t \t { 
 
\t \t \t \t this[o].value = !this[o].value; 
 
\t \t \t \t if (this[o].value) 
 
\t \t \t \t { 
 
\t \t \t \t \t this[o].texte.style("fontWeight","bold"); 
 
\t \t \t \t \t this[o].texte.style("color","green"); 
 
\t \t \t \t } 
 
\t \t \t \t else 
 
\t \t \t \t { 
 
\t \t \t \t \t this[o].texte.style("fontWeight","normal"); 
 
\t \t \t \t \t this[o].texte.style("color","red"); 
 
\t \t \t \t } 
 
\t \t \t \t addText("Toggled"+ this[o].name); 
 
\t \t \t } 
 
\t \t } 
 
\t }, 
 
\t 
 
\t initiate: function() 
 
\t { 
 
\t \t this.randomSpeed = new this.Option("Random Speed", true,"R"); 
 
\t \t //this.randomSpeed.show(); 
 
\t \t this.oneBall = new this.Option("Spawn one ball", false,"O"); 
 
\t \t //this.oneBall.show(); 
 
\t \t this.gravity = new this.Option("gravity", false,"G"); 
 
\t \t //this.gravity.show(); 
 
\t \t this.collision = new this.Option("Collision", false,"C"); 
 
\t \t //this.collision.show(); 
 
\t \t this.paintBackground = new this.Option("Paint mode",false,"P"); 
 
\t \t //this.paintBackground.show(); 
 
\t \t this.wall = new this.Option("Wall Collision", false,"W"); 
 
\t \t //this.wall.show(); 
 
\t \t this.unstuck = new this.Option("Unstuck", false,"U"); 
 
\t \t //this.unstuck.show(); 
 
\t \t this.blow = new this.Option("Mouse blow", false,"B"); 
 
\t \t //this.blow.show(); 
 
\t \t this.attraction = new this.Option("Mouse Attraction", false,"A"); 
 
\t \t //this.attraction.show(); 
 
\t \t this.superAttraction = new this.Option("Super attraction", false,"A"); 
 
\t \t //this.superAttraction.show(); 
 
\t } 
 
}; 
 

 
function keyPressed(e) 
 
{ 
 
\t if (String.fromCharCode(e.which) == " ") 
 
\t { 
 
\t \t \t balls.splice(0,balls.length); 
 
\t \t \t background(70,20,150); 
 
\t \t \t addText("Reset"); 
 
\t } 
 
\t else 
 
\t { 
 
\t \t console.log(""+String.fromCharCode(e.which)) 
 
\t \t options.toggle(String.fromCharCode(String.fromCharCode(e.which))); 
 
\t } 
 
} 
 

 

 
options.initiate(); 
 

 
</script> 
 
</body> 
 
</html>

Quelle

2017-01-11 11:00:40 GraveyardQueen

Es funktioniert wie ein Charme! Wie heißt es, wenn Sie Klammer zu einem Objekt wie Sie mit einem Array verwenden würden? Ich bin ziemlich neu in Javascript, das habe ich noch nicht gelernt. – Albizia

So holen wir Objekte aus einem Array – GraveyardQueen

Also, wenn Sie 'für (x in blabla)' tun, wird blabla immer als ein Array betrachtet? – Albizia

Für jede Eigenschaft innerhalb eines Objekts

Antwort

Verwandte Themen