js数组常用方法总结(js数组常用的方法及用法)
myzbx 2025-07-02 23:18 25 浏览
首先说明,本文没技术含量,都是js的知识,只是为以后查阅方便。另外我们开了一个免费的讲解web前端课程,有兴趣的朋友可以去看,详情地址:
http://fe.qietu.com/forum.php
1、创建数组;
var arr = new Array(); //创建一个空数组;
var arr1 = new Array(3); //创建一个包含3项的数组,每一项都是undefined;
var arr2 = new Array("3"); //创建一个数组,只有一项为字符串3;
2、常用方法
join();
此方法可以把数组转换为字符串,接受一个参数指定数组每一项的连接符;若不加参数,默认为逗号;
例如:
var arr=[2,3,4];
arr.join(''); // "234"
arr.join('+'); // "2+3+4"
split();
此方法可以字符串转为数组;
例如:
var str="https://www.baidu.com/s?wd=javascript&rsv_spt=1&rsv_iqid=0xb5b5ce2900000036&issp=1&f=3&rsv_bp=0&rsv_idx=2&ie=utf-8&tn=baiduhome_pg";
str.split('?')[1].split('&');
//["wd=javascript", "rsv_spt=1", "rsv_iqid=0xb5b5ce2900000036", "issp=1", "f=3", "rsv_bp=0", "rsv_idx=2", "ie=utf-8", "tn=baiduhome_pg"]
push();
把元素从后面添加到数组;可以接受任意参数,返回数组的长度;
例如:
var arr=[2,3];
arr.push('d'); // 3;
alert(arr); // [2,3,"d"];
pop();
从数组末尾删除最后一项,减少数组的长度;不加参数;返回删除项;
例如:
var arr=[1,2,3];
arr.pop(); // 3;
arr; // [1, 2];
unshift();
把元素从前面添加到数组;可以接受任意参数,返回数组的长度;
例如:
var arr=[1,2,3];
arr.unshift(0); // 4
arr; // [0, 1, 2, 3]
shift();
删除数组的第一项,减少数组的长度;不加参数;返回删除项;
例如:
var arr=[0,1,2,3];
arr.shift(); //0
arr; //[1, 2, 3]
reverser();
反转数组的顺序;不够灵活更多时使用sort()方法;
例如:
var arr=[2,3,4,5]; arr.reverse();
[5, 4, 3, 2]
sort();
对数组进行排序,默认为升序(由小到大);可接受比较函数作为参数来指定如何排列;
例如:
var a=[6,4,8,1,0,9,4,2];
a.sort(function(a,b){return a-b}); // [0, 1, 2, 4, 4, 6, 8, 9]
a.sort(function(a,b){return b-a}); // [9, 8, 6, 4, 4, 2, 1, 0]
concat();
创建并返回一个新的数组;不改变原有数组;
例如:
var a=[2,3,4];
a.concat(["a","b"]); // [2, 3, 4, "a", "b"]
slice();
截取当前数组创建并返回一个新的数组;一到两个参数,分别代表起始位置和结束位置之间的项,不包含结束位置的项,当只有第一个参数,代表从参数指定位置到结尾;
例如:
var arr=[3,2,"a","c",6,"e"];
arr.slice(1,4); // [2, "a", "c"]
arr; // [3, 2, "a", "c", 6, "e"]
arr.slice(4); // [6, "e"]
splice();
功能强大;可实现插入、替换、删除方法;参数有多个;会修改原数组;
删除:可删除任意项,指定两个参数,分别代表 要删除第一项的位置和删除的项数。返回删除项
例如:
var arr=[3, 2, "a", "c", 6, "e"];
arr.splice(1,2); // [2, "a"]
arr; // [3, "c", 6, "e"]
替换:在任意位置插入任意数量的项,同时删除任意数量的项,第一个参数为起始位置,第二个参数为要删除的项数,后面分别代表要插入的每一项。删除的项数和插入的项数可以不相等。
例如:
var arr=[3, 2, "a", "c", 6, "e"];
arr.splice(2,1,"insert0","insert1");
arr; // [3, 2, "insert0", "insert1", "c", 6, "e"]
插入:在指定位置插入任意数量的项;第一个参数代表起始位置,第二个参数代表要插入的项0;如果是多个项,分别是为后面的参数
例如:
var a=[2,3,4];
a.splice(1,0,"insert0","insert1");
a; // [2, "insert0", "insert1", 3, 4]
ECMAScript 5 新方法:
注意兼容性问题,支持 chrome , IE9+ , FF2+ , Safari3+ , Opera9.5+
map();
迭代数组;对每一项运行对应的函数,参数可选值:数组项的值,该项在数组中的位置,数组对象本身 ;不会修改原数组;返回函数调用的结果组成的数组;
var arr=[1,4,3];
arr.map(function( res , n ){ return res+1 }); // [2, 5, 4]
forEach();
同map() 方法,迭代数组;对每一项运行对应的函数,无返回值;
更多迭代方法如 filter(),every(),some() 可参考其它教程
文/丁向明
做一个有博客的web前端自媒体人,专注web前端开发,关注用户体验,加我qq/微信交流:6135833
http://dingxiangming.com
相关推荐
- 掌握JavaScript中的Call和Apply,让你的代码更强大、更灵活
-
在学习JavaScript时,你可能会遇到call和apply这两个方法。它们的作用其实很相似,都是用来调用函数并设置函数内部的this值,但它们的使用方式稍有不同。想象一下,你和朋友们一起拍照。ca...
- 性能调优方面,经常要优化跑的最慢的代码,教你一种快速的方法
-
在我们遇到性能问题的时候,很多时候需要去查看性能的瓶颈在哪里,本篇文章就是提供了多种常用的方案来监控函数的运行时间。1.time首先说明,time模块很多是系统相关的,在不同的OS中可能会有一些精度差...
- call和apply的实现方式_call和apply用法
-
call和apply的实现方式1、函数Function.call()的实现//第一步简单是实现call()varfoo={value:”1”,bar:function(){conso...
- 线上问题排查:接口超时_接口超时时间设置多少合适
-
最近就看到了一个非常厉害的关于“接口超时”问题排查的帖子,从应用排查到内核级别。虽然看到后面的时候我已经有点跟不上了,但是对于整个问题排查的过程还是比较清晰的。(细节不重要,排查思路,方向值得学习)问...
- javascript中的call方法的另一种实现方式-更接近原方法
-
上集我们说到对应的我们自己实现的call方法还是有一点纰漏,这里我们就解决它//一、预备知识(简单介绍)//1、Function.prototype.call()//语法:function....
- 链接器是如何一步步发明出来的?_如何使用连接器
-
在计算机编程的早期年代,你面临一个挥之不去的的噩梦。。。你找了一个刚刚运行成功的程序仔细看了看:; main.asm - 主程序start: &nb...
- Day59:回调(callback)函数_回调 callback
-
定义Acallbackisafunctionthatispassedasanargumenttoanotherfunctionandisexecutedafteri...
- 大促数据库压力激增,如何一眼定位 SQL 执行来源?
-
作者:京东科技王奕龙你是否曾经遇到过这样的情况:在大促活动期间,用户访问量骤增,数据库的压力陡然加大,导致响应变慢甚至服务中断?更让人头疼的是,当你试图快速定位问题所在时,却发现难以确定究竟是哪个业...
- 一键追欠料!WPS表格实战MRP欠料计算-7
-
昨天第6章内容主要聚焦于本报表的核心欠料运算。通过子件库存的引用以及累计需求的计算,计算出了子件的累计欠料。累计欠料的显示方式是按日期进行逐日累加,并不能清晰的看到每张订单欠料多少?所以在今日第7章的...
- Python教程(二十五):装饰器–函数的高级用法
-
今天您将学习什么什么是装饰器以及如何创建装饰器函数装饰器和类装饰器带参数的装饰器装饰器的实际应用真实世界示例:日志记录、性能监控、缓存、权限验证什么是装饰器?装饰器是Python中的一种...
- 在 Excel 日历制作中,尤其是动态日历方案,会用到的多个函数详解
-
在Excel日历制作中,尤其是动态日历方案,会用到多个核心函数。下面我将详细解析这些函数的作用、参数和使用技巧:核心日期函数1.DATE(year,month,day)作用:创建指定日期参...
- java高级用法之:在JNA中将本地方法映射到JAVA代码中
-
简介不管是JNI还是JNA,最终调用的都是native的方法,但是对于JAVA程序来说,一定需要一个调用native方法的入口,也就是说我们需要在JAVA方法中定义需要调用的native方法。对于JN...
- 14.4 查找与引用函数综合应用 - 下
-
一、使返回错误值以简化公式例提取一二三级科目名称在下图所示的科目代码表中,A列为科目代码,B列为对应科目名称。A列科目代码中长度为4的为一级代码,长度为6的为二级代码,长度为8的为三级代码。要求根据...
- 记一次酣畅淋漓的JavaScript逆向_js逆向webpack
-
背景介绍今天在写爬虫的练习题时遇到了这样一个难题:目标资源是一个图片的url,但是不同于以往的情况,我在http响应记录里搜索这个图片的url,发现并不能搜到。从逻辑上来讲,这个url被展示到浏览器上...
- 「Postman」测试(Tests)脚本编写和断言详解
-
测试确认您的API按预期工作,服务之间的集成运行可靠,并且新开发没有破坏任何现有功能。您可以使用JavaScript为PostmanAPI请求编写测试脚本。当您的API项目出现问题时...
- 一周热门
- 最近发表
- 标签列表
-
- HTML 简介 (30)
- HTML 响应式设计 (31)
- HTML URL 编码 (32)
- HTML Web 服务器 (31)
- HTML 表单属性 (32)
- HTML 音频 (31)
- HTML5 支持 (33)
- HTML API (36)
- HTML 总结 (32)
- HTML 全局属性 (32)
- HTML 事件 (31)
- HTML 画布 (32)
- HTTP 方法 (30)
- 键盘快捷键 (30)
- CSS 语法 (35)
- CSS 轮廓宽度 (31)
- CSS 谷歌字体 (33)
- CSS 链接 (31)
- CSS 定位 (31)
- CSS 图片库 (32)
- CSS 图像精灵 (31)
- SVG 文本 (32)
- 时钟启动 (33)
- HTML 游戏 (34)
- JS Loop For (32)