Array

Sobre o laço de repetição for:

Ele é composto de três espaços.

for(espaço1; espaço2; espaço3) {
// Aqui vão os comando que serão repetidos
}

O espaço1 determina a declaração da variável de controle. No exemplo é a variável i que começa valendo 0.

O espaço2 determina a condição para a repetição do laço. No exemplo, temos que no início de cada repetição, o for irá perguntar "a variável i vale menos que o número de elementos do array serie? Se vale, repetir o bloco". Na primeira repetição temos 0 < 4, depois 1 < 4, depois 2 < 4, depois 3 < 4. Quando atingirmos 4 < 4, temos uma comparação falsa, portanto o for irá interromper as repetições.

O espaço3 determina o incremento de i após cada repetição. Com i++ ele aumentará de 1 em 1 unidade.

Sendo assim repetiremos o desenho dos 4 retângulos para i valendo 0, 1, 2 e 3, que são os índices dos arrays.

Em relação a sua dúvida sobre o uso de "serie" no lugar de "serie2015" ou "serie2016", isso ocorre porque esse for está dentro de uma função. A palavra serie é usada como um parâmetro da função. Quando chamarmos a função o Javascript irá substituir o conteúdo da array que passarmos como parâmetro no lugar de "serie". Assim:

// Aqui o código é executado levando em conta a serie2015
desenhaBarra(50, 50, serie2015, cores, '2015');

// Aqui o mesmo código é executado levando em conta a serie2016
desenhaBarra(150, 50, serie2016, cores, '2016');

Espero ter ajudado, estou começando então ainda não sei muito bem os termos técnicos.

Valeu. Vou precisar praticar bastante isso tudo.