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

是否恍然大悟了呢?

相关文章
|
25天前
|
JavaScript 前端开发
JavaScript中Object.prototype.toString.call()、instanceOf和Array.isArray()的区别
JavaScript中Object.prototype.toString.call()、instanceOf和Array.isArray()的区别
25 1
|
2月前
Object.prototype.toString.call() 和 instanceOf 和 Array.isArray() 区别以及优缺点
Object.prototype.toString.call() 和 instanceOf 和 Array.isArray() 区别以及优缺点
|
8月前
|
Java
toString()方法
toString()方法
39 0
|
6月前
|
前端开发 索引
Object中常用的方法
Object中常用的方法
20 0
|
JavaScript 前端开发
JavaScript总结:typeof与instanceof的区别,及Object.prototype.toString()方法
JavaScript总结:typeof与instanceof的区别,及Object.prototype.toString()方法
152 0
JavaScript总结:typeof与instanceof的区别,及Object.prototype.toString()方法
|
JavaScript 前端开发
Function(函数)与Object(对象)的关系
Function(函数)与Object(对象)的关系
58 0
|
JavaScript 前端开发
Do not access Object.prototype method 'hasOwnProperty' 问题原因及解决方法
使用Vue.js启动新项目将自动生成配置为与ESLint一起使用的样板。ESLint是可插拔和可配置的Linter工具,可帮助您识别和报告JavaScript中的不良模式,因此您可以轻松维护代码质量。如果您在不受控制的情况下开始编程,则可能会引入一些对ESLint不利的做法。
431 0
Object类的toString和Equals方法,以及Objects类的Equals方法
Object类 toString()方法 public class Person { private String name; private int age; public Person() { } public Person(String name, int age) { this.name =
|
JavaScript 前端开发 安全
JavaScript中typeof、toString、instanceof、constructor与in
JavaScript 是一种弱类型或者说动态语言。这意味着你不用提前声明变量的类型,在程序运行过程中,类型会被自动确定。
JavaScript中typeof、toString、instanceof、constructor与in