如何利用对象字面量 (Object Literals) 快速构建配置对象-js教程-PHP中文网

对象字面量是构建配置对象最直接常用的方式，天然契合只读、结构固定、无需复用方法等特点；支持变量简写、计算属性名、方法简写和嵌套结构，但应避免副作用、复杂逻辑及异步操作。

如何利用对象字面量 (object literals) 快速构建配置对象

对象字面量是构建配置对象最直接、最常用的方式——不需要函数、不涉及原型链，写完即用，结构清晰，语义明确。

适合配置对象的典型特征

配置对象通常具备这几个特点：只读为主、结构固定、不需复用方法、不依赖实例状态。对象字面量天然契合这些需求。

属性值多为字符串、数字、布尔值、数组或嵌套对象
极少需要动态修改，多数在初始化时就确定
常作为参数传给函数或库（如 fetch 选项、React.useEffect 依赖项、Vue 组件 props）
键名语义化强，比如 timeout、retries、headers

写法要点与常见技巧

保持简洁可读是关键。ES6+ 提供了多个语法糖，让配置更紧凑：

InStreet

InStreet是一款AI智能体工具，字节扣子推出的 AI Agent 专属中文社交网络。

下载

变量同名简写：const baseUrl = 'https://api.example.com'; const config = { baseUrl }; 等价于 { baseUrl: baseUrl }
计算属性名：const env = 'prod'; const config = { [`apiUrl_${env}`]: 'https://prod.api.com' };
方法简写（无需 function 关键字）：onError() { console.error('Failed'); }
嵌套结构直观表达层级：auth: { token: 'xxx', strategy: 'bearer' }, network: { timeout: 5000, keepAlive: true }

实际配置场景示例

以下是一段贴近真实开发的配置对象写法：

const apiConfig = {
  baseUrl: 'https://api.example.com/v1',
  timeout: 8000,
  retries: 2,
  headers: {
    'Content-Type': 'application/json',
    Authorization: `Bearer ${token}`
  },
  onError(error) {
    console.warn('API error:', error.message);
  }
};

它可直接用于封装请求函数：fetchWithConfig('/users', apiConfig)。