Real-Time 3D Graphics with WebGL 2 - Second Edition

Vector Components

We can refer to each one of the components of an ESSL vector by its index. For example, uLightColor[3] will refer to the fourth element of the vector (zero-based vectors). However, we can also refer to each component by a letter, as demonstrated in the following table:

{ x, y, z, w }	Useful when accessing vectors that represent points or vectors.
{ r, g, b, a }	Useful when accessing vectors that represent colors.
{ s, t, p, q }	Useful when accessing vectors that represent texture coordinates.

For example, if we want to set the alpha channel (fourth component) of our uLightColor variable to 1.0, we can do so by writing in any of the following formats:

uLightColor[3] = 1.0;uLightColor.w = 1.0;uLightColor.a = ...