In-depth understanding of valueOf functions and toString methods in JavaScript

Source: Internet
Author: User

In JavaScript, the valueOf function method returns the original value of the specified object. Usage:
Object. valueOf () object is a required parameter and is an inherent JScript object.
The valueOf method definition of each inherent JavaScript Object is different.

Object Return Value
Array Elements of the array are converted into strings separated by commas (,) and connected together. Its operations are the same as those of Array. toString and Array. join.
Boolean Boolean value.
Date The storage time is the number of milliseconds from midnight, January 1, January 1, 1970 in UTC.
Function Function itself.
Number Numeric value.
Object Object. This is the default situation.
String String value.

Math and Error objects do not have the valueOf method.

Basically, all JS data types have the valueOf and toString methods, except null. They solve the javascript value calculation and display problems.
ValueOf () method of JavaScript
The valueOf () method returns the original value of a Boolean object.
Use booleanObject. valueOf (). The return value is the original Boolean value of booleanObject. If the object that calls this method is not Boolean, an exception TypeError is thrown.
Copy codeThe Code is as follows:
<Script type = "text/javascript">
Var boo = new Boolean (false );
Document. write (boo. valueOf ());
</Script>

The above script outputs false.
ToString () method of JavaScript
The toString () method converts a logical value to a string and returns the result.
Use booleanObject. toString () to return a string "true" or "false" based on the original Boolean value or the value of the booleanObject ". If the object that calls this method is not Boolean, an exception TypeError is thrown.
This method is automatically called when a Boolean object is used in a string environment.
The following script creates a Boolean object and converts it to a string:
Copy codeThe Code is as follows:
<Script type = "text/javascript">
Var boo = new Boolean (true );
Document. write (boo. toString ());
</Script>

Script output: true.
Let's take a look at one 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 codeThe Code is as follows:
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

At first glance, it seems 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 codeThe Code is as follows:
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.
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.
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

If toString is overwritten, the existence of valueOf is ignored during object conversion. However, if you only override the valueOf method, the valueOf method is preferred when you want to convert it to a string. When toString cannot be called, the valueOf can only be mounted. For that strange String concatenation problem, it may be out of the operator, open the ECMA262-5 and find that there is a getValue operation. Well, the answer should be uncovered. Rewriting will increase the optimization of their calls, while in the case of operators, valueOf has a higher priority 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.