Mars 踩坑实录Android 2.1 缺 Object.keys 时的两行 for-in 替代写法【免费下载链接】Mars腾讯移动 Web 前端知识库项目地址: https://gitcode.com/gh_mirrors/mar/Mars维护低版本 Android 页面的人大概率撞见过这样一个报错Android 2.1 的内置浏览器还是老 WebKit 内核直接调Object.keys(obj)会抛Uncaught TypeError: Object.keys is not a function依赖键遍历的逻辑当场停摆。腾讯移动 Web 前端知识库 Mars 把这类对象遍历的坑记录在专门的 ES5 兼容速查里修法其实一句话换成 for-in 循环就行。这篇文章按什么场景用哪种遍历方式来拆。先别急着上 polyfillAndroid 2.1 到底缺了什么⚠️ 动手之前先看清环境缺的是哪些能力。Mars 仓库里的 ES5 移动端兼容性速查表 中Android 2.1 那一列在Object.keys、Object.create、Array.isArray甚至Function.prototype.bind上基本全打 no。也就是说这不是孤立的一个点而是整块 ES5 对象方法的能力空洞。所以选型判断很简单如果只是要拿到一个对象的键名for-in 一把梭足矣没必要封装 polyfill如果项目里Object.keys的调用点太多、不想逐个改再考虑挂一个模仿原生的替代函数。for-in hasOwnProperty最低版本对象遍历的写法核心代码就三行var keys []; for (var key in obj) { if (obj.hasOwnProperty(key)) keys.push(key); }说白了for-in 会走到所有可枚举键包括原型链上继承来的hasOwnProperty这一关就是只留对象自身的属性跑完得到的数组和Object.keys(obj)等价。这个写法覆盖包括 Android 2.1 在内的所有环境无依赖、无版本判断是低版本浏览器做对象遍历的首选。另外提一个坑如果对象是Object.create(null)造的没有原型链它自己没有hasOwnProperty方法上面这行会挂。稳妥的写法是Object.prototype.hasOwnProperty.call(obj, key)。Object.keys polyfill 移动端怎么挂只改两个分支不想改项目里几十个调用点的话包一层和原生同签名的替代函数即可。增强版相比上一节多出来的其实是两个分支var objectKeys function (obj) { var keys []; if (Object.prototype.toString.call(obj) [object Array]) { for (var i 0; i obj.length; i) keys.push(String(i)); } else { for (var key in obj) if (obj.hasOwnProperty(key)) keys.push(key); } return keys; };完整版还会再多几行判断原生Object.keys存在就直接委托参数不是对象就抛TypeError。完整版本可以参考仓库 solutions/ 目录里的兼容实践。数组为什么要单独走下标千个元素按索引逐个 push比 for-in 遍历快这是增强版提速的主要来源。真机耗时数据怎么看结论就一句话Android 2.1 真机基准遍历 100 个属性的对象、跑 1000 次增强版比基础 for-in 快约三成但两者都还在毫秒级离高版本系统上原生Object.keys的 20ms 以内还有明显差距。两个手写版本的内存占用差异可以忽略。所以 polyfill 本身不用纠结微优化真正的开销来源是把大对象遍历放进了渲染热路径那才是该避开的。上线前 checklist按兼容速查表逐项核对目标机型缺哪些方法别默认补一个就够了入口处做特性检测if (!Object.keys)再加载 polyfill新设备上别白跑兼容代码低版本设备上单次大对象遍历尽量分批或挪出首帧【免费下载链接】Mars腾讯移动 Web 前端知识库项目地址: https://gitcode.com/gh_mirrors/mar/Mars创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考
阅读完成 · 觉得有帮助?