配列を反転する（色の形）

Question

私は現在、5種類の色を持つ配列を持っています。これらの色をループして形状にして表示するforループがあります。

var canvas = document.getElementById('canvas'); 
var gc = canvas.getContext('2d'); 

var xPos = 25; 
var yPos = 25; 

var colourArray = []; 
    colourArray[0] = 'red'; 
    colourArray[1] = 'yellow'; 
    colourArray[2] = 'blue'; 
    colourArray[3] = 'magenta'; 
    colourArray[4] = 'green'; 

for(var count = 0; count < 5; count++){ 
    myColour = colourArray[count]; 
    xPos = 20+70*count; 
    gc.beginPath(); 
    gc.rect(xPos, yPos, 50, 50); 
    gc.fillStyle = myColour; 
    gc.fill(); 
}  

私の人生のために、私はこれを逆にする方法を考えようとしていますので、緑色の最初と最後の赤色が表示されます。

Answer 1

アクセスするインデックスを配列の長さに基づいて配列から変更するだけです。最初の反復で配列の最後のアイテム（この場合は4）を取得し、最後の反復でインデックス0のアイテムを取得したいとします。このコードは、あなたが持っている色の数に関係なく機能しますcolourArrayに：あなたはグーグルの配列reverse` `を入力

var length = colourArray.length; 

for (var i = 0; i < length; i++) { 
    myColour = colourArray[length - (i + 1)]; 
    xPos = 20+70*i; 
    gc.beginPath(); 
    gc.rect(xPos, yPos, 50, 50); 
    gc.fillStyle = myColour; 
    gc.fill(); 
} 

Answer 2

var colourArray = []; 
colourArray[0] = 'red'; 
colourArray[1] = 'yellow'; 
colourArray[2] = 'blue'; 
colourArray[3] = 'magenta'; 
colourArray[4] = 'green'; 

colourArray =colourArray.reverse();