Format lists
Display a list in a human-readable format.
JavaScript · Function
join
Array.prototype.join() returns a new string made by concatenating an array's elements, separated by commas or a chosen string. It returns an empty string for an empty array.
How it works
Call join() on an array to convert its elements to strings and concatenate them in order. The optional separator is placed between adjacent elements; omitted separators default to commas, while null and undefined elements contribute empty text.
Syntax
join()
join(separator)Parameters
| Name | Type | Description |
|---|---|---|
separator | string (optional) | A string inserted between each pair of adjacent array elements. If omitted, it defaults to a comma. |
Returns
A string containing all array elements joined together; an empty array returns the empty string.
Key points
- The result is a new string formed by concatenating every array element with either commas or the separator you provide.
- Leaving out the argument uses a comma as the separator.
- A one-element array returns that element's string form without adding a separator.
- The return value is one string containing the joined elements.
- An empty array produces an empty string.
- Each element is converted to text before the pieces are combined.
Common mistakes
- Nullish elements do not appear as the words "null" or "undefined"; they create an empty field between separators.
- Holes in sparse arrays behave like undefined, so they produce separators without element text.
- Nested arrays are converted recursively, but a separator passed to the outer join does not control nested-array separators.
- The method can operate on array-like objects with a length property and integer-keyed properties, not only actual arrays.
Example: Join array elements with a separator
const parts = ["Fire", "Air", "Water"];
console.log(parts.join(" - "));
// "Fire - Air - Water"Uses a custom separator to produce one readable string from the array.
When to use it
Build delimited strings
Create delimited text for logs or simple interchange formats.
Handle array-like data
Convert an array-like object into a delimited string.
Interview questions
QWhat does Array.prototype.join() do, and what is its default separator?
join() returns a new string containing the array elements converted to strings and concatenated in order. With no argument, commas separate the elements; a supplied string becomes the separator.
Follow-up: What does join() return for an empty array? It returns the empty string.
QHow does join() handle null, undefined, and sparse-array elements?
A null or undefined element is converted to an empty string. This differs from ordinary string conversion, where those values would normally produce the text "null" or "undefined".
Follow-up: How are holes handled? Empty slots are treated as undefined, so they also contribute no text while still affecting separator placement.
QHow are nested arrays represented by join()?
join() recursively converts nested elements, including nested arrays, to strings. Only the outermost call uses the supplied separator; nested arrays use commas at deeper levels.
Follow-up: What happens when Array.prototype.toString() is called? It invokes join() without arguments, so arrays normally stringify with comma separators.
Related
Array.prototype.toString()Array.prototype.toLocaleString()Array.prototype.concat()String.prototype.split()