您的位置:

jstostring——JavaScript中的toString()方法详解

toString()是JavaScript中常用的一个方法,它的功能是将一个数值或者对象转化成字符串类型。在实际开发中,我们常常需要将一些数值或对象展示在前端页面或者通过网络传输传递给后端,这时候就需要用到toString()方法。本文将围绕toString()方法,从各个方面详细讲述它的用法和注意事项。

一、数据类型的toString()方法

JavaScript中,除了null和undefined两个数据类型没有toString()方法,其他数值类型、字符串类型和布尔类型都有自己的toString()方法。

1、数值类型toString()

数值类型的toString()方法可以接受一个参数,该参数表示转化后的进制,取值范围是2~36。如果没有传递参数,则默认输出10进制形式的字符串。

let a = 10;
console.log(a.toString()); // "10"
console.log(a.toString(8)); // "12"
console.log(a.toString(16)); // "a"

2、字符串类型toString()

字符串类型的toString()方法不接受参数,直接将自身转化为字符串形式。

let str = "JavaScript";
console.log(str.toString()); // "JavaScript"

3、布尔类型toString()

布尔类型的toString()方法不接受参数,将布尔值转化成字符串"true"或"false"。

let bool = true;
console.log(bool.toString()); // "true"

二、对象类型的toString()方法

对象类型的toString()方法需要根据情况重写,否则会返回一个默认字符串。下面是几个常见的对象类型的toString()方法。

1、数组类型toString()

数组类型的toString()方法重写后,会返回用逗号分隔的每个元素拼成的字符串。

let arr = [1, 2, 3];
console.log(arr.toString()); // "1,2,3"

2、日期类型toString()

日期类型的toString()方法重写后,会返回日期时间的字符串表现形式。

let date = new Date();
console.log(date.toString()); // "Fri Sep 10 2021 09:59:41 GMT+0800 (中国标准时间)"

3、普通对象类型toString()

普通对象类型的toString()方法需要手动重写才能正确返回对象的字符串形式。

let obj = {
  name: "Tom",
  age: 18,
  toString: function() {
    return this.name + " is " + this.age + " years old.";
  }
};
console.log(obj.toString()); // "Tom is 18 years old."

三、自定义toString()方法

我们可以通过重写自定义的对象类型的toString()方法,来让该对象类型实现自己想要的字符串表现形式。

function Person(name, age) {
  this.name = name;
  this.age = age;
  this.toString = function() {
    return this.name + " is " + this.age + " years old.";
  }
}
let p = new Person("Tom", 18);
console.log(p.toString()); // "Tom is 18 years old."

在上面的代码中,我们通过自定义Person对象的toString()方法,来让该对象以自定义的字符串形式展示。

四、注意事项

1、toString()方法返回的是一个新的字符串,而不是对原对象的修改

调用toString()方法,会得到一个新的字符串,而不会对原对象进行修改。

let a = 10;
console.log(a.toString()); // "10"
console.log(a); // 10,没有改变原数值

2、对象类型重写toString()方法时,要避免陷入死循环

如果一个对象类型中的toString()方法,用类似this.toString()的形式调用自身,就会陷入死循环。

function Person(name, age) {
  this.name = name;
  this.age = age;
  this.toString = function() {
    return this.toString(); // 错误示范,会陷入死循环
  }
}
let p = new Person("Tom", 18);
console.log(p.toString()); // Maximum call stack size exceeded

五、总结

本文从数值类型、字符串类型和布尔类型的toString()方法,以及对象类型的重写toString()方法的各个方面进行了详细阐述,并且提醒了开发者在使用toString()方法时要注意的事项。toString()方法的灵活运用,将会为开发者在实际工作中带来很大的便利。