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 相关文章推荐
javascript两段代码,两个小技巧
Feb 04 Javascript
js定时器怎么写?就是在特定时间执行某段程序
Oct 11 Javascript
JavaScript中join()方法的使用简介
Jun 09 Javascript
基于javascript实现九九乘法表
Mar 27 Javascript
图解prototype、proto和constructor的三角关系
Jul 31 Javascript
vue.js初学入门教程(2)
Nov 07 Javascript
javascript简单链式调用案例分析
May 10 Javascript
node.js将MongoDB数据同步到MySQL的步骤
Dec 10 Javascript
js根据需要计算数组中重复出现某个元素的个数
Jan 18 Javascript
Typescript 中的 interface 和 type 到底有什么区别详解
Jun 18 Javascript
layui表格数据复选框回显设置方法
Sep 13 Javascript
详解JavaScript的this指向和绑定
Sep 08 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与MySQL开发的8个技巧小结
2010/12/17 PHP
PHP内置的Math函数效率测试
2014/12/01 PHP
PHP实现的下载远程图片自定义函数分享
2015/01/28 PHP
php使用curl获取https请求的方法
2015/02/11 PHP
PHP文件系统管理(实例讲解)
2017/09/19 PHP
JQuery UI皮肤定制
2009/07/27 Javascript
Jquery实现列表(隔行换色,全选,鼠标滑过当前行)效果实例
2013/06/09 Javascript
用jquery方法操作radio使其默认选项是否
2013/09/10 Javascript
编写高效jQuery代码的4个原则和5个技巧
2014/04/24 Javascript
详解JavaScript操作HTML DOM的基本方式
2015/10/21 Javascript
vue.js利用Object.defineProperty实现双向绑定
2017/03/09 Javascript
BootStrap表单验证 FormValidation 调整反馈图标位置的实例代码
2017/05/17 Javascript
JavaScript表单即时验证 验证不成功不能提交
2017/08/31 Javascript
教你用Cordova打包Vue项目的方法
2017/10/17 Javascript
js实现手机web图片左右滑动效果
2017/12/29 Javascript
VUE+Element UI实现简单的表格行内编辑效果的示例的代码
2018/10/31 Javascript
JavaScript动态添加数据到表单并提交的几种方式
2019/06/26 Javascript
在漏洞利用Python代码真的很爽
2007/08/26 Python
django轻松使用富文本编辑器CKEditor的方法
2017/03/30 Python
详谈Python中列表list,元祖tuple和numpy中的array区别
2018/04/18 Python
详解python做UI界面的方法
2019/02/27 Python
使用pandas实现连续数据的离散化处理方式(分箱操作)
2019/11/22 Python
matplotlib 曲线图 和 折线图 plt.plot()实例
2020/04/17 Python
python Pexpect模块的使用
2020/12/25 Python
用HTML5 Canvas API中的clearRect()方法实现橡皮擦功能
2016/03/15 HTML / CSS
描述JSP和Servlet的区别、共同点、各自应用的范围
2012/10/02 面试题
外语专业毕业生个人的自荐信
2013/11/19 职场文书
生日主持词
2014/03/20 职场文书
党员服务承诺书
2014/05/28 职场文书
工地安全质量标语
2014/06/07 职场文书
自动化专业大学生职业生涯规划范文:爱拚才会赢
2014/09/12 职场文书
有限公司股东合作协议书
2014/10/29 职场文书
新员工试用期工作总结2015
2015/05/28 职场文书
交通安全学习心得体会
2016/01/18 职场文书
《假如》教学反思
2016/02/17 职场文书
Python用tkinter实现自定义记事本的方法详解
2022/03/31 Python