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 相关文章推荐
脚本收藏iframe
Jul 21 Javascript
如何确保JavaScript的执行顺序 之jQuery.html并非万能钥匙
Mar 03 Javascript
jquery实现先淡出再折叠收起的动画效果
Aug 07 Javascript
Bootstrap前端开发案例二
Jun 17 Javascript
Bootstrap 网站实例之单页营销网站
Oct 20 Javascript
jQuery学习笔记——jqGrid的使用记录(实现分页、搜索功能)
Nov 09 Javascript
JavaScript实现兼容IE6的收起折叠与展开效果实例
Sep 20 Javascript
详解webpack与SPA实践之开发环境搭建
Dec 18 Javascript
解决vue-cli项目打包出现空白页和路径错误的问题
Sep 04 Javascript
vue 本地环境跨域请求proxyTable的方法
Sep 19 Javascript
webpack 如何解析代码模块路径的实现
Sep 04 Javascript
p5.js码绘“跳动的小正方形”的实现代码
Oct 22 Javascript
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
使用Curl进行抓取远程内容时url中文编码问题示例探讨
2013/10/29 PHP
PHP使用gmdate实现将一个UNIX 时间格式化成GMT文本的方法
2015/03/19 PHP
php支持中文字符串分割的函数
2015/05/28 PHP
Zend Framework教程之请求对象的封装Zend_Controller_Request实例详解
2016/03/07 PHP
PHP7中I/O模型内核剖析详解
2019/04/14 PHP
在次封装easyui-Dialog插件实现代码
2010/11/14 Javascript
面向对象的Javascript之一(初识Javascript)
2012/01/20 Javascript
js使用removeChild方法动态删除div元素
2014/08/01 Javascript
JS判断浏览器是否安装flash插件的简单方法
2016/09/13 Javascript
Angularjs实现带查找筛选功能的select下拉框示例代码
2016/10/04 Javascript
js原生日历的实例(推荐)
2017/10/31 Javascript
vue.js实现格式化时间并每秒更新显示功能示例
2018/07/07 Javascript
详解基于Vue,Nginx的前后端不分离部署教程
2018/12/04 Javascript
vue中利用simplemde实现markdown编辑器(增加图片上传功能)
2019/04/29 Javascript
Javascript数组方法reduce的妙用之处分享
2019/06/10 Javascript
Vue+Element UI 树形控件整合下拉功能菜单(tree + dropdown +input)
2020/08/28 Javascript
python获取目录下所有文件的方法
2015/06/01 Python
浅谈Python 对象内存占用
2016/07/15 Python
Django接受前端数据的几种方法总结
2016/11/04 Python
python多线程socket编程之多客户端接入
2017/09/12 Python
Python+matplotlib实现填充螺旋实例
2018/01/15 Python
python 将字符串转换成字典dict的各种方式总结
2018/03/23 Python
Numpy之文件存取的示例代码
2018/08/03 Python
YUV转为jpg图像的实现
2019/12/09 Python
pytorch中 gpu与gpu、gpu与cpu 在load时相互转化操作
2020/05/25 Python
matplotlib教程——强大的python作图工具库
2020/10/15 Python
Python自动化办公Excel模块openpyxl原理及用法解析
2020/11/05 Python
简历自我评价怎么写好呢?
2014/01/04 职场文书
仓库管理制度
2014/01/21 职场文书
装修五一活动策划案
2014/01/23 职场文书
聚美优品陈欧广告词
2014/03/14 职场文书
小学课外阅读总结
2014/07/09 职场文书
大学学生会辞职信
2015/05/13 职场文书
奖励申请报告范文
2015/05/15 职场文书
2019年国庆祝福语(70句)
2019/09/19 职场文书
【海涛解说】史上最给力比赛,挑战DOTA极限
2022/04/01 DOTA