Home  >  Article  >  Web Front-end  >  JS array learning reversely connects all elements and outputs a string

JS array learning reversely connects all elements and outputs a string

青灯夜游
青灯夜游Original
2021-08-31 15:09:052767browse

In previous articles "JS array learning: How to splice all elements and return a string", "JS array learning: iterate arrays to calculate the sum of elements and connect the values ​​into strings》, we introduced several methods of splicing all elements forward from left to right in array order to form a string. This time we continue to introduce JS array to string, and talk about the method of concatenating all array elements in reverse (from right to left) to form a reverse string. Friends in need can learn about it~

Today The main content of this article is: traverse the array in reverse and concatenate the array elements into a string from right to left. Three implementation methods are introduced below.

Method 1: Use for loop

Implementation idea:

  • Use for loop to reverse traverse Array

    If you want to traverse the array in reverse, then the initial condition is i=array length-1, The restriction condition is i>=0, and i needs to be automatically Subtract 1 (i--)

for(i=arr.length-1;i>=0;i--){  //逆向循环遍历数组
}

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=arr.length-1;i>=0;i--){  //逆向循环遍历数组
	//拼接
	str=str+''+arr[i];
	// str=str.concat(arr[i]);
}
console.log(str);

The output result is:

JS array learning reversely connects all elements and outputs a string

Method 2: Using the reduceRight() method of the array

recudeRight () method can call the specified callback function on all elements in the array from right to left. The return value of this callback function is the cumulative result, and this return value is provided as a parameter the next time the callback function is called.

array.reduceRight(function callbackfn(previousValue, currentVaule, currentIndex, array)[, initialValue])

function callbackfn(previousValue,currentVaule,currentIndex,array): Required parameters, specify the callback function, can receive up to 4 parameters:

  • previousValue: Initial value, or the value obtained by calling the callback function last time.

  • currentValue: The value of the current element array.

  • currentIndex: The numeric index of the current array element.

  • array: Array object containing the element.

Let’s see how to reversely splice array elements using reduceRight()

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

function f(pre,curr) {
	str=pre+''+curr;
	return str;
}
arr.reduceRight(f);
console.log(str);

The output result is:

JS array learning reversely connects all elements and outputs a string

If you want to use a delimiter to separate each array element, you can change the empty string between the two " " operators in the callback function to the specified delimiter:

var arr = [1,2,3,4,5,6,7,8,9,0];
var str = '';
function f(pre,curr) {
	str=pre+'-'+curr;
	return str;
}
arr.reduceRight(f);
console.log(str);

The output result is:

JS array learning reversely connects all elements and outputs a string

Method 3: Use reverse() reduce()

reverse() can reverse the order of the elements of the array; The syntax and usage of the reduce() method are roughly the same as the reduceRight() method. The only difference is that it calls the specified callback function on all elements in the array from left to right.

array.reduce(function callbackfn(previousValue, currentVaule, currentIndex, array), initialValue)

Implementation idea:

  • First use reverse() to reverse the array elements and get the new array arr2;

  • Then Implement the reduce() method to call the function and splice the array elements

Let’s take a look at the implementation code:

var arr1 = [1,2,3,4,5,6,7,8,9,0],arr2=[];
var str = '';
function f(pre,curr) {
	str=pre+''+curr;
	return str;
}
arr2=arr1.reverse();
arr2.reduce(f);
console.log(str);

The output result is:

JS array learning reversely connects all elements and outputs a string

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

The above is the detailed content of JS array learning reversely connects all elements and outputs 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