On the difference between valueof and ToString in JavaScript _javascript skills

Source: Internet
Author: User
Tags numeric value object object

Objective

Basically, all JS data types have both methods, except NULL. They both solve the problem of JavaScript value operations and display, and overrides increase the optimizations they invoke.

Test analysis

First look at one example:

Copy Code code 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 results because they secretly invoke the valueof or ToString method.
But how do you tell which method is invoked, and we can test it in another way.
Because of the use of Console.log, please experiment in the FF containing Firebug!
Copy Code code as follows:

var bbb = {
I:10,
Tostring:function () {
Console.log (' toString ');
return this.i;
},
Valueof:function () {
Console.log (' valueof ');
return this.i;
}
}

Alert (BBB)//toString
alert (+BBB); Ten valueof
Alert (' +bbb); Ten valueof
Alert (String (BBB)); Ten toString
Alert (BBB); Ten valueof
Alert (bbb = = ' 10 '); True valueof
Alert (bbb = = ' 10 '); False


The result gives the impression that if you call the ToString method when you convert to a string, you call the ValueOf method if you convert to a numeric value, but two of them are very discordant. One is alert ("+BBB"), and the string combination should be called the ToString method ... Another we can temporarily understand is that the = = = Operator does not convert implicitly, and therefore does not call them. In order to investigate the truth, we need more rigorous experiments.
Copy Code code as follows:

var AA = {
I:10,
Tostring:function () {
Console.log (' toString ');
return this.i;
}
}
alert (AA);//ToString
alert (+AA); Ten toString
Alert (' +aa); Ten toString
Alert (String (AA)); Ten toString
Alert (number (AA)); Ten toString
Alert (aa = ' 10 '); True toString

Look at valueof again.
Copy Code code as follows:

var bb = {
I:10,
Valueof:function () {
Console.log (' valueof ');
return this.i;
}
}

Alert (BB);//[Object]
alert (+BB); Ten valueof
Alert (' +bb); Ten valueof
Alert (String (BB)); [Object Object]
Alert (number (BB)); Ten valueof
Alert (BB = = ' 10 '); True valueof


Find it a little different?! It is not as uniform and regular as the above ToString.
For that [object], I guess I inherited it from object, and we'll take it out again.
Copy Code code as follows:

Object.prototype.toString = null;
var cc = {
I:10,
Valueof:function () {
Console.log (' valueof ');
return this.i;
}
}


Alert (cc);//Ten valueof
alert (+CC); Ten valueof
Alert (' +cc); Ten valueof
Alert (String (cc)); Ten valueof
Alert (number (cc)); Ten valueof
alert (cc = = ' 10 '); True valueof


Summary: valueof in favor of operation, ToString is biased towards display.
1. In the event of an object conversion (for example: Alert (a)), the ToString method will be invoked preferentially, and if there is no rewriting of ToString the ValueOf method will be invoked, and if neither method is overridden, the object's ToString is output.
2, in the strong-turn string type will call the ToString method precedence, when the strong to the number priority call valueof.
3, in the case of operator operators, valueof priority is higher than ToString.

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.