Home  >  Article  >  Web Front-end  >  JS array learning how to splice all elements and return a string

JS array learning how to splice all elements and return a string

青灯夜游
青灯夜游Original
2021-08-19 14:17:204921browse

In the previous article "JS Array Learning: How to Delete Any Element Based on the Array Subscript", we introduced the use of the delete operator or splice() method to delete array elements based on the array subscript. Methods. This time we continue to learn and practice JavaScript arrays and see how to convert arrays into strings. Interested friends can learn about it~

The theme of this article is: splicing all the elements in the array into one character String, simply put, is to convert an array into a string. For example, the following array:

arr = [1,2,3,4,5,6,7,8,9,0];

You want to splice all the elements in it and return a string, such as "1234567890" or "1,2,3,4,5 ,6,7,8,9,0", how to do this? Below we introduce several methods.

Method 1: Use a for loop to traverse the array and splice each array element

We use a for loop to traverse the array; splicing can use the string connection operator " ", You can also use the concat() method (for details, you can read the article "JS String Learning Skills Use Functions to Connect Multiple Strings")

Let's take a look at the implementation code:

var arr = [1,2,3,4,5,6,7,8,9,0];
var i,str="";
for(i=0;i<arr.length;i++){  //循环遍历数组
	//拼接
	str=str.concat(arr[i]);
	//str=str + arr[i];
}
console.log(str);

Output result:

JS array learning how to splice all elements and return a string

Description: This method is suitable for converting one-dimensional array to string.

Method 2: Use toString() method

toString() can convert each element into a string, and then connect the output with commas. (Note: the toString() method does not support custom delimiters!)

var arr = [1,2,3,4,5,6,7,8,9,0];
var str;
str=arr.toString();
console.log(str);

JS array learning how to splice all elements and return a string

The toString() method can handle multi-dimensional arrays and will convert all arrays iteratively is a string.

var arr = [1,[2,3],[4,5],[6,[7,[8,9],0]]];
var str;
str=arr.toString();
console.log(str);

JS array learning how to splice all elements and return a string

Method 3: Use the join() method

array.join(separator)Method use To put all the elements in the array into a string, each element can be separated by the separator set by the separator parameter; if this parameter is omitted, the default is to use the comma "," separated (this is the same as the output of the toString() method).

var arr = [1,2,3,4,5,6,7,8,9,0];
var str1,str2,str3;
str1=arr.join();
str2=arr.join(&#39;-&#39;);
str3=arr.join(&#39;==&#39;);
console.log(str1);
console.log(str2);
console.log(str3);

JS array learning how to splice all elements and return a string

If you don’t want to have a separator, you can set the separator parameter to an empty string ('');

var arr = [1,2,3,4,5,6,7,8,9,0];
var str;
str=arr.join(&#39;&#39;);
console.log(str);

JS array learning how to splice all elements and return a string

The join() method can also handle multi-dimensional arrays, but the parameters need to be omitted, and the output is the same as toString():

var arr = [1,[2,3],[4,5],[6,[7,[8,9],0]]];
var str;
str=arr.join();
console.log(str);

JS array learning how to splice all elements and return a string

Explanation :

If the array contains objects (non-simple types), then the results of calling the join() and toString() methods will be displayed regardless of the content of the element[object Object]String.

var arr = [{姓名: &#39;李华&#39;}, &#39;张三&#39;, &#39;李四&#39;];

console.log(arr.toString()); // "[object Object],张三,李四"
console.log(arr.join()); // "[object Object],张三,李四"

JS array learning how to splice all elements and return a string

Generally in actual scenarios, the join() method is used more often.

Okay, that’s all. If you need it, you can read: javascript advanced tutorial

The above is the detailed content of JS array learning how to splice all elements and return a string. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn