// 場(chǎng)景1：用戶(hù)沒(méi)填姓名
const userName = undefined;
console.log(userName.length); // 報(bào)錯(cuò)！Cannot read properties of undefined

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

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

let user = null; // 表示“用戶(hù)不存在”

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

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

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

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

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

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

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

// 如果變量根本沒(méi)聲明，前兩種方法會(huì)報(bào)錯(cuò)
if (notDeclaredVariable == null) { // 報(bào)錯(cuò)！ReferenceError
}

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

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

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

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

// 現(xiàn)在的優(yōu)雅寫(xiě)法
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('未定義');
}

// 安全訪問(wèn)深層屬性
const phone = order?.customer?.contact?.phone ?? '未填寫(xiě)';

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