Explicação de De repente
Objetivo deste desafio: Faça com que as caixas fiquem mais leves, fixando a função lighter
.
Passo a passo da solução: Primeiro, vamos entender todas as partes deste programa. Há duas funções, darker
e lighter
, que recebem um object
e devolvem uma versão mais escura ou mais clara desse objeto. Depois há um monte de chamadas de função aninhadas - dê uma olhada na primeira: drawBox(darker(darker(rgbObject)))
. Se iniciar pelos parênteses internos você começa com um rgbObject
que escurece, depois escurece novamente e depois essa versão escura da cor original é colocada na drawBox
. É possível ver que quando você começa, as três primeiras caixas ficam menos escuras, mas depois para. As duas últimas chamadas drawBox
estão usando a função lighter
para tentar tornar as caixas mais claras. Vamos descobrir por que a função darker
funciona, mas a função lighter
não funciona. As duas funções vão receber uma informação e a armazenarão em object
. Então em cada componente (vermelho, verde, azul) é adicionado ou subtraído 50. Esse novo número é armazenado nas propriedades vermelha, verde e azul do newObject
. Isso significa que newObject
tem o objeto escurecido ou clareado! Em seguida, uma variável é gerada a partir da função usando a palavra-chave return
. Deve ser o newObject
que é retornado, e é aí que a função lighter
apresenta uma falha.
Solução do código de exemplo:
function darker(object) {
var newObject = {
red: object.red - 50,
green: object.green - 50,
blue: object.blue - 50
};
return newObject;
}
function lighter(object) {
var newObject = {
red: object.red + 50,
green: object.green + 50,
blue: object.blue + 50
};
return newObject;
}
drawBox(darker(darker(rgbObject)));
drawBox(darker(rgbObject));
drawBox(rgbObject);
drawBox(lighter(rgbObject));
drawBox(lighter(lighter(rgbObject)));
Conceitos de JavaScript: Expressão binária (+, -), Bloco de código (função), Funções de chamada, Aninhamento de chamadas, Identificadores
Conceitos do Grasshopper: drawBox()
Código Adicional (código oculto executado antes do código do desafio):
var rgbObject = {
red : 25,
green : 25,
blue : 175
};