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 Ajax文件上传(php)
Jun 16 Javascript
jquery.Jwin.js 基于jquery的弹出层插件代码
May 23 Javascript
用jquery统计子菜单的条数示例代码
Oct 18 Javascript
jqGrid日期格式的判断示例代码(开始日期与结束日期)
Nov 08 Javascript
基于jQuery实现网页进度显示插件
Mar 04 Javascript
javascript html5摇一摇功能的实现
Apr 19 Javascript
Node.JS更改Windows注册表Regedit的方法小结
Aug 18 Javascript
js 概率计算(简单版)
Sep 12 Javascript
详解使用VUE搭建后台管理系统(vue-cli更新至3.0)
Aug 22 Javascript
vue.js中proxyTable 转发请求的实现方法
Sep 20 Javascript
微信小程序云开发(数据库)详解
May 17 Javascript
JS前端可扩展的低代码UI框架Sunmao使用详解
Jul 23 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
解决中英文字符串长度问题函数
2007/01/16 PHP
php横向重复区域显示二法
2008/09/25 PHP
PHP递归实现层级树状展开
2016/04/01 PHP
php微信公众账号开发之前五个坑(一)
2016/09/18 PHP
Stop SQL Server
2007/06/21 Javascript
无阻塞加载脚本分析[全]
2011/01/20 Javascript
jQuery中Ajax的get、post等方法详解
2015/01/20 Javascript
DOM基础教程之使用DOM + Css
2015/01/20 Javascript
JavaScript通过select动态更换图片的方法
2015/03/23 Javascript
jq实现左侧显示图片右侧文字滑动切换效果
2015/08/04 Javascript
jquery实现仿Flash的横向滑动菜单效果代码
2015/09/17 Javascript
分享经典的JavaScript开发技巧
2015/11/21 Javascript
vue.js利用defineProperty实现数据的双向绑定
2017/04/28 Javascript
原生js实现仿window10系统日历效果的实例
2017/10/31 Javascript
javascript读取本地文件和目录方法详解
2020/08/06 Javascript
django使用图片延时加载引起后台404错误
2017/04/18 Python
Python scikit-learn 做线性回归的示例代码
2017/11/01 Python
对变量赋值的理解--Pyton中让两个值互换的实现方法
2017/11/29 Python
同时安装Python2 &amp; Python3 cmd下版本自由选择的方法
2017/12/09 Python
理解python中生成器用法
2017/12/20 Python
python中多层嵌套列表的拆分方法
2018/07/02 Python
用uWSGI和Nginx部署Flask项目的方法示例
2019/05/05 Python
python实现BP神经网络回归预测模型
2019/08/09 Python
python生成器推导式用法简单示例
2019/10/08 Python
在python中利用try..except来代替if..else的用法
2019/12/19 Python
Python3基于print打印带颜色字符串
2020/07/06 Python
pycharm配置python 设置pip安装源为豆瓣源
2021/02/05 Python
CSS3对图片照片进行边缘模糊处理的实现
2018/08/08 HTML / CSS
css3 按钮样式简单可扩展创建
2013/03/18 HTML / CSS
美国大城市最热门旅游景点门票:CityPASS
2016/12/16 全球购物
南非最大的花卉和送礼服务:NetFlorist
2017/09/13 全球购物
高尔夫球鞋、服装、手套和装备:FootJoy
2018/12/15 全球购物
马来西亚奢侈品牌购物商城:Valiram 247
2020/09/29 全球购物
工厂仓管员岗位职责
2014/01/01 职场文书
酒店宣传语大全
2015/07/13 职场文书
2019学校请假条格式及范文
2019/06/25 职场文书