- 正确答案：在 JavaScript 中实现对象的 set 方法，通常是指为一个对象动态设置嵌套属性值，例如 set(obj, 'a.b.c', 10) 将 obj.a.b.c 设置为 10。结合 TypeScript，则需要为其添加类型定义，确保类型安全。 - 解答思路： 1. 首先分析需求：给定一个对象、一个路径字符串（如 'a.b.c'）、一个值，将该值赋给对象在该路径上的属性。 2. 路径是点号分隔的字符串，需按 . 拆分成键数组。 3. 遍历路径，逐层访问或创建对象属性。 4. 到达最后一层时，赋值。 5. 在 TypeScript 中，需要使用泛型来描述对象结构，并利用索引类型和递归类型推导尽可能保持类型安全。 - 深度知识讲解：这个问题考察的是： - JavaScript 对象的动态属性操作 - 字符串路径解析与嵌套对象构建 - 类型系统中的索引访问类型（T[K]）、映射类型、条件类型 - 模板字面量类型（TypeScript 4.1+）用于路径字符串的类型推导 - 深层嵌套类型的递归建模核心难点在于 TypeScript 类型系统无法在运行时完全推断字符串 split 后的结果，因此类型安全只能做到“近似”——我们可以通过递归条件类型模拟路径遍历过程。底层数据结构是普通的 JavaScript 对象，但实现中涉及“路径树”的隐式结构，类似 JSON Pointer 的简化版。注意事项： - 如果中间路径不存在，需要创建为普通对象 {} - 原始对象可能为 null/undefined，需判断 - 性能上，路径较长时会有多次属性查找，时间复杂度 O(n)，n 为路径段数 - JavaScript 实现 + TypeScript 类型定义： ```typescript // 泛型工具类型：允许字符串索引 type AnyObject = Record; // 递归类型：根据路径 P 和值 V 构造一个嵌套对象类型 // SetField 表示在 T 上设置 a.b.c 为 number 后的新类型 // 实际上我们不返回新类型，而是影响原对象，所以主要用于参数约束 // 辅助类型：将路径字符串转为元组类型（有限支持） type PathTuple = S extends `${infer K}.${infer R}` ? K extends '' ? [...PathTuple] : [K, ...PathTuple] : S extends '' ? [] : [S]; // 更实用的方式是用索引签名配合泛型约束 function set(obj: T, path: string, value: any): void { if (obj == null) return; const keys = path.split('.'); let current: any = obj; for (let i = 0; i < keys.length - 1; i++) { const key = keys[i]; if (current[key] == null || typeof current[key] !== 'object') { current[key] = {}; } current = current[key]; } const lastKey = keys[keys.length - 1]; current[lastKey] = value; } // 使用示例： const data = {} as any; set(data, 'user.profile.name', 'Alice'); console.log(data); // { user: { profile: { name: 'Alice' } } } // 更强的类型版本（受限于 TS 类型系统，不能完全静态推导路径） // 我们可以限制 path 必须是对象已有路径的键，但这要求传入对象有明确结构 // 强类型版本：仅适用于已知结构的对象 function setTyped(obj: T, path: keyof T, value: T[keyof T]): void; function setTyped( obj: T, path: `${K1}`, value: T[K1] ): void; function setTyped( obj: T, path: `${K1}.${K2}`, value: T[K1][K2] ): void; function setTyped< T, K1 extends keyof T, K2 extends keyof T[K1], K3 extends keyof T[K1][K2] >(obj: T, path: `${K1}.${K2}.${K3}`, value: T[K1][K2][K3]): void; // 实现重载函数 function setTyped(obj: AnyObject, path: string, value: any): void { const keys = path.split('.'); let current: any = obj; for (let i = 0; i < keys.length - 1; i++) { const key = keys[i]; if (current[key] == null || typeof current[key] !== 'object') { current[key] = {}; } current = current[key]; } const lastKey = keys[keys.length - 1]; current[lastKey] = value; } // 使用强类型版本（编译期检查） interface UserConfig { user: { profile: { name: string; age: number; }; }; } const config: UserConfig = { user: { profile: { name: '', age: 0 } } }; setTyped(config, 'user.profile.name', 'Bob'); // OK // setTyped(config, 'user.profile.invalid', 'test'); // 编译错误（如果启用严格校验） // 局限性说明： // - 当前 TS 不支持任意长度的模板字符串路径解析为联合类型 // - 因此上述重载最多支持 3-4 层，更深则 fallback 到 any // - 可以借助第三方库如 @types/lodash 中的 _.set 类型定义作为参考 // 扩展知识： // Lodash 的 _.set 实现原理类似，但增加了对数组索引的支持（如 'list[0].name'） // 支持的路径语法包括：点号、方括号 // 示例增强版可扩展正则解析路径： // 'a.b.c' -> ['a','b','c'] // 'a[0].b' -> ['a', '0', 'b'] // 路径解析增强函数（伪代码）： function parsePath(path: string): string[] { return path .replace(/\[(\d+)\]/g, '.$1') // 将 [0] 转为 .0 .split('.') .filter(Boolean); } // 修改 set 函数使用 parsePath 即可支持数组索引语法 ``` - 总结： - JavaScript 实现关键是路径拆分与逐层构建对象。 - TypeScript 类型定义可通过函数重载提供有限的类型安全。 - 完全通用的类型推导受限于当前 TypeScript 对模板字符串的处理能力。 - 实际项目中可结合 IDE 智能提示 + 运行时断言提升可靠性。 - 底层原理涉及对象引用传递、动态属性赋值、字符串解析等核心 JS 特性。

字节秋招前端一面凉经

全站热榜

创作者周榜