jsguides

Array.prototype.toString()

toString()

ArraytoString() returns a string representation of the array. It converts each element to a string using its own toString() method and joins them with commas.

Syntax

arr.toString()

Parameters

None.

toString() takes no arguments and always uses a comma as the separator. If you need a different separator or more control over the string format, use join() instead — toString() is essentially join() called with no arguments, hardcoding the comma.

Examples

Basic usage

const fruits = ["apple", "banana", "cherry"];
console.log(fruits.toString());
// "apple,banana,cherry"

The simplest call produces a comma-joined string of all elements. Each element is converted to a string by calling its own toString() method before concatenation. For primitive values like strings and numbers, this is straightforward, but the behaviour diverges for objects, dates, and special values — the following examples show how different types are handled.

With different data types

const mixed = [1, "hello", true, null];
console.log(mixed.toString());
// "1,hello,true,"

Notice that null becomes an empty string in the output, producing a trailing comma. Numbers, strings, and booleans all convert to their expected string representations. The trailing comma after null is a common gotcha — if you split this string back on commas, you will get an empty entry that does not map back to the original null value.

Nested arrays

const nested = [1, [2, 3], [4, [5, 6]]];
console.log(nested.toString());
// "1,2,3,4,5,6"

Note that toString() flattens nested arrays into a single comma-separated string.

This flattening behaviour means you lose all structural information about nesting depth — [1, [2, 3]] and [1, 2, 3] produce identical output. For preserving nested structure, use JSON.stringify() instead, which retains the brackets and nesting levels.

Common Patterns

Converting to comma-separated list

const tags = ["javascript", "es6", "arrays"];
const list = tags.toString();
console.log(list);
// "javascript,es6,arrays"

This is the most common real-world use of toString() on arrays — turning a list of tags, categories, or IDs into a compact display string. When the data is already composed of simple strings, the default comma separator is often exactly right. For any situation where the separator matters, though, join() gives you the same result with explicit control.

With dates

const dates = [new Date(2024, 0, 1), new Date(2024, 11, 25)];
console.log(dates.toString());
// "Mon Jan 01 2024 00:00:00 GMT-0500 (Eastern Standard Time),Wed Dec 25 2024 00:00:00 GMT-0500 (Eastern Standard Time)"

Date objects call Date.prototype.toString() internally, so you get the full locale-specific date string for each element. This output is verbose and rarely what you want in a UI. For formatted dates, map through toLocaleDateString() or toISOString() before calling toString() or join().

With objects

const objects = [{a: 1}, {b: 2}];
console.log(objects.toString());
// "[object Object],[object Object]"

Objects don’t have a useful string representation by default—use JSON.stringify() or map() to convert them.

Plain objects always convert to [object Object] via their inherited toString(), which is rarely useful. For meaningful string output from an array of objects, either call JSON.stringify() on the whole array or use map() to extract a specific property before calling toString(). The map() approach gives you control over which fields appear and how they are formatted.

vs join()

The main difference between toString() and join() is that join() allows you to specify a custom separator:

const words = ["Hello", "World"];

console.log(words.toString());
// "Hello,World"

console.log(words.join(" "));
// "Hello World"

console.log(words.join(" - "));
// "Hello - World"

Implementation Details

Internally, toString() calls the join() method with no arguments, which defaults to using a comma as the separator. If any element is null or undefined, it is converted to an empty string in the output.

How toString() works

Array.prototype.toString() is defined to call this.join() with no arguments. The join() method then concatenates all elements into a single string, converting each to a string using its own toString() method, and places a comma between them. If the array’s join property has been overridden, Array.prototype.toString() uses the overridden version.

null and undefined handling

null and undefined elements are converted to an empty string in the output, producing adjacent commas for consecutive null/undefined values. This matches the behaviour of join() with the default separator.

[1, null, undefined, 4].toString(); // "1,,,4"

When toString() is called implicitly

JavaScript calls toString() on arrays automatically in string contexts — for example, when using the + operator with a string, or when passing an array to a function that expects a string. This can produce surprising results if you are not expecting comma-joined output:

'Array: ' + [1, 2, 3]; // "Array: 1,2,3"
`Values: ${[1, 2, 3]}`; // "Values: 1,2,3"

For intentional string conversion, explicit join() with a stated separator is clearer and less surprising for readers of the code.

When toString() is the right fit

toString() is the right fit when you need a quick, default string form of an array and the comma-separated output is exactly what you want. That can be handy for logging, debugging, and simple display code where a more structured format would be unnecessary overhead.

It is less appropriate when the array contains nested data or values that need custom formatting. In those cases, join() or JSON.stringify() usually communicates intent better. Knowing that distinction helps you avoid accidental output that looks valid but does not represent the structure you meant to show.

Overriding toString() in custom classes

If an array-like class defines its own toString() method, that method is used instead of Array.prototype.toString(). This is the standard JavaScript mechanism for customizing string coercion — any object can override toString() to control how it appears in string contexts.

See Also