摘要JS 的、||不只是簡單返回 true/false存在短路運算并且返回原始值。前端開發(fā)中經常使用一、短路運算前置知識點真假轉換規(guī)則數(shù)字0默認視為false空字符串、null、undefined、NaN都屬于假值其余大多為真值。重要特性返回原始值和||不會一定返回布爾 true/false返回的是表達式本身原始的值不是單純布爾結果。短路含義滿足條件之后后面代碼不再執(zhí)行直接截斷。二、邏輯與找第一個假值語法表達式1 表達式2規(guī)則如果表達式 1 為假直接返回表達式 1表達式 2 不會執(zhí)行短路如果表達式 1 為真返回表達式 2鏈式連續(xù)a b c從左往右找遇到第一個假直接返回全部為真則返回最后一個表達式的值代碼示例// 左邊為真返回右邊的值 console.log(88 66); // 66 console.log(10 20); // 20 // 左邊是假值0直接返回0右邊66完全不執(zhí)行 console.log(0 66); // 0 // 左邊真值繼續(xù)看右邊右邊是假返回0 console.log(99 0); // 0 // 全部真值返回最末尾 console.log(10 20 30); //30一句話記憶找假一假就停全真返回最后一個。三、邏輯或||找第一個真值語法表達式1 || 表達式2規(guī)則如果表達式 1 為真直接返回表達式 1表達式 2 不會執(zhí)行短路如果表達式 1 為假才返回表達式 2鏈式連續(xù)a || b || c || d從左向右遇到第一個真值立刻返回全部都是假返回最右側最后一個表達式代碼示例// 第一個值50是真值直接返回50后面100不執(zhí)行發(fā)生短路 console.log(50 || 100); //50 // 第一個0是假無法短路返回后面100 console.log(0 || 100); //100 // 兩邊都是假值返回后面的空字符串 console.log(0 || ); // 四、 和 || 對比速查表表格運算符作用短路觸發(fā)條件鏈式運算行為邏輯與尋找第一個假值左邊表達式為假直接短路右邊不運行遇假停止全部為真返回最末尾值 邏輯或尋找第一個真值左邊表達式為真直接短路右邊不運行遇真停止全部為假返回最末尾值??關鍵點二者返回原始表達式的值不是單純 true、false。很多初學者誤以為運算結果只能是布爾這是高頻踩坑點。五、短路運算在業(yè)務中的實際用途||做兜底默認值// 如果name是假值就賦值匿名用戶 let name || 匿名用戶; console.log(name); //匿名用戶做簡單條件判斷// flag為true才執(zhí)行后面函數(shù) let flag true; flag console.log(條件成立才執(zhí)行);注意ES6 之后有??空值合并運算符專門處理null/undefined和||有區(qū)別不要完全混用。六、踩坑點短路滿足條件之后后面代碼完全不會執(zhí)行不要寫依賴執(zhí)行的邏輯放在短路后面。返回原始值不是 true/false。88 66得到 66而不是 true。一假即停||一真即停。假值集合0、、NaN、null、undefined、false這些在短路判斷中當作 false。短路運算是 JS 基礎中非常重要的知識點不僅面試?？既粘ｍ椖恐写罅亢唽懘a底層都是這套邏輯一定要理解短路截斷和返回原始值這兩個核心特性。