javascript数组常见操作方法实例总结【连接、添加、删除、去重、排序等】


Posted in Javascript onJune 13, 2019

本文实例讲述了javascript数组常见操作方法。分享给大家供大家参考,具体如下:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>3water.com 数组的方法</title>
  <script>
    var arr=[1,3,4]
    var arr1=["a","b","c"]
    var arr2=["d","e","f"]
    var arrNum=[]
    //1、向数组的末尾添加一条或多条元素,并返回新的长度
    //arr.push("longzhoufeng")
    //console.log(arr)//1,3,4,"longzhoufeng"
    //2、向数组的最开始添加一条或多条元素,并返回新的长度
    //arr.unshift("minigui")//IE6,7不支持
    //console.log(arr)//"minigui", 1, 3, 4
    //3、连接二个数组或者多个数组
    //var newArr=arr.concat(arr1,arr2)
    //console.log(newArr)//[1, 3, 4, "a", "b", "c", "d", "e", "f"]
    //4、删除并返回数组的第一个元素
    //console.log(arr1.shift());//a
    //arr1.shift();
    //console.log(arr1);//b,c
    //5、删除并返回数组的最后一个元素
    //console.log(arr1.pop());//c
    //arr1.pop()
    //console.log(arr1)//["a", "b"]
    //6、删除,替换,添加
    //arr1.splice(0,2)//0代表位置,2代表要删除的个数
    //console.log(arr1)//["c"]
    //替换
    //arr1.splice(0,1,"longzhoufeng")//第三个参就是在0位置上替换成longzhoufeng
    //arr1.splice(0,1,"longzhoufeng")//第三个参就是在0位置上替换成longzhoufeng
    //console.log(arr1)//["longzhoufeng", "b", "c"]
    //添加
    //arr1.splice(1,0,"longzhoufeng")
    //console.log(arr1)//["a", "longzhoufeng", "b", "c"]
    //数组去重
    var arr3=[1,3,3,2,5,6,7,7]
    //1、先遍历数组的每一个元素
    for(var i=0;i<arr3.length;i++){
      //2、每遍历对比一个,就得往前加一位
      for(var j=i+1;j<arr3.length;j++){
        //3、对遍历的元素进行对比,如果相等,就删除后面的一个元素
        if(arr3[i]==arr3[j]){
          arr3.splice(j,1);
          //4、删除之后就减少一位,直到没有为止
          j--;
        }
      }
    }
    console.log(arr3)
    //7、数组排序
    var arr4=[4,3,5,5,76,2,0,8]
    //这种方法可能会有问题,因为sort()会把元素转换成字符串
    //arr4.sort();
    //console.log(arr4)//0, 2, 3, 4, 5, 5, 76, 8
    //sort()里面可以传一个函数,如果返回的是a-b就是从小到大,如果返回是b-a就从反方向排序
    arr4.sort(function(a,b) {
      return a-b;
    })
    console.log(arr4)//0, 2, 3, 4, 5, 5, 8, 76
    var arr5=["345px","23px","10px","1000px"]
    arr5.sort(function(a,b) {
      return parseInt(a)-parseInt(b);
    })
    console.log(arr5)//"10px", "23px", "345px", "1000px"
  </script>
</head>
<body>
</body>
</html>

运行结果:

javascript数组常见操作方法实例总结【连接、添加、删除、去重、排序等】

感兴趣的朋友可以使用在线HTML/CSS/JavaScript代码运行工具:http://tools.3water.com/code/HtmlJsRun测试上述代码运行效果。

