Javascript toString 方法原理

本文将简单介绍下toString方法。

toString方法的作用是返回一个对象的字符串形式。我们还是分不同数据类型来讨论。

1.Srting，字符串类型直接原始值返回；

'123'.toString(); // "123"
''.toString(); // ""

2.Boolean，布尔值类型返回对应的字符形式；

true.toString(); // 'true'
false.toString(); // 'false'

3.Number，数值类型情况有点复杂；

a.对于NaN， Infinity，-Infinity，返回字符形式；

NaN.toString(); // 'NaN'
Infinity.toString(); // 'Infinity'

+Infinity.toString(); // Infinity
(+Infinity).toString(); // 'Infinity'

(-Infinity).toString(); // '-Infinity'
-Infinity.toString(); // -Infinity

b.对于整数，加引号直接返回。直接调用toString方法会报错，因为整数后面的点会被识别为小数点，加个括号就好；
```
123.toString(); // Uncaught SyntaxError: Invalid or unexpected token
(123).toString(); // '123'
```
c.对于浮点数，可以直接调用toString方法，直接加引号返回；
```
1.23.toString(); // '1.23'
```
d.对于一些前面有正负号的数值，要加括号再调用toString方法，否则会先运行toString()方法，再添加正负号，隐式转换为数字；
```
+1.23.toString(); // 1.23
(+1.23).toString(); // '1.23'

-1.23.toString(); // 1.23
(-1.23).toString(); // '-1.23'
```

e.数值类型的toString方法还可以接收一个表示转换基数(radix)的可选参数。如果不指定此参数，转换规则将是基于十进制。

NaN.toString(2); // 'NaN'
Infinity.toString(2); // 'Infinity'

(17).toString(); // '17'
(17).toString(2); // '10001'
(17).toString(8); // '21'
(17).toString(8); // '11'

4.null和undefined，没有toString方法，直接调用会报错，但可以使用call方法；

null.toString(); // 错误
Object.prototype.toString.call(null) // "[object Null]"

undefined.toString(); // 错误
Object.prototype.toString.call(undefined) // "[object Undefined]"

5.复合类型，返回 "[object type]"，其中 type 是对象的类型。数组、函数、Date 对象都分别部署了自定义的toString方法，覆盖了Object.prototype.toString方法。

a.内置的对象和自定义的对象，返回"[object Object]"；

Object.prototype.toString(); // "[object Object]"

const obj = {
    name: 'josavion',
};
obj.toString(); // "[object Object]"

function Person() {
    this.name = 'josavion';
}
const person = new Person();
person.toString(); // "[object Object]"
Person.toString(); /* "function Person() {
                        this.name = 'josavion';
                      }" */

Object.toString(); // "function Object() { [native code] }"

b.函数Function类型返回函数代码;

function test(){
    console.log('test');
}
test.toString(); /* "function test(){
                        console.log('test');
                     }" */

const haha = () => {};
haha.toString(); // "() => {}"

Function.toString(); // "function Function() { [native code] }"

c.数组Array类型返回由数组中每个值的字符串形式拼接而成的一个以逗号分隔的字符串；

[].toString(); // ""
[1, 2, 3].toString(); // "1,2,3"
Array.prototype.toString(); // "" (数组的toString方法被改写了)

Array.toString(); // "function Array() { [native code] }"

d.时间Date类型返回表示当前时区的时间的字符串表示；

(new Date()).toString(); // "Wed Jun 24 2020 17:22:01 GMT+0800 (中国标准时间)"

Date.toString(); // "function Date() { [native code] }"

e.正则表达式RegExp类型返回正则表达式字面量的字符串表示；

/xyz/i.toString(); // "/xyz/i"

RegExp.toString(); // "function RegExp() { [native code] }"

f.错误Error类型；

const err = new Error('test');
err.toString(); // "Error: test"

Error.toString(); // "function Error() { [native code] }"

6.toString() 的应用。Object.prototype.toString方法返回对象的类型字符串，因此可以用来判断一个值的类型。由于实例对象可能会自定义toString方法，覆盖掉Object.prototype.toString方法，所以为了得到类型字符串，最好直接使用Object.prototype.toString方法。通过函数的call方法，可以在任意值上调用这个方法，帮助我们判断这个值的类型。

数值：返回[object Number]。
字符串：返回[object String]。
布尔值：返回[object Boolean]。
undefined：返回[object Undefined]。
null：返回[object Null]。
数组：返回[object Array]。
arguments 对象：返回[object Arguments]。
函数：返回[object Function]。
Error 对象：返回[object Error]。
Date 对象：返回[object Date]。
RegExp 对象：返回[object RegExp]。
其他对象：返回[object Object]。

Javascript toString 方法原理

猜你喜欢