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

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

Aug 19, 2021 pm 02:17 PM
javascript string array Array to string

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];
Copy after login

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);
Copy after login

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);
Copy after login

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);
Copy after login

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);
Copy after login

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);
Copy after login

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);
Copy after login

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],张三,李四"
Copy after login

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 of this Website
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

Hot Article Tags

Notepad++7.3.1

Notepad++7.3.1

Easy-to-use and free code editor

SublimeText3 Chinese version

SublimeText3 Chinese version

Chinese version, very easy to use

Zend Studio 13.0.1

Zend Studio 13.0.1

Powerful PHP integrated development environment

Dreamweaver CS6

Dreamweaver CS6

Visual web development tools

SublimeText3 Mac version

SublimeText3 Mac version

God-level code editing software (SublimeText3)

How to remove duplicate elements from PHP array using foreach loop? How to remove duplicate elements from PHP array using foreach loop? Apr 27, 2024 am 11:33 AM

How to remove duplicate elements from PHP array using foreach loop?

PHP array key value flipping: Comparative performance analysis of different methods PHP array key value flipping: Comparative performance analysis of different methods May 03, 2024 pm 09:03 PM

PHP array key value flipping: Comparative performance analysis of different methods

PHP array multi-dimensional sorting practice: from simple to complex scenarios PHP array multi-dimensional sorting practice: from simple to complex scenarios Apr 29, 2024 pm 09:12 PM

PHP array multi-dimensional sorting practice: from simple to complex scenarios

The Art of PHP Array Deep Copy: Using Different Methods to Achieve a Perfect Copy The Art of PHP Array Deep Copy: Using Different Methods to Achieve a Perfect Copy May 01, 2024 pm 12:30 PM

The Art of PHP Array Deep Copy: Using Different Methods to Achieve a Perfect Copy

Application of PHP array grouping function in data sorting Application of PHP array grouping function in data sorting May 04, 2024 pm 01:03 PM

Application of PHP array grouping function in data sorting

Best Practices for Deep Copying PHP Arrays: Discover Efficient Methods Best Practices for Deep Copying PHP Arrays: Discover Efficient Methods Apr 30, 2024 pm 03:42 PM

Best Practices for Deep Copying PHP Arrays: Discover Efficient Methods

The role of PHP array grouping function in finding duplicate elements The role of PHP array grouping function in finding duplicate elements May 05, 2024 am 09:21 AM

The role of PHP array grouping function in finding duplicate elements

PHP array merging and deduplication algorithm: parallel solution PHP array merging and deduplication algorithm: parallel solution Apr 18, 2024 pm 02:30 PM

PHP array merging and deduplication algorithm: parallel solution

See all articles