Tentei transformar a criação de triangulos em uma função, ficou assim:
<canvas width="600" height="400"> </canvas>
<script>
var tela = document.querySelector("canvas");
var pincel = tela.getContext("2d");
function triangulo(cor,x_1,y_1,x_2,y_2,x_3,y_3){
pincel.fillStyle = cor;
pincel.beginPath();
pincel.moveTo(x_1, y_1);
pincel.lineTo(x_2, y_2);
pincel.lineTo(x_3, y_3);
pincel.fill();
}
triangulo("black", 50, 50, 50, 400, 400, 400);
triangulo("white", 100, 175, 100, 350, 275, 350);
</script>
Se tiverem alguma sugestão de como melhora-lo, por favor compartilhe logo abaixo. :)