Differences between valueOf and toString in Javascript

Preface

Basically, all JS data types have these two methods, except null. They solve the javascript value calculation and display problems. Rewriting will increase the optimization of their calls.

Test Analysis

Let's take a look at the following example:

Copy codeThe Code is as follows: 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

This is because they secretly call the valueOf or toString method.
But how can we tell which method is called? We can test it using another method.
Because console. log is used, please experiment in FF with firebug installed!Copy codeCode: var bbb = {
I: 10,
ToString: function (){
Console. log ('string ');
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

The result shows that the toString method is called when it is converted to a string, and the valueOf method is called when it is converted to a value, but two of them are not harmonious. One is alert (''+ bbb), and the string combination should be to call the toString method ...... Another operator we can understand for the time being is that the = operator does not perform implicit conversion, so they are not called. We need more rigorous experiments to investigate the truth.Copy codeCode: var aa = {
I: 10,
ToString: function (){
Console. log ('string ');
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

Let's look at valueOf.Copy codeCode: 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

Is it a little different ?! It is not as unified as the toString above.
For the [object], I guess it is inherited from the Object. Let's take a look at it.Copy codeThe Code is as follows: 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

Conclusion: valueOf tends to be computation, while toString tends to be displayed.
1. During object conversion (for example, alert (a), the toString method is preferentially called. If toString is not overwritten, the valueOf method is called. If neither method is overwritten, however, the output is based on the toString of the Object.
2. When the string type is strongly converted, The toString method is preferentially called, and the valueOf method is preferentially called when the string type is strongly converted to a number.
3. When an operator is involved, valueOf has a higher priority than toString.