js数组反转的几种常见方法举例

 更新时间:2023年10月10日 09:43:32   作者:比较菜的Curry  
最近学到了数组的使用方法,给大家分享一下,这篇文章主要给大家介绍了关于js数组反转的几种常见方法,文中通过代码介绍的非常详细,需要的朋友可以参考下

第一种:创建一个新数组使用reverse()的方法进行反转。

let arr = [1,2,3,4]
let arr1 = arr.reverse()
console.log(arr1);  //[4, 3, 2, 1]

第二种:利用数组循环,使用unshift() 方法将新项添加到数组的开头,并返回新的长度。unshift() 方法会改变数组的长度。

let arr2 = [1,2,3,4]
let arr3 = []
arr2.forEach((element) => { 
       arr3.unshift(element)
    })
console.log(arr3);  //[4, 3, 2, 1]

第三种:使用反向循环数组的方法添加至一个新的数组。

let arr4 = ["jin", "shi","peng"]
let arr5 = []
for (let i = arr4.length-1; i >=0; i--) {
    arr5.push(arr4[i])
}
console.log(arr5);  //['peng', 'shi', 'jin']

附:js实现数组中的一部分反转

动态规划法:const arr = [2, 6, 5, 8, 3, 5, 2, 6, 7];
const start = 3, end = 7;
const reverse = arr => {
   const { length: l } = arr;
   for(let i = 0; i < Math.floor(l/2); i++){
      const temp = arr[i];
      arr[i] = arr[l-i-1];
      arr[l-i-1] = temp;
   };
   return arr;
};
const reverseBetween = (arr, start, end) => {
   const num = Math.min(end - start, arr.length - start);
   arr.splice(start, 0, ...reverse(arr.splice(start, num)));
}
reverseBetween(arr, start, end);
console.log(arr);

完全用数组的方法实现

const arr = [1,2,3,4,5,6,7,8]  // 2,5  得 [1,2,6,5,4,3,7,8]
function Fselve(str,a,b){
  let arrary= [];
  let abs = arr.slice(a,b+1).reverse()
  for(var i=0;i<str.length;i++){
    if(i<a){
      arrary.push(str[i])
    }else if(b<i){
      arrary.push(str[i])
    }
  }
  arrary.splice(a,0,abs)
  let newArr =[]
  for(var j=0;j<arrary.length;j++){
    if(arrary[j].length>0){
      for(var h=0;h<arrary[j].length;h++){
        newArr.push(arrary[j][h])
      }
    }else{
      newArr.push(arrary[j])
    }
  }
  console.log(newArr,'new')
  return newArr
}
Fselve(arr,2,5)

总结 

到此这篇关于js数组反转的几种常见方法的文章就介绍到这了,更多相关js数组反转内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • Popup弹出框添加数据实现方法

    Popup弹出框添加数据实现方法

    这篇文章主要为大家详细介绍了Popup弹出框添加数据的简单实现方法,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-10-10
  • JS实现霓虹灯文字效果的方法

    JS实现霓虹灯文字效果的方法

    这篇文章主要介绍了JS实现霓虹灯文字效果的方法,涉及javascript遍历字符串及页面样式的动态操作技巧,效果非常炫目华丽,具有一定参考借鉴价值,需要的朋友可以参考下
    2015-08-08
  • javascript使用window.name解决跨域问题

    javascript使用window.name解决跨域问题

    window.name 的美妙之处:name 值在不同的页面(甚至不同域名)加载后依旧存在,并且可以支持非常长的 name 值(2MB)。
    2008-09-09
  • JS技巧动手实现红包兔子雨效果示例详解

    JS技巧动手实现红包兔子雨效果示例详解

    这篇文章主要为大家介绍了JS技巧动手实现红包兔子雨效果示例详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2023-01-01
  • knockoutjs模板实现树形结构列表

    knockoutjs模板实现树形结构列表

    这篇文章主要介绍了knockoutjs模板实现树形结构列表的实现代码,非常不错,具有参考借鉴价值,需要的朋友参考下吧
    2017-07-07
  • Object.defineProperty() 完整指南示例详解

    Object.defineProperty() 完整指南示例详解

    本文深入理解`Object.defineProperty()`的方法,包括基础概念、属性描述符的完整选项、常见使用场景等,感兴趣的朋友跟随小编一起看看吧
    2025-01-01
  • 详解嵌套命名空间在TypeScript中如何应用

    详解嵌套命名空间在TypeScript中如何应用

    命名空间是TypeScript中非常有用的概念,可以帮助我们组织和管理代码,避免命名冲突,下面小编就来和大家聊聊嵌套命名空间在TypeScript中是如何应用的吧
    2023-06-06
  • javascript结合Cookies实现浏览记录历史

    javascript结合Cookies实现浏览记录历史

    最近在工作当中遇到一个问题 有个页面需要添加一个浏览历史记录功能,具体来说就是要记录下用户在此网站的点击历史 并把它们降序排列出来(只显示前6个浏览历史而且不能重复)。
    2008-09-09
  • vue 自定义指令directive的使用场景

    vue 自定义指令directive的使用场景

    这篇文章主要详细介绍了vue 自定义指令directive的使用场景,文中有详细的代码示例,感兴趣的小伙伴欢迎阅读
    2023-04-04
  • JS实现的表头列头固定页面功能示例

    JS实现的表头列头固定页面功能示例

    这篇文章主要介绍了JS实现的表头列头固定页面功能,涉及javascript针对页面元素及表格样式动态操作相关技巧,需要的朋友可以参考下
    2017-01-01

最新评论