Detailed explanation of JavaScript value type and reference type conversion usage examples

JavaScript data types are divided into six types, namely null, undefined, boolean, string, number, and object. object is a reference type, and the other five are basic types or primitive types. We can use the typeof method to print out which type something belongs to. To compare variables of different types, you must first convert the type, which is called type conversion. Type conversion is also called implicit conversion. Implicit conversions usually occur with the operators addition, subtraction, multiplication, division, equals, and less than, greater than, etc. .

1. Data type conversion between value types:

For data types in javascript, please refer to javascript data types detailed explanation 1 chapter.

(1). Numbers and strings use the + operator:

If numbers and strings are operated using the + operator, the numbers will first be converted to String, and then perform string concatenation:

var antzone = "antzone";
var num = 8;
console.log(antzone+num);

(2). + operator operation involving Boolean values:

If there is a Boolean type involved, the Boolean value will first be converted into the corresponding number or string, and then the corresponding string connection or arithmetic operation will be performed.

var bool = true;
var num = 8;
console.log(bool + num);

The above code first converts true to the number 1, and then performs arithmetic addition.

var bool = true;
var num = "8";
console.log(bool + num);

The above Boolean value will be converted into the corresponding string form "true", and then string concatenation is performed.

(3). Subtraction operation:

If a subtraction operation is performed, both operands will be converted into numbers first, and then arithmetic operations will be performed:

var bool = true;
var num = "8";
console.log(bool - num);

true will be converted to the number 1, the string "8" will be converted to the number 8, and then arithmetic operations will be performed.

The same applies to conversions of multiplication, division, greater than, less than and subtraction, so I won’t give examples anymore.

(4) .== equality operation:

undefined and null are special. The return value of both of them using the == operator is true.

console.log(undefined==null);

When comparing other value types, the operands will be converted into numbers

console.log("3"==3);

The above code will Convert the string "3" to a number before comparing.

console.log("1"==true);

The above code will convert "1" and true into numbers respectively, and then compare them.

2. Convert reference type to value type:

Converting reference type (object) to value type is much more complicated. The distribution is introduced below. .

The two methods of object inheritance can help us realize the conversion function from object to value type:

(1).toString() method.

(2).valueOf() method.

Normally we think that to convert an object to a string, you need to call the toString() method, and to convert an object to a number, you need to call the valueOf() method, but it is not that simple when it is actually applied. See the following code example :

var obj = {
 webName: "phpcn",
 url:"php.cn"
}
console.log(obj.toString());

As can be seen from the above code, the toString() method does not convert the object into a string that reflects this object.

var arr = [1, 2, 3];
console.log(arr.valueOf());

As can be seen from the above code, the valueOf() method does not convert the object into a number that reflects this object.

var arr = [1, 2, 3];
console.log(arr.toString());

The toString() method of an array object can convert the array into a string that reflects this array object.

The summary is as follows:

(1). Some objects simply inherit the toString() or valueOf() method, such as the first one example.
(2). Some objects not only inherit two methods, but also rewrite them.

So some object methods can achieve the goal of converting to strings or numbers, and some cannot.

The rules for calling toString() or valueOf() to convert an object into a string or number are as follows:

When calling toString(), if the object has this method, this method is called; if This method returns a value type data, then this value type data is returned, and then the relevant data type conversion is performed according to the context. If there is no toString(), or the return value of this method is not a value type data, then valueOf() will be called (if this method exists). If valueOf() returns a value type data, then according to the context environment to perform relevant data type conversions.

Further explanation:

(1). The above introduces the functions of valueOf() and toString() methods by default (converting objects into numbers or strings), but you need to pay attention The thing is, this is not a hard and fast rule, that is to say, the valueOf() method must not return a number or the toString() method must be converted to a string. For example, these two simply inherited methods cannot be converted to numbers and As for the function of strings, for another example, we can use these two methods ourselves, and the return value does not need to be a number or a string.

（2）.还有需要特别注意的一点就是，很多朋友认为，转换为字符串首先要调用toString()方法， 其实这是错误的认识，我们应该这么理解，调用toString()方法可以转换为字符串，但不一定转换字符串就是首先调用toString()方法。

看如下代码实例:

var arr = [];
arr.valueOf = function () { return "1"; }
arr.toString = function () { return "2"; }
console.log(arr + "1");

上面的代码中，arr是要被转换为字符串的，但是很明显是调用的valueOf()方法，而没有调用toString()方法。有些朋友可能会有这样的质疑，难道[2]这样的数字转换成字符串"2"，不是调用的toString()方法吗。

代码如下:

var arr = [2];
console.log(arr + "1");

其实过程是这样的，首先arr会首先调用valueOf()方法，但是数字的此方法是简单继承而来，并没有重写（当然这个重写不是我们实现），返回值是数组对象本身，并不是一个值类型，所以就转而调用toString()方法，于是就实现了转换为字符串的目的。

总结如下:

大多数对象隐式转换为值类型都是首先尝试调用valueOf()方法。但是Date对象是个例外，此对象的valueOf()和toString()方法都经过精心重写，默认是调用toString()方法，比如使用+运算符，如果在其他算数运算环境中，则会转而调用valueOf()方法。

代码实例如下:

var date = new Date();
console.log(date + "1");
console.log(date + 1);
console.log(date - 1);
console.log(date * 1);

The above is the detailed content of Detailed explanation of JavaScript value type and reference type conversion usage examples. For more information, please follow other related articles on the PHP Chinese website!