一行代碼替代復雜邏輯！JavaScript 隱藏 API 讓效率翻倍

作者：story 2025-08-29 10:00:00

JavaScript 和現代瀏覽器已經為我們內置了許多強大而優雅的“隱藏”API，它們能用一行代碼就替代我們曾經需要數十行才能完成的復雜邏輯，讓代碼的可讀性和開發效率實現質的飛躍。

URL查詢參數解析

過去，要從一個URL中獲取查詢參數（如 id），我們通常需要使用正則表達式或一連串的 split 方法，代碼冗長且容易出錯。

// 以前的方式
function getQueryParam(url, param) {
 const search = url.split('?')[1];
 if (!search) { return null; }
 const params = search.split('&');
 for (let i = 0; i < params.length; i++) {
    const pair = params[i].split('=');
    if (pair[0] === param) { return decodeURIComponent(pair[1]); }
  }
 return null;
}

const url = 'https://example.com/page?id=123&category=tech';
const id = getQueryParam(url, 'id'); // "123"

現在，URLSearchParams 對象讓這一切變得無比簡單：

內置的 URLSearchParams 不僅代碼更短，而且在處理URL編碼、多個同名參數等邊緣情況時更加健壯可靠。

對象深拷貝

深拷貝是面試和工作中的常見痛點，最廣為人知但有缺陷的方法是 JSON.parse(JSON.stringify(obj))，它無法處理 Date 對象、undefined、等特殊類型。

const original = {
  birth: new Date('1990-01-01'),
  id: undefined,
};

// 以前的方式
const copy = JSON.parse(JSON.stringify(original));
// 問題暴露
console.log(copy.birth); // "1990-01-01T00:00:00.000Z" (變成了字符串)
console.log(copy.id);    // undefined (undefined 丟失)

現在，我們有了原生的、強大的深拷貝工具 structuredClone：

structuredClone 是官方推薦的深拷貝方式，支持絕大多數數據類型（除函數、DOM節點等），徹底解決了 JSON 方法的弊端。

數組分組

將一個扁平的數組按照某個屬性進行分組，是數據處理中非常常見的需求。

const products = [
  { name: '蘋果', category: '水果' },
  { name: '電視', category: '電器' }
];

// 以前的方式
const grouped = products.reduce((acc, product) => {
 const key = product.category;
 if (!acc[key]) { acc[key] = []; }
  acc[key].push(product);
 return acc;
}, {});
// grouped: { '水果': [...], '電器': [...] }

ES2023 引入了 Object.groupBy()，讓分組操作變得語義化且極其簡單。

Object.groupBy() 將一個意圖直接翻譯成了一行代碼，可讀性遠超復雜的 reduce 實現。

擁抱原生 API，不僅能讓我們的代碼更簡潔健壯，更能讓我們從繁瑣的造輪子中解放出來，專注于業務邏輯的實現，提高開發效率。

責任編輯：趙寧寧來源： JavaScript