Ele coloca pincel.fillRect(400, 0, 200, 400); Eu achava que (400, 0, 600, 400) faria mais sentido, e funciona. não entendi pq ele coloca 200 na posição final do x, sendo que o 0 (zero) fica do lado esquerdo, ele iria cobrir o verde, não?
Você está vendo a versão anterior da nova experiência da Alura que estamos preparando para você. Em breve, ela ganha uma identidade visual novinha totalmente pensada em potencializar seus estudos!
Ele coloca pincel.fillRect(400, 0, 200, 400); Eu achava que (400, 0, 600, 400) faria mais sentido, e funciona. não entendi pq ele coloca 200 na posição final do x, sendo que o 0 (zero) fica do lado esquerdo, ele iria cobrir o verde, não?
Oi Renata, eu entendi da seguinte maneira. O 200 não é a posição inicial do x, na verdade é o primeiro 400 a posição de X então é a partir dai que o pincel vai começar a preencher, a posição 0 é de y que não precisa alterar, pois a altura é a mesma (400), o 200 é o tamanho que será preenchido de vermelho. O 600 funciona pq ele é maior que 200 então a "tinta" meio que "vasa" da tela e não vemos isso pois o limite de largura é 200 (a partir do eixo X 400). Se você aumentar a largura total para 800 por exemplo e aumentar também a cor "lightgrey" para 800, vai dar para entender melhor.
pincel.fillStyle = "lightgrey"; pincel.fillRect(0, 0, 800, 400);
Desculpa se não expliquei muito bem, pensei bastante na sua dúvida para entender também.