2024年最全26，2024年最新面试官都被搞懵了

网上学习资料一大堆，但如果学到的知识不成体系，遇到问题时只是浅尝辄止，不再深入研究，那么很难做到真正的技术提升。

需要这份系统化的资料的朋友，可以添加戳这里获取

一个人可以走的很快，但一群人才能走的更远！不论你是正从事IT行业的老鸟或是对IT行业感兴趣的新人，都欢迎加入我们的的圈子（技术交流、学习资源、职场吐槽、大厂内推、面试辅导），让我们一起学习成长！

对象-基础类型转换

当我们在对象上使用数学运算符时会发生什么？例如obj1 + obj2，亦或者使用console.log(obj)会输出什么内容？这操作的结果都取决于对象-基础类型转换的结果。

本文目的：

• 了解对象参与数学运算时发生了什么；
• 了解对象数学运算的例外情况并利用；

写在前面

在无所不能的C++中，我们能够通过一种非常BUG的方式（运算符重载）自定义对象的各种运算符功能。遗憾的是JavaScript不支持自定义运算符实现对象运算，在参与运算时，对象会被隐式的转为基础类型，然后对这些基础类型数据进行运算，最后返回运算结果。

例如，我们没有办法直接对两个表示矩阵的对象执行矩阵运算，然后得到矩阵运算的结果，这种行为是走不通的。（补充，这种行为在C++中易如反掌）

由于JavaScript本身不支持运算符重载，如果你在代码中发现了对象的数学运算，大部分情况下是错误的操作。

对象类型转换规则

在前文的类型转换章节，我们已经详细的了解了基础类型之间的相互转换规则，但是我们并没有涉及对象的类型转换，这正是本文的重点内容：

1. 不会转为布尔类型。对象隐式转换只能转为字符串和数字，如果我们主动转换对象为布尔类型，只会得到true，不论对象是否为空；
2. 转为数字类型发生在对象相减或者应用数学函数时，例如，Date对象相减会得到两个日期之间的差值；
3. 转为字符串通常发生在诸如alert(obj)或者对象属性键这种输出函数中。

以上转换并非完全固定的，JavaScript允许我们使用特殊的对象方法，自己实现字符串和数字之间的转换。

对象类型转换的结果 Hint

JavaScript如何决定对象转换为何种类型的数据呢？ 这取决于hint的取值：

String

如果hint的取值为"string"，就会将对象转为字符串，常发生在以下情况：

//作为字符串输出
alert(obj);
console.log(obj);
//作为属性键
Obj1[obj] = 996;

Number

当hint的取值为"number"时，对象会转为数字类型，这通常发生在数学运算、比较运算情况下：

let num = Number(obj);//显式转换

//除了二元加法的数学运算
let x = +obj;//一元加法（和显式转换效果相同）
let y = date1 - date2;
//比较运算符
let bigger = num1 > num2;

Default

当hint取值为"default"时，JavaScript引擎也不确定将对象转为何种类型。

例如，我们使用二元加法+操作对象，由于字符串和数字均可作二元加法，不确定具体使用哪一种方法，就以"default"进行转换。

亦或者，我们使用比较运算符==操作对象时，对象应该转为何种类型也不是很明确，因此使用"default"进行转换。

let n = obj1 + obj2;//二元加
if(obj == 996){//比较运算
    ...
}

注意：

比较运算符<和>虽然同样可以比较字符串和数字，但是由于历史原因，导致使用number而不是default。

转换需要的三个对象方法

为了将对象转为我们需要的类型，引擎通常需要操作三个对象方法：

1. 如果方法存在，调用obj[Symbol.toPrimitive](hint)方法，直接将对象转为我们需要的类型，其中Symbo.toPrimitive是系统symbol方法；
2. 否则，如果hint是"string"，调用obj.toString()或者obj.valueOf()；
3. 否则，如果hint是"number"，调用obj.valueOf()或者obj.toString()；

Symbol.toPrimitive()

有一个名为Symbol.toPrimitive的内建Symbol用来命名对象的类型转换方法，实现方法如下：

obj[Symbol.toPrimitive] = function(hint){
    //对象转为hint类型的代码
    //hint有三种取值string、number、default
}

正如上面展示的引擎调用类型转换方法的顺序，如果对象存在Symbol.toPrimitive方法，就不需要其他类型转换方法了。

举个栗子：

let people = {
    name : 'xiaoming',
    age : 33,
	[Symbol.toPrimitive](hint){
         console.log(`hint:${hint}`);
         return hint == "string" ? `{name:"${this.name}",age:${this.age}}`:this.age;
     }
}
alert(people);//隐式转为String类型
console.log(+people);//转为Number类型
console.log(people+1);//转为Number类型

以上代码，首先会弹出一个对话框如下图：

这是因为alert(people)会调用Symbol.toPrimitive(hint)方法，其中hint的值为"string"。

随后代码执行结果的输出如下：

对象people分别被转为了"number"和"default",由于我们写的代码非常简单，并没有区分二者的区别，因此都是以数字的方式展现的。

上述案例可以发现，对象在不同的需求场景下，会通过hint参数的取值不同更改转换的最终结果，从而适应代码的执行。

toString和valueOf方法

以上Symbol.toPrimitive(hint)方法是一个通用的对象类型转换方法，但是，如果对象中没有定义这个方法，那么就需要寻找并使用toString和valueOf方法进行类型转换。

二者调用的区别如下：

1. 如果hint的值是"string"，调用toString方法，如果找不到，就调用valueOf方法；
2. 如果hint的不是"string"，调用valueOf方法，如果找不到，就调用toString方法；

以上规则暗藏了一个特性，就是数学运算符会优先调用valueOf方法。

toString和valueOf是一种以约定名称的方式实现类型转换的方式，两个函数都是常规字符串命名的方法，属于一种“复古”风格的方法。

注意：

toString和valueOf方法都必须返回一个基本类型的返回值，如果返回一个对象，那么返回值就会被忽略，和没有找到这个方法的情况相同。

默认情况下，对象都具备一个默认的toString和valueOf方法：

• toString返回一个字符串"[object Object]";
• valueOf返回对象本身；

相信很多同学都有意无意的使用alert函数展示过对象的数据，最终显示的都是字符串[object Object]。

举例如下：

let people = { name : "xiaoming"};
alert(people);//展示[object Object]
alert(people.valueOf() === people);//弹出true

代码执行结果如下图所示：

网上学习资料一大堆，但如果学到的知识不成体系，遇到问题时只是浅尝辄止，不再深入研究，那么很难做到真正的技术提升。

需要这份系统化的资料的朋友，可以添加戳这里获取

一个人可以走的很快，但一群人才能走的更远！不论你是正从事IT行业的老鸟或是对IT行业感兴趣的新人，都欢迎加入我们的的圈子（技术交流、学习资源、职场吐槽、大厂内推、面试辅导），让我们一起学习成长！

1715596782796)]

网上学习资料一大堆，但如果学到的知识不成体系，遇到问题时只是浅尝辄止，不再深入研究，那么很难做到真正的技术提升。

需要这份系统化的资料的朋友，可以添加戳这里获取

一个人可以走的很快，但一群人才能走的更远！不论你是正从事IT行业的老鸟或是对IT行业感兴趣的新人，都欢迎加入我们的的圈子（技术交流、学习资源、职场吐槽、大厂内推、面试辅导），让我们一起学习成长！