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 相关文章推荐
DOM_window对象属性之--clipboardData对象操作代码
Feb 03 Javascript
javascript loadScript异步加载脚本示例讲解
Nov 14 Javascript
使用jquery.validate自定义方法实现&quot;手机号码或者固话至少填写一个&quot;的逻辑验证
Sep 01 Javascript
jQuery中prevAll()方法用法实例
Jan 08 Javascript
Jqgrid之强大的表格插件应用
Dec 02 Javascript
jQuery插件支持同一页面被多次调用
Feb 14 Javascript
jQuery animate easing使用方法图文详解
Jun 17 Javascript
Vue.js实战之使用Vuex + axios发送请求详解
Apr 04 Javascript
微信小程序实践之动态控制组件的显示/隐藏功能
Jul 18 Javascript
解决vue中监听input只能输入数字及英文或者其他情况的问题
Aug 30 Javascript
浅谈关于vue中scss公用的解决方案
Dec 02 Javascript
解决Vue项目中tff报错的问题
Oct 21 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
后宫无数却洁身自好的男主,唐三只爱小舞
2020/03/02 国漫
PHP处理Oracle的CLOB实例
2014/11/03 PHP
DEDECMS首页调用图片集里的多张图片
2015/06/05 PHP
zend framework重定向方法小结
2016/05/28 PHP
thinkPHP自动验证机制详解
2016/12/05 PHP
浅谈PHP中类和对象的相关函数
2017/04/26 PHP
AutoSave/自动存储功能实现
2007/03/24 Javascript
JavaScript 应用类库代码
2008/06/02 Javascript
javascript eval函数深入认识
2009/02/21 Javascript
20个最新的jQuery插件
2012/01/13 Javascript
jQuery 1.7.2中getAll方法的疑惑分析
2012/05/23 Javascript
Jquery动态改变图片IMG的src地址示例
2013/06/25 Javascript
我用的一些Node.js开发工具、开发包、框架等总结
2014/09/25 Javascript
仅30行代码实现Javascript中的MVC
2016/02/15 Javascript
利用Vue.js指令实现全选功能
2016/09/08 Javascript
Bootstrap按钮组简单实现代码
2017/03/06 Javascript
JS中利用localStorage防止页面动态添加数据刷新后数据丢失
2017/03/10 Javascript
微信小程序之发送短信倒计时功能
2017/08/30 Javascript
解决vue项目使用font-awesome,build后路径的问题
2018/09/01 Javascript
解决微信浏览器缓存站点入口文件(IIS部署Vue项目)
2019/06/17 Javascript
微信小程序向Java后台传输参数的方法实现
2020/12/10 Javascript
[01:05:40]VG vs Newbee 2018国际邀请赛小组赛BO2 第二场 8.17
2018/08/20 DOTA
Python中的zip函数使用示例
2015/01/29 Python
详解Python的Django框架中的通用视图
2015/05/04 Python
Django视图和URL配置详解
2018/01/31 Python
Python(Django)项目与Apache的管理交互的方法
2018/05/16 Python
Python3 获取一大段文本之间两个关键字之间的内容方法
2018/10/11 Python
python元组的概念知识点
2019/11/19 Python
用python实现一个简单的验证码
2020/12/09 Python
css3 仿写阿里云水纹效果的示例代码
2018/02/10 HTML / CSS
css3的focus-within选择器的使用
2020/05/11 HTML / CSS
服务行业个人求职的自我评价
2013/12/12 职场文书
超级搞笑检讨书
2014/01/15 职场文书
纪律教育学习心得体会
2014/09/02 职场文书
2019银行竞聘书
2019/06/21 职场文书
讲解MySQL增删改操作
2022/05/06 MySQL