JavaScriptの「??」と「||」と「&&」の違い

Ⅰ. はじめに

タイトルの通り「JavaScriptの「??」と「||」の違い」です。

Ⅱ. サンプルプログラム

const value1 = null
const value2 = undefined
const value3 = ''
const value4 = 0
const value5 = 1
const value6 = 123

// Null 合体演算子 ??
console.log(value1 ?? 'default value') // 'default value'
console.log(value2 ?? 'default value') // 'default value'
console.log(value3 ?? 'default value') // ''
console.log(value4 ?? 'default value') // 0
console.log(value5 ?? 'default value') // 1
console.log(value6 ?? 'default value') // 123

// 論理和 ||
console.log(value1 || 'default value') // 'default value'
console.log(value2 || 'default value') // 'default value'
console.log(value3 || 'default value') // 'default value'
console.log(value4 || 'default value') // 'default value'
console.log(value5 || 'default value') // 1
console.log(value6 || 'default value') // 123

// 論理積 &&
console.log(value1 && 'default value') // null
console.log(value2 && 'default value') // undefined
console.log(value3 && 'default value') // ''
console.log(value4 && 'default value') // 0
console.log(value5 && 'default value') // 'default value'
console.log(value6 && 'default value') // 'default value'