• 技术文章 >web前端 >js教程

    JS数组学习之反向连接全部元素并输出字符串

    青灯夜游青灯夜游2021-08-31 15:20:54原创186
    在之前的文章《JS数组学习之怎么拼接全部元素,返回一个字符串》、《JS数组学习之迭代数组计算元素总和、将值连接成字符串》中,我们介绍了按照数组顺序,从左到右正向拼接全部元素,形成一个字符串的几种方法。这次我们继续介绍JS数组转字符串,聊聊逆向(从右到左)拼接全部数组元素,形成一个反转字符串的方法,有需要的朋友可以学习了解一下~

    今天本文的主要内容是:逆向遍历数组,从右到左的将数组元素拼接成一个字符串。下面介绍3种实现方法。

    方法1:利用for循环

    实现思想:

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

    我们看看实现代码:

    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);

    输出结果为:

    1.png

    方法2:利用数组的reduceRight() 方法

    recudeRight() 方法可从右向左对数组中的所有元素调用指定的回调函数。该回调函数的返回值为累积结果,并且此返回值在下一次调用该回调函数时作为参数提供。

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

    function callbackfn(previousValue,currentVaule,currentIndex,array):必需参数,指定回调函数,最多可以接收4个参数:

    我们看看利用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);

    输出结果为:

    2.png

    如果想要使用分隔符来分隔每个数组元素,可将回调函数中两个“+”运算符间的空字符串变为指定分隔符:

    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);

    输出结果为:

    3.png

    方法3:利用reverse()+reduce()

    reverse()可以反转数组的元素顺序;而reduce()方法的语法和用法与和reduceRight() 方法大概相同,唯一不同的是:它是从左到右对数组中的所有元素调用指定的回调函数。

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

    实现思想:

    我们看看实现代码:

    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);

    输出结果为:

    4.png

    好了,就说到这里了,有需要的可以看:javascript高级教程

    以上就是JS数组学习之反向连接全部元素并输出字符串的详细内容,更多请关注php中文网其它相关文章!

    声明:本文原创发布php中文网,转载请注明出处,感谢您的尊重!如有疑问,请联系admin@php.cn处理
    上一篇:前端Crypto.jsAES加密,PHP openssl_decrypt()解密进行数据安全传输 下一篇:nodejs是做什么的
    线上培训班

    相关文章推荐

    • JavaScript获取关联数组的键的两种方法• 浅析javascript中Reflect内置对象(代码详解)• JavaScript如何实现点击删除扩展名并获取文件名• 浅析JavaScript中时间戳运算的方法(附代码)

    全部评论我要评论

  • 取消发布评论发送
  • 1/1

    PHP中文网