私のjavascript配列に表示される特定されていない値

Question

私は小さなゲームを作成しており、一定の時間間隔で押されたキーを収集するコードがあります。

var pressedKeys = []; 

setTimeout(function() { 
    for(var i = 0; i < pressedKeys.length; i++) 
    alert("Time is up you have inputed " + pressedKeys[i] + " length " + pressedKeys.length); 
}, 3000); 

$(document).keydown(function(evt) { 
    var key = evt.keyCode; 
if (pressedKeys.length < 1) { 
    pressedKeys[0] = key; 
} else { 
    pressedKeys[pressedKeys.length + 1] = key; 
} 
}); 

私はjavascriptを使い慣れていないため、なぜ配列に未確認の値があるのか​​理解できません。面白いのは、私がforeachを使ってループを行うと、私は未確認の値を得られないということです。

これを私に説明してください。私はとても感謝しています。配列インデックスは、ゼロベースているので

Answer 1

この...

pressedKeys[pressedKeys.length + 1] = key; 

この...

pressedKeys[pressedKeys.length] = key; 

---

であるべきで、アレイ内の現在の最後の項目は、そのlength - 1なりつまり、次に入力する項目は、.lengthになります。あなたが実際にif声明を取り除くことができます

---

...

$(document).keydown(function(evt) { 
    pressedKeys[pressedKeys.length] = evt.keyCode; 
}); 

それは0の.lengthから始まり、その最初のエントリは.lengthが同じになり、インデックス0、になります1になるため、次のエントリはインデックス1になります。

Answer 2

このため、

} else { 
    pressedKeys[pressedKeys.length + 1] = key; 
} 

lengthプロパティは配列の長さを返します。配列はゼロベースなので、length番目のインデックスを参照するときは、存在しない要素を参照しています。
位置をlength + 1に追加すると、最後の既存の要素と新しい要素の間にギャップが作成されます。

これが起こる：

var pressedKeys = []; 
var length = pressedKeys.length; // Equal to zero, 0 
pressedKeys[length + 1] = key; // Inserts key at position 0 + 1 = 1 
// result: pressedKeys = [undefined, key] 

がpush方法を+1を追加したり、使用しないで、問題を解決するために：これは、実際の要素をスキップします

pressedKeys.push(key); 

Answer 3

pressedKeys[pressedKeys.length + 1] = key; 

。配列はゼロインデックスされます。

あなたは、アレイ内の3つの要素があるとしましょう、彼らは次のようになります。

• pressedKeys[0]
• pressedKeys[1]
• pressedKeys[2]

その線が走っているときpressedKeys.lengthは、このように、3になります値をpressedKeys[4]に挿入します。これによりpressedKeys[3]は未定義になります。

行はpressedKeys[pressedKeys.length] = keyである必要があります。また、長さを使用しないでください。pushを配列に追加することをお勧めします。

$(document).keydown(function(evt) { 
    var key = evt.keyCode; 
    pressedKeys.push(key); // this will add to the end of the array, 
          // no need to calculate the position 
});