JavaScript中valueOf与toString的区别与调用机制详解

前言与基本概念

前言

在JavaScript中，除了null以外的大多数数据类型都具备valueOf和toString这两个方法。它们的主要作用是处理JavaScript值的运算与显示逻辑。通过重写这两个方法，可以优化调用行为并自定义对象在特定上下文中的表现。

测试分析

valueOf与toString的初步测试

首先通过一个具体示例来观察其行为：

var aaa = {
i: 10,
valueOf: function() { return this.i+30; },
toString: function() { return this.valueOf()+10; }
} 
alert(aaa > 20); // true 
alert(+aaa); // 40 
alert(aaa); // 50

产生上述结果的原因在于，JavaScript引擎在内部自动调用了valueOf或toString方法。

那么，具体在什么情况下会调用哪个方法呢？我们可以通过进一步的测试来区分。

由于测试中使用了console.log，建议在安装了Firebug的Firefox浏览器中进行实验。

var bbb = {
i: 10,
toString: function() {
console.log('toString');
return this.i;
 },
valueOf: function() {
console.log('valueOf');
return this.i;
 }
}
alert(bbb);// 10 toString
alert(+bbb); // 10 valueOf
alert(''+bbb); // 10 valueOf
alert(String(bbb)); // 10 toString
alert(Number(bbb)); // 10 valueOf
alert(bbb == '10'); // true valueOf
alert(bbb === '10'); // false

初步观察似乎表明：转换为字符串时调用toString，转换为数值时调用valueOf。但这里存在两个例外：一是alert(''+bbb)涉及字符串拼接，理论上应调用toString；二是===操作符不进行隐式类型转换，因此不触发这两个方法。为了探究本质，需要进行更严谨的实验。

var aa = {
i: 10,
toString: function() {
console.log('toString');
return this.i;
 } 
} 
alert(aa);// 10 toString
alert(+aa); // 10 toString
alert(''+aa); // 10 toString
alert(String(aa)); // 10 toString
alert(Number(aa)); // 10 toString
alert(aa == '10'); // true toString

接下来观察仅重写valueOf的情况。

var bb = {
i: 10,
valueOf: function() {
console.log('valueOf');
return this.i;
 } 
} 
alert(bb);// [object Object] 
alert(+bb); // 10 valueOf 
alert(''+bb); // 10 valueOf 
alert(String(bb)); // [object Object] 
alert(Number(bb)); // 10 valueOf 
alert(bb == '10'); // true valueOf

结果与之前不同，行为并不统一。

对于出现的[object Object]，推测是继承了Object原型的toString方法。我们将其移除以验证猜想。

Object.prototype.toString = null;
var cc = {
i: 10,
valueOf: function() {
console.log('valueOf');
return this.i;
 } 
} 
alert(cc);// 10 valueOf 
alert(+cc); // 10 valueOf 
alert(''+cc); // 10 valueOf 
alert(String(cc)); // 10 valueOf 
alert(Number(cc)); // 10 valueOf 
alert(cc == '10'); // true valueOf

总结：调用优先级规则

总结：valueOf倾向于数值运算，toString倾向于字符串显示。

1、 在进行对象转换时（例如:alert(a)），将优先调用toString方法，如若没有重写toString将调用valueOf方法，如果两方法都不没有重写，但按Object的toString输出。

2、 在进行强转字符串类型时将优先调用toString方法，强转为数字时优先调用valueOf。

3、 在有运算操作符的情况下，valueOf的优先级高于toString。