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 相关文章推荐
jquery.validate使用攻略 第三部
Jul 01 Javascript
各种页面定时跳转(倒计时跳转)代码总结
Oct 24 Javascript
jQuery的cookie插件实现保存用户登陆信息
Apr 15 Javascript
借助javascript代码判断网页是静态还是伪静态
May 05 Javascript
node.js实现逐行读取文件内容的代码
Jun 27 Javascript
JavaScript控制table某列不显示的方法
Mar 16 Javascript
原生js和css实现图片轮播效果
Feb 07 Javascript
ECMAScript6变量的解构赋值实例详解
Sep 19 Javascript
vue编译打包本地查看index文件的方法
Feb 23 Javascript
vue中组件的过渡动画及实现代码
Nov 21 Javascript
在Vant的基础上封装下拉日期控件的代码示例
Dec 05 Javascript
vue实现商城秒杀倒计时功能
Dec 12 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
PHP实现负载均衡下的session共用功能
2018/04/17 PHP
PHP实现的简单留言板功能示例【基于thinkPHP框架】
2018/12/07 PHP
Javascript 面向对象 命名空间
2010/05/13 Javascript
js计算两个时间之间天数差的实例代码
2013/11/19 Javascript
把jQuery的类、插件封装成seajs的模块的方法
2014/03/12 Javascript
在JavaScript中处理时间之getHours()方法的使用
2015/06/10 Javascript
jQuery实现点击后标记当前菜单位置(背景高亮菜单)效果
2015/08/22 Javascript
javascript 判断两个日期之差的示例代码
2015/09/05 Javascript
jQuery 实现ajax传入参数含有特殊字符的方法总结
2016/10/17 Javascript
基于bootstrap风格的弹框插件
2016/12/28 Javascript
tablesorter.js表格排序使用方法(支持中文排序)
2017/02/10 Javascript
jQuery实现链接的title快速出现的方法
2017/02/20 Javascript
JS实现二叉查找树的建立以及一些遍历方法实现
2017/04/17 Javascript
详细分析单线程JS执行问题
2017/11/22 Javascript
JS实现简单的星期格式转换功能示例
2018/07/23 Javascript
Vue项目全局配置页面缓存之按需读取缓存的实现详解
2018/08/01 Javascript
vue修改对象的属性值后页面不重新渲染的实例
2018/08/09 Javascript
微信小程序按钮去除边框线分享页面功能
2018/08/27 Javascript
微信小程序图片自适应实现解析
2020/01/21 Javascript
小程序中使用css var变量(使js可以动态设置css样式属性)
2020/03/31 Javascript
python实现ftp客户端示例分享
2014/02/17 Python
详解Python中的正则表达式的用法
2015/04/09 Python
Python多进程同步简单实现代码
2016/04/27 Python
使用Python开发SQLite代理服务器的方法
2018/12/07 Python
python 对多个csv文件分别进行处理的方法
2019/01/07 Python
numpy下的flatten()函数用法详解
2019/05/27 Python
python hashlib加密实现代码
2019/10/17 Python
德国二手设计师时装和复古时装跳蚤市场:Mädchenflohmarkt
2020/11/09 全球购物
通用求职信范文模板分享
2013/12/27 职场文书
《中国的气候》教学反思
2014/02/23 职场文书
讲座主持词
2014/03/20 职场文书
地下停车场租赁协议范本
2014/10/07 职场文书
2014年打非治违工作总结
2014/11/13 职场文书
卡特教练观后感
2015/06/08 职场文书
创业项目(超低成本创业项目)
2019/08/16 职场文书
Nginx如何配置根据路径转发详解
2022/07/23 Servers