![JavaScript Array join() Method [Fully-Explained]](https://www.codeleaks.io/wp-content/uploads/2021/03/JavaScript-Array-join-Method-Fully-Explained.jpg)
The JavaScript Array.prototype.join() method takes an iterative object type, such as an array, list, etc, and converts it into a newly created string. A comma will separate the elements of the array-like object in the resulting string by default.
However, the join() method takes an argument for separator format too. This means that you can tell the method to form the string with any separator’s help and not just the comma (which is a default separator).
Following are a few essential points to notice about the returning behavior of the join() method in JavaScript:
Following this text is the syntax to use the JavaScript join() method. Have a look, and then we will be looking at some coding examples.
Table of Contents
Syntax
arr.join([separator]) Here,
- arr – is the array that the join() method will convert into a string.
- Separator – can be anything that you want to use for the elements to be separated. It can be an empty string as well. In such a case, the array elements will be joined without any character between themselves.
- Square brackets [] – show that the separator is an optional parameter. If you are not providing it, then by default, the string will be comma-separated.
Example#01: Separating the Elements with Different Separators
In the following example, we will cover different types of separator parameters that can be passed to the join() method to observe the output difference.
Code
var arr = ['Pisces', 'Sagittarius', 'Leo'];
//Case#01: No separator provided - by default comma will be used
var str = arr.join();
console.log('Case#01: No separator provided - by default comma will be used');
console.log(str);
console.log('------------------------------------------------------------------');
//Case#02: Empty string is used as separator
var str = arr.join('');
console.log('Case#02: Empty string is used as separator');
console.log(str);
console.log('------------------------------------------------------------------');
//Case#03: Separated by a Special Character
var str = arr.join('|');
console.log('Case#03: Separated by a Special Character');
console.log(str);
console.log('------------------------------------------------------------------');
//Case#04: Separated by a string
var str = arr.join(' and ');
console.log('Case#04: Separated by a string');
console.log(str);
console.log('------------------------------------------------------------------');
Output
Example#02: When an Array-like Object is passed in the argument of a Function
Sometimes, you may need to pass an array-like object in the argument of a function. In such a case, one needs to use the call() method and pass the array as its arguments. For illustration, see the example below:
Code
function myFunc(a, b, c) {
var s = Array.prototype.join.call(arguments);
console.log(s); // '1,a,true'
}
myFunc(1, 'hello', true);
//expected output: "1,hello,true" Output
Conclusion
This brief article discussed JavaScript Array.prototype.join() method and the variations that its parameters can have. We also saw a few coding examples demonstrating different cases and using the join() method on an array-like argument of a function.
