// 場景1：用戶沒填姓名
const userName = undefined;
console.log(userName.length); // 報錯！Cannot read properties of undefined

// 場景2：接口返回空數(shù)據(jù)
const apiResponse = null;
console.log(apiResponse.data); // 報錯！Cannot read properties of null

let name;
console.log(name); // undefined

let user = null; // 表示“用戶不存在”

if (variable === null || variable === undefined) {
  console.log('變量為空');
}

function getUserProfile(user) {
  if (user === null || user === undefined) {
    return '用戶不存在';
  }
  return `歡迎，${user.name}`;
}

if (variable == null) {
  console.log('變量為空');
}

if (!variable) {
  console.log('變量為falsy值');
}

// 這些值都會被判斷為"空"
!false      // true
!0         // true  
!""        // true
!NaN       // true

// 實際開發(fā)中的坑
const count = 0;
if (!count) {
  console.log('計數(shù)為0'); // 這里會執(zhí)行，但可能不是我們想要的
}

if (typeof variable === 'undefined' || variable === null) {
  console.log('變量是空的！');
}

// 如果變量根本沒聲明，前兩種方法會報錯
if (notDeclaredVariable == null) { // 報錯！ReferenceError
}

if (typeof notDeclaredVariable === 'undefined') { // 正常運行！
  console.log('變量未定義');
}

// 傳統(tǒng)寫法
const name = username ? username : '匿名用戶';

// 現(xiàn)代寫法
const name = username ?? '匿名用戶';

// 以前的痛苦寫法
const street = user && user.address && user.address.street;

// 現(xiàn)在的優(yōu)雅寫法
const street = user?.address?.street;

const street = user?.address?.street ?? '地址未知';

// 推薦
if (value == null) {
  // 處理空值
}

// 或者
const safeValue = value ?? defaultValue;

if (value === null) {
  console.log('明確設(shè)置為空');
}

if (value === undefined) {
  console.log('未定義');
}

// 安全訪問深層屬性
const phone = order?.customer?.contact?.phone ?? '未填寫';

function createUser(name, age = 18) {
  // age參數(shù)只在undefined時使用默認(rèn)值
  return { name, age };
}