当前位置: 首页 > news >正文

【JavaScript】手写 Object.prototype.toString()

🔧 ​​一、核心实现原理​

  1. ​内部逻辑​

    • 访问对象的 Symbol.toStringTag 属性(ES6+)或内部 [[Class]] 属性(ES5 及之前)。
    • 若属性不存在,根据对象类型推断默认标签(如 "Object""Array")。
    • 返回拼接字符串 "[object " + tag + "]"
  2. ​关键特性​

    • ​不可直接调用​​:需通过 call/apply 绑定 this 指向目标对象。
    • ​优先级​​:Symbol.toStringTag > 内置 [[Class]] 属性。

✨ ​​二、完整代码实现​

Object.defineProperty(Object.prototype, 'toString', {value: function() {// 1. 处理 null 和 undefinedif (this === null) return '[object Null]';if (this === undefined) return '[object Undefined]';// 2. 获取 Symbol.toStringTag 或内部 [[Class]]const tag = Symbol.toStringTag in Object(this) ? this[Symbol.toStringTag] : Object.prototype.toString.getInternalClass(this);// 3. 返回格式化字符串return `[object ${tag}]`;},writable: true,configurable: true
});// 辅助方法:模拟内部 [[Class]] 检测
Object.prototype.toString.getInternalClass = (obj) => {if (Array.isArray(obj)) return 'Array';if (obj instanceof Date) return 'Date';if (obj instanceof RegExp) return 'RegExp';// 其他内置类型判断...return 'Object'; // 默认值
};

🧪 ​​三、功能验证​

1. ​​基本类型检测​
console.log(Object.prototype.toString.call([])); // [object Array]
console.log(Object.prototype.toString.call(new Date())); // [object Date]
console.log(Object.prototype.toString.call(null)); // [object Null]
2. ​​自定义类型标签​
class MyClass {get [Symbol.toStringTag]() { return 'MyClass'; }
}
console.log(Object.prototype.toString.call(new MyClass())); // [object MyClass]
3. ​​避免重写影响​
const arr = [];
arr.toString = () => "Overridden!";
console.log(Object.prototype.toString.call(arr)); // 仍输出 [object Array]

⚠️ ​​四、注意事项​

  1. ​兼容性处理​

    • 旧版浏览器(如 IE)需手动实现 Symbol.toStringTagPolyfill
    • 内部 [[Class]] 在 ES5 后不再直接暴露,需通过类型推断模拟。
  2. ​性能优化​

    • 避免频繁调用:每次调用涉及原型链查找和字符串拼接,对性能敏感场景慎用。
  3. ​与重写方法的区别​

    • 直接调用 obj.toString() 可能被重写逻辑覆盖,而 Object.prototype.toString.call(obj) 始终访问原始方法。

💡 ​​五、应用场景​

  1. ​精准类型判断​
    替代 typeofinstanceof,统一处理基本类型和对象类型:

    function getType(obj) {return Object.prototype.toString.call(obj).slice(8, -1);
    }
    getType(new Map()); // "Map"
    
  2. ​自定义对象描述​
    通过 Symbol.toStringTag 控制调试信息输出:

    class NetworkError {get [Symbol.toStringTag]() { return 'NetworkError'; }
    }
    console.log(new NetworkError() + ""); // [object NetworkError]
    

http://www.dtcms.com/a/304571.html

相关文章:

  • Qt 移动应用常见问题与解决方案
  • React服务端渲染 Next 使用详解
  • 安卓模拟器 adb Frida hook 抓包
  • Ubuntu第一步——下载、网络、apt
  • 用系统架构思维,告别“意大利面条式”系统提示词
  • 艾利特机器人:光伏机器人如何重塑清洁能源制造新格局
  • 极光GPTBots亮相WAIC,并发布全新Multi-Agent平台
  • AUTOSAR Mcal Gpt - 模块介绍
  • 能源高效利用如何实现?楼宇自控系统智能化监管建筑设备
  • 电池充放电测试仪:解锁能源存储性能的关键工具|鑫达能
  • 【LeetCode 热题 100】34. 在排序数组中查找元素的第一个和最后一个位置——二分查找
  • 文件操作与IO流
  • 【Pycharm】Python最好的工具
  • pycharm中安装pythonocc
  • 【22】C# 窗体应用WinForm ——定时器Timer属性、方法、实例应用,定时切换画面
  • Android开发中compose ui深度分析
  • Qt Quick 与 QML 移动应用开发
  • 再谈亚马逊云科技(AWS)上海AI研究院7月22日关闭事件
  • Android 解决键盘遮挡输入框
  • 2.2.23-2.2.24规划采购管理-定制项目管理计划
  • C++算法学习专题:哈希算法
  • 预装Windows 11系统的新电脑怎么跳过联网验机
  • AI峰-关于AI的意识-AI浪潮下
  • 【高等数学】第七章 微分方程——第三节 齐次方程
  • 代码随想录——数组——移除元素——双指针
  • openeuler24.03部署k8s1.32.7高可用集群(三主三从)
  • 《Spring Cloud Config配置中心核心原理与动态刷新方案》
  • Singapore
  • 聚观早报 | 三星获特斯拉AI芯片订单;小米16首发成安卓最强SOC;iPhone 17 Pro支持8倍光学变焦
  • Kubernetes 核心准备:从 Pod 本质到网络模型全解析