超详细的javascript数组方法汇总
一、数组的常用方法
1：join();
将数组转为字符串显示。不输入参数，默认以逗号连接；输入参数，则以参数连接。
var arr=[1,2,3];console.log(arr.join()); // 1,2,3;console.log(arr.join("_")); // 1_2_3;console.log(arr); // [1,2,3];原数组不变。
2：reverse();
将数组逆序排列，原数组被修改。
var arr=[1,2,3];var arr2=arr.reverse();console.log(arr2); // [3,2,1];console.log(arr); // [3,2,1];
3：sort();
默认按升序排列数组项，调用每个数组项的toString()方法，然后比较得到的字符串，从字符串首位开始比较。
var arr=[2,12,14,21,5];console.log(arr.sort()); //[12, 14, 2, 21, 5];
也可以传入一个比较函数作为参数。如果第一个参数应该在前，则比较函数返回一个小于0的值；反之第一个参数在后，这比较函数返回一个大于0的值；如果顺序无关紧要，则比较函数返回0；
var arr=[2,12,14,21,5];console.log(arr.sort(function(a,b){return a-b})); // [2,5,12,14,21]; var arr1=[2,12,14,21,5];console.log(arr1.sort(function(a,b){return b-a})); // [21,14,12,5,2];4：concat();
数组合并，原数组不变。
var arr=[1,2,3];console.log(arr.concat(4,5)); // [1, 2, 3, 4, 5];console.log(arr.concat([4,5],6)); // [1, 2, 3, 4, 5, 6];console.log(arr.concat([[4,5],6])); // [1, 2, 3, [4, 5],6];console.log(arr); // [1, 2, 3];
5：slice();
返回部分数组，包含第一个参数所对应的数组项，但不包含第二个参数对应的数组项。如果传入的参数小于0，则从后往前数，最后一项为-1。如果只传入一个参数，则返回的数组包含起始位置到数组结尾的所有元素。原数组不变。
var arr=[1,2,3,4,5];console.log(arr.slice(1,3)); // [2,3];console.log(arr.slice(1)); // [2,3,4,5];console.log(arr.slice(1,-1)); // [2,3,4];console.log(arr); // [1,2,3,4,5];
6：splice();
数组拼接：
1).删除-用于删除元素，两个参数，第一个参数（要删除第一项的位置），第二个参数（要删除的项数）;
2).插入-向数组指定位置插入任意项元素。三个参数，第一个参数（其实位置），第二个参数（0），第三个参数（插入的项）;
3).替换-向数组指定位置插入任意项元素，同时删除任意数量的项，三个参数。第一个参数（起始位置），第二个参数（删除的项数），第三个参数（插入任意数量的项）;
splice()返回一个由删除元素组成的数组，或者如果没有删除元素就返回一个空数组。原数组被修改。
var arr=[1,2,3,4,5,6];console.log(arr.splice(2)); // [3,4,5,6];console.log(arr); // [1,2];console.log(arr.splice(2,0,3,4,5,6)); // [];console.log(arr); // [1,2,3,4,5,6];console.log(arr.splice(2,2)); // [3,4];console.log(arr); // [1,2,5,6];
7：push()和pop()方法，unshift()和shift()方法;
push()和pop() 栈方法，后进先出。原数组都发生改变。
push()方法在数组的尾部添加一个或多个元素，并返回数组新的长度。
pop()方法删除数组的最后一个元素，减小数组的长度并返回删除的值。
unshift()和shift()队列方法，先进先出。原数组都发生改变。
unshift()方法在数组的头部添加一个或多个元素，并改变已存在元素的索引，然后返回数组新的长度。
shift()方法删除数组的第一个元素并将其返回，并改变已存在元素的索引。
var arr=[1,2,3];console.log(arr.push(4)); //4;console.log(arr); //[1,2,3,4];console.log(arr.pop()); //4;console.log(arr); //[1,2,3];console.log(arr.unshift(0)); //4;console.log(arr); //[0,1,2,3];console.log(arr.shift()); //0;console.log(arr); //[1,2,3];
8：forEach();
forEach()里第一个参数为该集合里的元素，第二个参数为集合里的索引，第三个参数为集合本身。
9：map();
map()对数组中的每一项运行给定函数，返回每次函数调用的结果组成的数组，原数组未被修改。
10：every()
对数组的每一项运行给定函数，如果该函数对每一项都返回true，则返回true。
11：some()
对数组的每一项运行给定函数，如果该函数对任一项返回true，则返回true。
12：filter()
对数组中的每一项运行给定函数，返回该函数会返回true的项组成的数组。
13：reduce()和reduceRight();
两个方法都会迭代数组的所有项，然后构建一个最终返回的值。其中reduce()方法从数组的第一项开始，逐个遍历到最后。而reduceRight()则从数组的最后一项开始，向前遍历到第一项。数组未被修改。
二、扩展方法
1：数组去重
function unique(array){ return array.filter(function(item,index){ return array.indexOf(item)==index; })};var arr=[1,2,3,3,4,2,1,5];console.log(unique(arr)); //[1,2,3,4,5];function unique(arr){ var arr2=[arr[0]], len=arr.length; if(!len){ return; } for(var i=0;i<len;i++){ arr2.join(" ").indexOf(arr[i])<0?arr2.push(arr[i]):""; } return arr2;}var arr=[1,2,3,3,4,2,1,5];console.log(uniq(arr)); //[1,2,3,4,5] 2：去掉数组中的空元素
function deleteNullInArray(array){ return array.filter(function(item){ return item!=null; }) }var arr=[1,2,null,,,5];console.log(deleteNullInArray(arr)); //[1,2,5];相关文章
- 在php中eval是一个函数并且不能直接禁用了，但eval函数又相当的危险了经常会出现一些问题了，今天我们就一起来看看eval函数对数组的操作 例子， <?php $data="array...2016-11-25
使用PHP+JavaScript将HTML页面转换为图片的实例分享
这篇文章主要介绍了使用PHP+JavaScript将HTML元素转换为图片的实例分享,文后结果的截图只能体现出替换的字体,也不能说将静态页面转为图片可以加快加载,只是这种做法比较interesting XD需要的朋友可以参考下...2016-04-19- 这篇文章主要介绍了Python 图片转数组,二进制互转操作，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧...2021-03-09
- 在昨天的《Javascript权威指南》学习笔记之十：ECMAScript 5 增强的对象模型一文中，对于一段代码的调试出现了一个奇怪现象，现将源代码贴在下面： 复制代码 代码如下: <script type="text/javascript"> function Person(){}...2014-05-31
- 最近做一个小项目不可避免的需要前端脚本与后台进行交互。由于是在asp.net中实现，故问题演化成asp.net中jiavascript与后台c#如何进行交互。...2020-06-25
- 复制代码 代码如下: //element:需要添加新样式的元素，value：新的样式 function addClass(element, value ){ if (!element.className){ element.className = value; }else { newClassName = element.className; newClas...2014-05-31
- 在javascritp中，不一定只有对象方法的上下文中才有this， 全局函数调用和其他的几种不同的上下文中也有this指代。 它可以是全局对象、当前对象或者任意对象，这完全取决于函数的调用方式。JavaScript 中函数的调用有以下...2015-03-15
- 本文章提供在量的数据中级操作实例有如对键名比较计算数组的差集 计算差集 给指定数组中插入一个元素 反转数组 交集赋值新的数组实例。 //定义回调函数 funct...2016-11-25
- 首先，我想到的是另建一个结果数组，用来存储原始数组中不重复的数据。遍历原始数组依次跟结果数组中的元素进行比较，检测是否重复。于是乎，我写出了如下代码A： Array.prototype.clearRepetitionA = function(){ var resul...2015-11-08
- 有一道js面试题，题目是这样的：下列代码的执行结果是什么，为什么？ 复制代码 代码如下: var i, j, k; for (i=0, j=0; i<10, j<6; i++, j++) { k = i+j; } document.write(k); 答案是显示10，这道题主要考察JavaScript的逗...2015-03-15
- 事件触发器从字面意思上可以很好的理解，就是用来触发事件的，但是有些没有用过的朋友可能就会迷惑了，事件不是通常都由用户在页面上的实际操作来触发的吗？这个观点不完全正确，因为有些事件必须由程序来实现，如自定义事件，jQue...2014-06-07
- 这篇文章主要介绍了C#二维数组基本用法,以实例形式分析了C#中二维数组的定义、初始化、遍历及打印等用法,具有一定参考借鉴价值,需要的朋友可以参考下...2020-06-25
- 这篇文章主要介绍了Javascript类型转换的规则实例解析，涉及到javascript类型转换相关知识，对本文感兴趣的朋友一起学习吧...2016-02-27
- 1、ActiveX向Javascript传参 复制代码 代码如下: <script language="javascript" for="objectname" event="fun1(arg)"> fun2(arg); </script> objectname为ActiveX控件名，通过<object>标签里的id属性设定,如下； 复制...2014-06-07
- 通过 HTML DOM，可访问 JavaScript HTML 文档的所有元素。 HTML DOM (文档对象模型) 当网页被加载时，浏览器会创建页面的文档对象模型（Document Object Model）。 HTML DOM 模型被构造为对象的树： 通过可编程的对象模型，Java...2015-10-23
- Array数组在C#中同样是最基本的数据结构,下面为大家C#数组的常用操作方法小结,皆为细小的代码段,欢迎收看收藏...2020-06-25
- 下面一段代码给大家介绍php curl模拟post请求的示例代码，具体代码如下： <?php$uri = "http://www.cnblogs.com/test.php";//这里换成自己的服务器的地址// 参数数组$data = array ( 'name' => 'tanteng'// 'passwor...2015-11-24
- Window有navigator对象让我们得知浏览器的全部信息.我们可以利用一系列的API函数得知浏览器的信息.JavaScript代码如下:function message(){ txt = "<p>浏览器代码名: " + navigator.appCodeName + "</p>";txt+= "<p>...2015-11-24
- 虽然ES6都还没真正发布，但已经有用ES6重写的程序了，各种关于ES789的提议已经开始了，这你敢信。潮流不是我等大众所能追赶的。潮流虽然太快，但我们不停下学习的步伐，就不会被潮流丢下的，下面来领略下ES6中新特性，一堵新生代JS...2015-11-24
- 神马是“解释器模式”？先翻开《GOF》看看Definition：给定一个语言，定义它的文法的一种表示，并定义一个解释器，这个解释器使用该表示来解释语言中的句子。在开篇之前还是要科普几个概念： 抽象语法树： 解释器模式并未解释如...2014-06-07