The toString[]
method returns a string representing the object. This method is meant to be overridden by derived objects for custom logic.
toString[]
By default toString[]
takes no parameters. However, objects that inherit from
const arr = [1, 2, 3];
arr.toString[]; // "1,2,3"
Object.prototype.toString.call[arr]; // "[object Array]"
0 may override it with their own implementations that do take parameters. For example, the const arr = [1, 2, 3];
arr.toString[]; // "1,2,3"
Object.prototype.toString.call[arr]; // "[object Array]"
1 and const arr = [1, 2, 3];
arr.toString[]; // "1,2,3"
Object.prototype.toString.call[arr]; // "[object Array]"
2 methods take an optional const arr = [1, 2, 3];
arr.toString[]; // "1,2,3"
Object.prototype.toString.call[arr]; // "[object Array]"
3 parameter.A string representing the object.
JavaScript calls the
const arr = [1, 2, 3];
arr.toString[]; // "1,2,3"
Object.prototype.toString.call[arr]; // "[object Array]"
4 method to . You rarely need to invoke the const arr = [1, 2, 3];
arr.toString[]; // "1,2,3"
Object.prototype.toString.call[arr]; // "[object Array]"
4 method yourself; JavaScript automatically invokes it when encountering an object where a primitive value is expected.This method is called in priority by , but and call
const arr = [1, 2, 3];
arr.toString[]; // "1,2,3"
Object.prototype.toString.call[arr]; // "[object Array]"
6 in priority. However, because the base const arr = [1, 2, 3];
arr.toString[]; // "1,2,3"
Object.prototype.toString.call[arr]; // "[object Array]"
6 method returns an object, the toString[]
method is usually called in the end, unless the object overrides const arr = [1, 2, 3];
arr.toString[]; // "1,2,3"
Object.prototype.toString.call[arr]; // "[object Array]"
6. For example, class Dog {
constructor[name, breed, color, sex] {
this.name = name;
this.breed = breed;
this.color = color;
this.sex = sex;
}
}
0 returns class Dog {
constructor[name, breed, color, sex] {
this.name = name;
this.breed = breed;
this.color = color;
this.sex = sex;
}
}
1, because its toString[]
method returns class Dog {
constructor[name, breed, color, sex] {
this.name = name;
this.breed = breed;
this.color = color;
this.sex = sex;
}
}
3, which is then converted to a number.All objects that inherit from
class Dog {
constructor[name, breed, color, sex] {
this.name = name;
this.breed = breed;
this.color = color;
this.sex = sex;
}
}
4 [that is, all except ] inherit the toString[]
method. When you create a custom object, you can override toString[]
to call a custom method, so that your custom object can be converted to a string value. Alternatively, you can add a class Dog {
constructor[name, breed, color, sex] {
this.name = name;
this.breed = breed;
this.color = color;
this.sex = sex;
}
}
8 method, which allows even more control over the conversion process, and will always be preferred over class Dog {
constructor[name, breed, color, sex] {
this.name = name;
this.breed = breed;
this.color = color;
this.sex = sex;
}
}
9 or const arr = [1, 2, 3];
arr.toString[]; // "1,2,3"
Object.prototype.toString.call[arr]; // "[object Array]"
4 for any type conversion.To use the base
const theDog = new Dog["Gabby", "Lab", "chocolate", "female"];
theDog.toString[]; // "[object Object]"
`${theDog}`; // "[object Object]"
1 with an object that has it overridden [or to invoke it on class Dog {
constructor[name, breed, color, sex] {
this.name = name;
this.breed = breed;
this.color = color;
this.sex = sex;
}
}
5 or const theDog = new Dog["Gabby", "Lab", "chocolate", "female"];
theDog.toString[]; // "[object Object]"
`${theDog}`; // "[object Object]"
3], you need to call const theDog = new Dog["Gabby", "Lab", "chocolate", "female"];
theDog.toString[]; // "[object Object]"
`${theDog}`; // "[object Object]"
4 or const theDog = new Dog["Gabby", "Lab", "chocolate", "female"];
theDog.toString[]; // "[object Object]"
`${theDog}`; // "[object Object]"
5 on it, passing the object you want to inspect as the first parameter [called const theDog = new Dog["Gabby", "Lab", "chocolate", "female"];
theDog.toString[]; // "[object Object]"
`${theDog}`; // "[object Object]"
6].const arr = [1, 2, 3];
arr.toString[]; // "1,2,3"
Object.prototype.toString.call[arr]; // "[object Array]"
const theDog = new Dog["Gabby", "Lab", "chocolate", "female"];
theDog.toString[]; // "[object Object]"
`${theDog}`; // "[object Object]"
1 returns const theDog = new Dog["Gabby", "Lab", "chocolate", "female"];
theDog.toString[]; // "[object Object]"
`${theDog}`; // "[object Object]"
8, where const theDog = new Dog["Gabby", "Lab", "chocolate", "female"];
theDog.toString[]; // "[object Object]"
`${theDog}`; // "[object Object]"
9 is the object type. If the object has a class Dog {
constructor[name, breed, color, sex] {
this.name = name;
this.breed = breed;
this.color = color;
this.sex = sex;
}
toString[] {
return `Dog ${this.name} is a ${this.sex} ${this.color} ${this.breed}`;
}
}
0 property whose value is a string, that value will be used as the const theDog = new Dog["Gabby", "Lab", "chocolate", "female"];
theDog.toString[]; // "[object Object]"
`${theDog}`; // "[object Object]"
9. Many built-in objects, including class Dog {
constructor[name, breed, color, sex] {
this.name = name;
this.breed = breed;
this.color = color;
this.sex = sex;
}
toString[] {
return `Dog ${this.name} is a ${this.sex} ${this.color} ${this.breed}`;
}
}
2 and class Dog {
constructor[name, breed, color, sex] {
this.name = name;
this.breed = breed;
this.color = color;
this.sex = sex;
}
toString[] {
return `Dog ${this.name} is a ${this.sex} ${this.color} ${this.breed}`;
}
}
3, have a class Dog {
constructor[name, breed, color, sex] {
this.name = name;
this.breed = breed;
this.color = color;
this.sex = sex;
}
toString[] {
return `Dog ${this.name} is a ${this.sex} ${this.color} ${this.breed}`;
}
}
0. Some objects predating ES6 do not have class Dog {
constructor[name, breed, color, sex] {
this.name = name;
this.breed = breed;
this.color = color;
this.sex = sex;
}
toString[] {
return `Dog ${this.name} is a ${this.sex} ${this.color} ${this.breed}`;
}
}
0, but have a special tag nonetheless. They include [the tag is the same as the type name given below]:
6class Dog { constructor[name, breed, color, sex] { this.name = name; this.breed = breed; this.color = color; this.sex = sex; } toString[] { return `Dog ${this.name} is a ${this.sex} ${this.color} ${this.breed}`; } }
7 [anything whoseclass Dog { constructor[name, breed, color, sex] { this.name = name; this.breed = breed; this.color = color; this.sex = sex; } toString[] { return `Dog ${this.name} is a ${this.sex} ${this.color} ${this.breed}`; } }
8 returnsclass Dog { constructor[name, breed, color, sex] { this.name = name; this.breed = breed; this.color = color; this.sex = sex; } toString[] { return `Dog ${this.name} is a ${this.sex} ${this.color} ${this.breed}`; } }
9]class Dog { constructor[name, breed, color, sex] { this.name = name; this.breed = breed; this.color = color; this.sex = sex; } toString[] { return `Dog ${this.name} is a ${this.sex} ${this.color} ${this.breed}`; } }
0const theDog = new Dog["Gabby", "Lab", "chocolate", "female"]; `${theDog}`; // "Dog Gabby is a female chocolate Lab"
1const theDog = new Dog["Gabby", "Lab", "chocolate", "female"]; `${theDog}`; // "Dog Gabby is a female chocolate Lab"
2const theDog = new Dog["Gabby", "Lab", "chocolate", "female"]; `${theDog}`; // "Dog Gabby is a female chocolate Lab"
3const theDog = new Dog["Gabby", "Lab", "chocolate", "female"]; `${theDog}`; // "Dog Gabby is a female chocolate Lab"
4const theDog = new Dog["Gabby", "Lab", "chocolate", "female"]; `${theDog}`; // "Dog Gabby is a female chocolate Lab"
5const theDog = new Dog["Gabby", "Lab", "chocolate", "female"]; `${theDog}`; // "Dog Gabby is a female chocolate Lab"
The
const theDog = new Dog["Gabby", "Lab", "chocolate", "female"];
`${theDog}`; // "Dog Gabby is a female chocolate Lab"
6 object returns const theDog = new Dog["Gabby", "Lab", "chocolate", "female"];
`${theDog}`; // "Dog Gabby is a female chocolate Lab"
7. Everything else, including user-defined classes, unless with a custom class Dog {
constructor[name, breed, color, sex] {
this.name = name;
this.breed = breed;
this.color = color;
this.sex = sex;
}
toString[] {
return `Dog ${this.name} is a ${this.sex} ${this.color} ${this.breed}`;
}
}
0, will return const theDog = new Dog["Gabby", "Lab", "chocolate", "female"];
`${theDog}`; // "Dog Gabby is a female chocolate Lab"
9.const theDog = new Dog["Gabby", "Lab", "chocolate", "female"];
theDog.toString[]; // "[object Object]"
`${theDog}`; // "[object Object]"
1 invoked on class Dog {
constructor[name, breed, color, sex] {
this.name = name;
this.breed = breed;
this.color = color;
this.sex = sex;
}
}
5 and const theDog = new Dog["Gabby", "Lab", "chocolate", "female"];
theDog.toString[]; // "[object Object]"
`${theDog}`; // "[object Object]"
3 returns const toString = Object.prototype.toString;
toString.call[new Date[]]; // [object Date]
toString.call[new String[]]; // [object String]
// Math has its Symbol.toStringTag
toString.call[Math]; // [object Math]
toString.call[undefined]; // [object Undefined]
toString.call[null]; // [object Null]
3 and const toString = Object.prototype.toString;
toString.call[new Date[]]; // [object Date]
toString.call[new String[]]; // [object String]
// Math has its Symbol.toStringTag
toString.call[Math]; // [object Math]
toString.call[undefined]; // [object Undefined]
toString.call[null]; // [object Null]
4, respectively.You can create a function to be called in place of the default toString[]
method. The toString[]
function you create should return a string value. If it returns an object and the method is called implicitly during , then its result is ignored and the value of a related method,
const arr = [1, 2, 3];
arr.toString[]; // "1,2,3"
Object.prototype.toString.call[arr]; // "[object Array]"
6, is used instead, or a const toString = Object.prototype.toString;
toString.call[new Date[]]; // [object Date]
toString.call[new String[]]; // [object String]
// Math has its Symbol.toStringTag
toString.call[Math]; // [object Math]
toString.call[undefined]; // [object Undefined]
toString.call[null]; // [object Null]
8 is thrown if none of these methods return a primitive.The following code defines a
const toString = Object.prototype.toString;
toString.call[new Date[]]; // [object Date]
toString.call[new String[]]; // [object String]
// Math has its Symbol.toStringTag
toString.call[Math]; // [object Math]
toString.call[undefined]; // [object Undefined]
toString.call[null]; // [object Null]
9 class.class Dog {
constructor[name, breed, color, sex] {
this.name = name;
this.breed = breed;
this.color = color;
this.sex = sex;
}
}
If you call the toString[]
method, either explicitly or implicitly, on an instance of
const toString = Object.prototype.toString;
toString.call[new Date[]]; // [object Date]
toString.call[new String[]]; // [object String]
// Math has its Symbol.toStringTag
toString.call[Math]; // [object Math]
toString.call[undefined]; // [object Undefined]
toString.call[null]; // [object Null]
9, it returns the default value inherited from const arr = [1, 2, 3];
arr.toString[]; // "1,2,3"
Object.prototype.toString.call[arr]; // "[object Array]"
0:const theDog = new Dog["Gabby", "Lab", "chocolate", "female"];
theDog.toString[]; // "[object Object]"
`${theDog}`; // "[object Object]"
The following code overrides the default toString[]
method. This method generates a string containing the
const myDate = new Date[];
Object.prototype.toString.call[myDate]; // [object Date]
myDate[Symbol.toStringTag] = "myDate";
Object.prototype.toString.call[myDate]; // [object myDate]
Date.prototype[Symbol.toStringTag] = "prototype polluted";
Object.prototype.toString.call[new Date[]]; // [object prototype polluted]
4, const myDate = new Date[];
Object.prototype.toString.call[myDate]; // [object Date]
myDate[Symbol.toStringTag] = "myDate";
Object.prototype.toString.call[myDate]; // [object myDate]
Date.prototype[Symbol.toStringTag] = "prototype polluted";
Object.prototype.toString.call[new Date[]]; // [object prototype polluted]
5, const myDate = new Date[];
Object.prototype.toString.call[myDate]; // [object Date]
myDate[Symbol.toStringTag] = "myDate";
Object.prototype.toString.call[myDate]; // [object myDate]
Date.prototype[Symbol.toStringTag] = "prototype polluted";
Object.prototype.toString.call[new Date[]]; // [object prototype polluted]
6, and const myDate = new Date[];
Object.prototype.toString.call[myDate]; // [object Date]
myDate[Symbol.toStringTag] = "myDate";
Object.prototype.toString.call[myDate]; // [object myDate]
Date.prototype[Symbol.toStringTag] = "prototype polluted";
Object.prototype.toString.call[new Date[]]; // [object prototype polluted]
7 of the object.class Dog {
constructor[name, breed, color, sex] {
this.name = name;
this.breed = breed;
this.color = color;
this.sex = sex;
}
toString[] {
return `Dog ${this.name} is a ${this.sex} ${this.color} ${this.breed}`;
}
}
With the preceding code in place, any time an instance of
const toString = Object.prototype.toString;
toString.call[new Date[]]; // [object Date]
toString.call[new String[]]; // [object String]
// Math has its Symbol.toStringTag
toString.call[Math]; // [object Math]
toString.call[undefined]; // [object Undefined]
toString.call[null]; // [object Null]
9 is used in a string context, JavaScript automatically calls the toString[]
method.const theDog = new Dog["Gabby", "Lab", "chocolate", "female"];
`${theDog}`; // "Dog Gabby is a female chocolate Lab"
toString[]
can be used with every object and [by default] allows you to get its class.
const toString = Object.prototype.toString;
toString.call[new Date[]]; // [object Date]
toString.call[new String[]]; // [object String]
// Math has its Symbol.toStringTag
toString.call[Math]; // [object Math]
toString.call[undefined]; // [object Undefined]
toString.call[null]; // [object Null]
Using toString[]
in this way is unreliable; objects can change the behavior of
const theDog = new Dog["Gabby", "Lab", "chocolate", "female"];
theDog.toString[]; // "[object Object]"
`${theDog}`; // "[object Object]"
1 by defining a class Dog {
constructor[name, breed, color, sex] {
this.name = name;
this.breed = breed;
this.color = color;
this.sex = sex;
}
toString[] {
return `Dog ${this.name} is a ${this.sex} ${this.color} ${this.breed}`;
}
}
0 property, leading to unexpected results. For example: