Есть ли разница между typeof x === 'undefined' и if (x)

На мой взгляд, есть как минимум два отличия:

1. Проверка типа как неопределенного проверяет только неопределенность, в отличие от if (x), который проверяет любые истинные значения (например, true, непустую строку, ненулевое число и т. д.)
2. Вы можете выполнять typeof с несуществующими переменными даже в строгом режиме. Вы получите справочную ошибку, если никогда не объявляли x и делали if (x)

"use strict";

const a = undefined;
const b = "truthy value";

if (a) {
  console.info("a in if"); // never executes
}
if (typeof a !== "undefined") {
  console.info("a with typeof"); // never executes
}

if (b) {
  console.info("b in if"); // executes
}
if (typeof b === "undefined") {
  console.info("b with typeof"); // never executes
}


try {
  if (c) console.info("this should error");
} catch(e) {
  console.info("Can't access non-existent variable");
}

console.info("No error:", typeof c);

Когда я должен использовать какой?

Вообще:
Используйте if (x), когда...

• Вы проверяете логическое значение
• Вы проверяете на (нет) 0
• Вы проверяете непустую пустую строку (возможно, вместо этого используйте if (string.length))
• Проверка возвращаемого значения функции (например, функция возвращает null, когда нет результата для запроса или объекта, когда он есть (функции DOM, такие как document.getElementById, возвращают null, когда элемент с таким идентификатором не существует))

Используйте if (typeof x !== "undefined"), когда...

• Вы проверяете, существует ли ключ объекта (if (typeof obj.key !== "undefined")) (правильный способ, как указал комментатор, с Object.hasOwn(obj, "ключ"))
• Вы проверяете, существует ли переменная (хотя не уверен, когда и почему вы это сделаете)
• Проверка того, был ли передан аргумент
• Другое использование, например, когда вы пишете сервер Express и проверяете пользовательский контент.
• Что-то еще, наверное, забыл...

Полезно иметь в виду, что Javascript динамически типизируется, даже если он выглядит как просто переменные. В JS есть несколько типов, и Undefined (с заглавными буквами) — один, и единственное значение, которое он может содержать, — это undefined. Подумайте об этом, как если бы вы сказали, что у вас есть тип Number, и он принимает только 42. Это важно знать, потому что движки JS должны соблюдать спецификацию.

Тип Undefined имеет ровно одно значение, называемое undefined. Любая переменная, которой не присвоено значение, имеет значение undefined.

В коде приложения много вариаций, но вы можете знать, что переменные, которые не были назначены, имеют тип Undefined со значением undefined, а не что-то еще. Рядом с Undefined стоит Null, который имеет единственное значение, null. Null, в отличие от Undefined, необходимо присваивать.

В спецификации вы также найдете таблицу результатов, которые вы получаете для каждого типа переменной.

Вы заметите, что Undefined имеет свое собственное возвращаемое значение, а также логическое значение, но Null возвращает «объект», который, как сообщается, является ошибкой в ​​исходной спецификации, от которой мы не можем избавиться.

Избавившись от типов, мы подошли к логическому приведению, то есть к тому, как операторы if обрабатывают условие. В спецификации есть таблица случаев, которые определяют, когда значение должно быть приведено к истинному или ложному.

Вы увидите, что предложение if получает тип Undefined и возвращает false. То же самое происходит с Null. Есть несколько других случаев, которые также могут возвращать false, даже если они не являются Undefined или Null.

1. Тип Number со значениями 0, -0, NaN
2. Тип String с длиной 0 ("")
3. Тип BigInt со значением 0

Как уже ответили другие, приложения спецификации поступают в нескольких разных местах. Причины существования typeof и совпадения с ложной оценкой связаны с тем, как движки JS обрабатывают значения и выполняют преобразование в логическое значение.