更多关于JavaScript相关内容还可查看本站专题:《JavaScript数组操作技巧总结》、《JavaScript字符与字符串操作技巧总结》、《JavaScript遍历算法与技巧总结》、《JavaScript数学运算用法总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript查找算法技巧总结》及《JavaScript错误与调试技巧总结》

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
让angularjs支持浏览器自动填表
Nov 10 Javascript
JavaScript如何实现跨域请求
Aug 05 Javascript
jQuery实现表格隔行及滑动,点击时变色的方法【测试可用】
Aug 20 Javascript
浅谈js script标签中的预解析
Dec 30 Javascript
js以及jquery实现手风琴效果
Apr 17 Javascript
Bootstrap 表单验证formValidation 实现表单动态验证功能
May 17 Javascript
Vue2.0利用vue-resource上传文件到七牛的实例代码
Jul 28 Javascript
解决Linux无法正常安装与卸载Node.js的方法
Jan 19 Javascript
vue检测对象和数组的变化分析
Jun 30 Javascript
详解Vue源码中一些util函数
Apr 24 Javascript
vue实现移动端返回顶部
Oct 12 Javascript
jquery实现加载更多&quot;转圈圈&quot;效果(示例代码)
Nov 09 jQuery
javascript实现的字符串转换成数组操作示例
Jun 13 #Javascript
javascript实现的时间格式加8小时功能示例
Jun 13 #Javascript
深入了解JavaScript代码覆盖
Jun 13 #Javascript
js使用cookie实现记住用户名功能示例
Jun 13 #Javascript
探索JavaScript中私有成员的相关知识
Jun 13 #Javascript
详解vue中的父子传值双向绑定及数据更新问题
Jun 13 #Javascript
基于Vue实现平滑过渡的拖拽排序功能
Jun 12 #Javascript
You might like
深入PHP FTP类的详解
2013/06/13 PHP
PHP获取文件的MD5值并判断是否被修改的例子
2014/06/19 PHP
兼容ie和firefox js关闭代码
2008/12/11 Javascript
jquery 操作日期、星期、元素的追加的实现代码
2012/02/07 Javascript
关于Javascript与iframe的那些事儿
2013/07/04 Javascript
js自动查找select下拉的菜单并选择(示例代码)
2014/02/26 Javascript
jQuery学习笔记之 Ajax操作篇(一) - 数据加载
2014/06/23 Javascript
jQuery中:focus选择器用法实例
2014/12/30 Javascript
Jquery中offset()和position()的区别分析
2015/02/05 Javascript
js实现select下拉框菜单
2015/12/08 Javascript
vue父子组件的数据传递示例
2017/03/07 Javascript
实战node静态文件服务器的示例代码
2018/03/08 Javascript
vue2.0路由切换后页面滚动位置不变BUG的解决方法
2018/03/14 Javascript
Rollup处理并打包JS文件项目实例代码
2018/05/31 Javascript
jQuery实现表格隔行换色
2018/09/01 jQuery
vue--点击当前增加class,其他删除class的方法
2018/09/15 Javascript
VUE2.0 ElementUI2.0表格el-table自适应高度的实现方法
2018/11/28 Javascript
javascript面向对象三大特征之封装实例详解
2019/07/24 Javascript
vue项目使用高德地图的定位及关键字搜索功能的实例代码(踩坑经验)
2020/03/07 Javascript
pygame实现简易飞机大战
2018/09/11 Python
Python闭包与装饰器原理及实例解析
2020/04/30 Python
Python3实现个位数字和十位数字对调, 其乘积不变
2020/05/03 Python
卸载tensorflow-cpu重装tensorflow-gpu操作
2020/06/23 Python
七年级生物教学反思
2014/01/30 职场文书
考试没考好检讨书
2014/01/31 职场文书
互联网电子商务专业毕业生求职信
2014/03/18 职场文书
2014年预备党员端正入党动机思想汇报
2014/09/13 职场文书
2014年党的群众路线教育实践活动整改措施(个人版)
2014/09/25 职场文书
教师自我剖析材料(四风问题)
2014/09/30 职场文书
党员干部对十八届四中全会的期盼
2014/10/17 职场文书
导游词300字
2015/02/13 职场文书
个人工作保证书
2015/02/28 职场文书
学校扫黄打非工作总结
2015/10/15 职场文书
2016年公共机构节能宣传周活动总结
2016/04/05 职场文书
关于Spring配置文件加载方式变化引发的异常详解
2022/01/18 Java/Android
Python Matplotlib绘制动画的代码详解
2022/05/30 Python