Назначение с двойным амперсандом "&&"

Я просто видел, как кто-то использовал этот кусок кода:

ctx = canvas.getContext && canvas.getContext('2d');

Как работает двойной амперсанд в этом контексте? Разве это не просто присваивало бы "true" переменной ctx?

Ответ 1

Это обычный способ убедиться, что ваша функция существует до ее вызова.

Он работает следующим образом (From developer.mozilla.com):

expr1 && expr2 Возвращает expr1, если его можно преобразовать в false; в противном случае возвращает expr2. Таким образом, при использовании с булевыми значениями && возвращает true, если оба операнда true; в противном случае возвращает false.

Другими словами, Javascript не принуждает операнды к логическим значениям, если это не нужно.

4 && 5 Возвращает 5, а не true.

В вашем случае, если первое выражение undefined (которое конвертируется в false), то ctx будет ложным, а второе выражение не будет оцениваться. Если первое выражение является функцией (которая не может быть преобразована в false), тогда Javascript оценивает второе выражение и присваивает значение переменной ctx.

Ответ 2

Он назначит возвращаемое значение canvas.getContext('2d') на ctx, если canvas.getContext - фактически функция.

Часть слева - это просто, чтобы избежать ошибки. Он гарантирует, что canvas имеет свойство getContext, прежде чем пытаться вызвать getContext(). Таким образом, код не будет вызывать canvas.getContext(), если функция не существует. Если он не проверял сначала и вызывал, когда функция не существовала, в консоль регистрируется ошибка, и выполнение останавливается.