Object.prototype.toString.call()的原理

简介: Object.prototype.toString.call()的原理

今天在项目中看到了用Object.prototype.toString.call()这个方法封装的检测数据类型的工具。

但是浏览器搜索相关原理的好回答凤毛麟角,故而想记录一下,万一可以帮助到更多的新手呢?我的文章都是非常通俗易懂的,因为我写文章的时候,都是根据一个前提,假如我是刚开始学习js的新手,别人如果这样讲解这个知识点,那么我也能听懂。我不喜欢那种用专业术语去解释一个知识点凸显自己水平高超的文章,所以我通常采用费曼学习法的方式去记录这些知识点。喜欢的话可以看看我其它文章,对新人极度友好的哟~😊

1.我相信大多数人对这个方法有一个误区,包括我,在刚开始学JS的时候,容易对这个方法产生了一个错误的认知。

比如const a = {name:"韩振方"},好像觉得a.toString方法应该返回字符串类型的{name:"韩振方"}。问题的关键点就恰恰在这个地方。

2.首先我们要知道toString这个方法,这个函数的返回值本来就应该是下面的固定格式。一个字符串个格式的[object xxxx]xxxx代表着调用这个方法的“数据”的数据类型。

image.png

3.重点来了:js其实是重写了某些数据类型的toString方法,所以才会造成下面的情况,在这里我们拿函数类型举例子,其他数据类型同理:

image.png

嗯...对,这才是我理想中的toString,会返回这个变量的字符串显示样子。

4.要想搞明白这个知识点,在这里你必须要对原型链和原型有清晰的认识。我们知道,JS的大原型其实是Object构造函数的prototype指向的那个Object,JS的世界的来源就是它。

image.png

这个对象上的toString方法才是原汁原味的toString

5.当我们用delete方法去删除Function.prototype(也就是Function构造函数的原型)身上的toString,然后我们再次调用name.toString会发生什么呢?

image.png

6.但是我们往往不会用delete去删除,所以就采用call方法去改变Object.prototype.toString方法this的指向。

image.png

是否恍然大悟了呢?

相关文章
|
JavaScript
Vue 的响应式原理中 Object.defineProperty 有什么缺陷
Vue 的响应式原理主要依赖于 `Object.defineProperty`,但该方法存在一些缺陷:无法检测到对象属性的添加和删除,且对大量数据进行代理时性能较差。Vue 3 中改用了 Proxy 来解决这些问题。
|
SQL 安全 Java
Android经典面试题之Kotlin中object关键字实现的是什么类型的单例模式?原理是什么?怎么实现双重检验锁单例模式?
Kotlin 单例模式概览 在 Kotlin 中,`object` 关键字轻松实现单例,提供线程安全的“饿汉式”单例。例如: 要延迟初始化,可使用 `companion object` 和 `lazy` 委托: 对于参数化的线程安全单例,结合 `@Volatile` 和 `synchronized`
349 6
|
JavaScript
vue2中$set的原理_它对object属性做了啥?
vue2中$set的原理_它对object属性做了啥?
165 1
|
存储 JavaScript 前端开发
Vue响应式原理Object.defineProperty()的使用
Vue响应式原理Object.defineProperty()的使用
|
JavaScript 前端开发
图解JavaScript——代码实现(Object.create()、flat()等十四种代码原理实现不香吗?)
图解JavaScript——代码实现(Object.create()、flat()等十四种代码原理实现不香吗?)
图解JavaScript——代码实现(Object.create()、flat()等十四种代码原理实现不香吗?)
|
JavaScript
《JS原理、方法与实践》- object类型对象
《JS原理、方法与实践》- object类型对象
195 0
Block、委托、回调函数原理剖析(在Object C语境)——这样讲还不懂,根本不可能!
开篇:要想理解Block和委托,最快的方法是搞明白“回调函数”这个概念。 做为初级选手,我们把Block、委托、回调函数,视为同一原理的三种不同名称。也就是说,现在,我们把这三个名词当成一回事。在这篇文章内,Block就是回调函数,委托也是回调函数,不再作详细的区分了。
1034 0
|
8月前
|
安全 IDE Java
重学Java基础篇—Java Object类常用方法深度解析
Java中,Object类作为所有类的超类,提供了多个核心方法以支持对象的基本行为。其中,`toString()`用于对象的字符串表示,重写时应包含关键信息;`equals()`与`hashCode()`需成对重写,确保对象等价判断的一致性;`getClass()`用于运行时类型识别;`clone()`实现对象复制,需区分浅拷贝与深拷贝;`wait()/notify()`支持线程协作。此外,`finalize()`已过时,建议使用更安全的资源管理方式。合理运用这些方法,并遵循最佳实践,可提升代码质量与健壮性。
259 1
|
8月前
|
Java
课时78:Object类的基本概念
Object类的主要特点是可以解决参数的统一问题,使用object类可以接受所有的数据类型。 1. Object类简介 2. 观察Object类接收所有子类对象 3. 使用Object类接收数组
177 0
|
11月前
|
JSON Java Apache
Java基础-常用API-Object类
继承是面向对象编程的重要特性,允许从已有类派生新类。Java采用单继承机制,默认所有类继承自Object类。Object类提供了多个常用方法,如`clone()`用于复制对象,`equals()`判断对象是否相等,`hashCode()`计算哈希码,`toString()`返回对象的字符串表示,`wait()`、`notify()`和`notifyAll()`用于线程同步,`finalize()`在对象被垃圾回收时调用。掌握这些方法有助于更好地理解和使用Java中的对象行为。
152 8