反转一个数组（颜色形状）

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：

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();