JS数组(Array)处理函数总结
1、push() 向数组的末尾添加一个或更多元素,并返回新的长度
例如:
1 <script type="text/javascript">
2 var arr = ["George", "John", "Thomas"];
3 document.write(arr + "<br/>");
4 document.write(arr.push("James") + "<br/>");
5 document.write(arr);
6 </script>
输出结果:
George,John,Thomas
4
George,John,Thomas,James
2、pop() 删除并返回数组的最后一个元素
pop()方法将删除数组的最后一个元素,把数组长度减 1,并且返回它删除的元素的值。
如果数组已经为空,则pop()不改变数组,并返回undefined值
例如:
1 <script type="text/javascript">
2 var arr = ["George", "John", "Thomas"];
3 document.write(arr + "<br/>");
4 document.write(arr.pop() + "<br/>");
5 document.write(arr);
6 </script>
输出结果:
George,John,Thomas
Thomas
George,John
3、unshift() 向数组的开头添加一个或更多元素,并返回新的长度
例如:
1 <script type="text/javascript">
2 var arr = ["George", "John", "Thomas"];
3 document.write(arr + "<br/>");
4 document.write(arr.unshift("James") + "<br/>");
5 document.write(arr);
6 </script>
输出结果:
George,John,Thomas
4
James,George,John,Thomas
4、shift() 删除并返回数组的第一个元素
例如:
1 <script type="text/javascript">
2 var arr = ["George", "John", "Thomas"];
3 document.write(arr + "<br/>");
4 document.write(arr.shift() + "<br/>");
5 document.write(arr);
6 </script>
输出结果:
George,John,Thomas
George
John,Thomas
5、reverse() 颠倒数组中元素的顺序
例如:
1 <script type="text/javascript">
2 var arr = ["George", "John", "Thomas"];
3 document.write(arr + "<br/>");
4 document.write(arr.reverse());
5 </script>
输出结果:
George,John,Thomas
Thomas,John,George
6、sort() 对数组的元素进行排序
对数组的引用。请注意,数组在原数组上进行排序,不生成副本
该方法默认是按照字符编码(ASCII)的顺序进行排序的
例如:
1 <script type="text/javascript">
2 var arr = new Array(6);
3 arr[0] = "John";
4 arr[1] = "George";
5 arr[2] = "Thomas";
6 document.write(arr + "<br/>");
7 document.write(arr.sort());
8 </script>
输出结果:
John,George,Thomas
George,John,Thomas
再来看一个例子:
1 <script type="text/javascript">
2 var arr = new Array(6);
3 arr[0] = 10
4 arr[1] = 5
5 arr[2] = 40
6 arr[3] = 25
7 arr[4] = 1000
8 arr[5] = 1
9 document.write(arr + "<br/>");
10 document.write(arr.sort());
11 </script>
输出结果:
10,5,40,25,1000,1
1,10,1000,25,40,5
我们可以看到,并非是按照我们认为的按数字大小排序,如果想按照数字大小排序,则需要改变默认的排序方式,自行指定排序规则。
如下:
1 <script type="text/javascript">
2 var arr = new Array(6);
3 arr[0] = 10
4 arr[1] = 5
5 arr[2] = 40
6 arr[3] = 25
7 arr[4] = 1000
8 arr[5] = 1
9 document.write(arr + "<br/>");
10 document.write(arr.sort(function (a, b) {return a - b;}));// 从大到小
11 </script>
输出结果:
10,5,40,25,1000,1
1,5,10,25,40,1000
如果想要降序排列呢?
将排序规则改为:
function (a, b) {return b - a;}
就OK了
7、concat() 连接两个或更多的数组
该方法不会改变现有的数组,而仅仅会返回被连接数组的一个副本。
例如:
<script type="text/javascript">
var arr = [1, 2, 3];
var arr1 = [11, 22, 33];
document.write(arr.concat(4, 5, arr1));
</script>
输出结果:
1,2,3,4,5,11,22,33
8、join()
把数组的所有元素放入一个字符串。元素通过指定的分隔符进行分隔。
例如:
<script type="text/javascript">
var arr = ['item 1', 'item 2', 'item 3'];
var list = '<ul><li>' + arr.join('</li><li>') + '</li></ul>';
</script>
list结果:
'<ul><li>item 1</li><li>item 2</li><li>item 3</li></ul>'
这是迄今为止最快的方法!使用原生代码(如 join()),不管系统内部做了什么,通常比非原生快很多。——James Padolsey, james.padolsey.com
9、slice(start,end) 从某个已有的数组返回选定的元素
请注意,该方法并不会修改数组,而是返回一个子数组
例如:
<script type="text/javascript">
var arr = ["George", "John", "Thomas"];
document.write(arr + "<br/>");
document.write(arr.slice(1) + "<br/>"); // 从第一个元素开始截取到 数组结尾
document.write(arr);
</script>
输出结果:
George,John,Thomas
John,Thomas
George,John,Thomas
10、splice() 删除元素,并向数组添加新元素
splice() 方法与 slice() 方法的作用是不同的,splice() 方法会直接对数组进行修改
(1)删除指定范围的数组元素:
<script type="text/javascript">
var arr = new Array(6);
arr[0] = "George";
arr[1] = "John";
arr[2] = "Thomas";
arr[3] = "James";
arr[4] = "Adrew";
arr[5] = "Martin"; document.write(arr + "<br/>");
arr.splice(2, 3); // 删除第三个元素以后的三个数组元素(包含第三个元素)
document.write(arr);
</script>
输出结果:
George,John,Thomas,James,Adrew,Martin
George,John,Martin
(2)从指定下标开始插入指定元素(元素个数不限):
<script type="text/javascript">
var arr = new Array(6);
arr[0] = "George";
arr[1] = "John";
arr[2] = "Thomas";
arr[3] = "James";
arr[4] = "Adrew";
arr[5] = "Martin"; document.write(arr + "<br/>");
arr.splice(2, 0, "William","JACK"); // 在第三个元素之前插入"William","JACK"
document.write(arr);
</script>
输出结果:
George,John,Thomas,James,Adrew,Martin
George,John,William,JACK,Thomas,James,Adrew,Martin
(3)删除指定范围的数组元素,并用指定元素替换(元素个数不限):
<script type="text/javascript">
var arr = new Array(6);
arr[0] = "George";
arr[1] = "John";
arr[2] = "Thomas";
arr[3] = "James";
arr[4] = "Adrew";
arr[5] = "Martin"; document.write(arr + "<br/>");
arr.splice(2,3,"William","JACK"); // 删除第三个元素以后的三个数组元素(包含第三个元素),并用"William","JACK"进行替换
document.write(arr);
</script>
输出结果:
George,John,Thomas,James,Adrew,Martin
George,John,William,JACK,Martin
以下为最新补充(2017-07-14):
11,查找数据元素位置的方法
indexOf和lastIndexOf接受两个参数:要查找的项和表示查找起点位置的索引。
indexOf: 从前往后查找。例如:
var arr = [10, 11, 12, 13, 14, 15, 12, 18];
console.log(arr.indexOf(12)); // 2
console.log(arr.indexOf(12, 3)); // 6
lastIndexOf: 从后往前查找。例如:
var arr = [10, 11, 12, 13, 14, 15, 12, 18];
console.log(arr.lastIndexOf(12)); // 6
console.log(arr.lastIndexOf(12, 2)); // 2
12,迭代方法
ECMAScript为数据定义了五个迭代方法:
every(): 数组的每一项都满足给定条件则返回true。例如:
var arr = [1,2,3,4,5];
var everyResult = arr.every(function(item, index, array) {
return item > 2;
});
console.log(everyResult); // false,由于不是每一项都满足(item > 2)
some(): 数组中只需有一项满足给定条件则返回true。例如:
var arr = [1,2,3,4,5];
var everyResult = arr.some(function(item, index, array) {
return item > 2;
});
console.log(everyResult); // true, 由于至少有一项满足条件(item > 2)
filter(): 返回所有满足给定条件的数据项所组成的新数组。例如:
var arr = [1,2,3,4,5];
var everyResult = arr.filter(function(item, index, array) {
return item > 2;
});
console.log(everyResult); // [3, 4, 5]
console.log(arr); // [1,2,3,4,5]
map():对数组的每一项应用给定条件,返回新的数组。例如:
var arr = [1,2,3,4,5];
var everyResult = arr.map(function(item, index, array) {
return item * 2;
});
console.log(everyResult); // [2, 4, 6, 8, 10]
console.log(arr); // [1,2,3,4,5]
forEach(): 数组遍历,与for循环一样。例如:
var arr = [1,2,3,4,5];
arr.forEach(function(item, index, array) {
// 执行某些操作
});
13,归并方法
reduce()和reduceRight(), 这两个方法只是遍历方向不同。
var arr = [1,2,3,4,5];
var sum = arr.reduce(function(prev, cur, index, array){
return prev + cur;
});
console.log(sum); // 15
这个函数返回的任何值都会作为第一个参数传给下一项。
JS数组(Array)处理函数总结的更多相关文章
- JS数组array常用方法
JS数组array常用方法 1.检测数组 1)检测对象是否为数组,使用instanceof 操作符 if(value instanceof Array) { //对数组执行某些操作 } 2)获取对象的 ...
- JS: 数组的循环函数
JS 数组相关的循环函数,用得挺多,所以有些坑还是要去踩一下,先来看一道面试题. 注意:下面提到的不改变原数组仅针对基本数据类型. 面试题 模拟实现数组的 map 函数. 心中有答案了吗?我的答案放在 ...
- 【转】 js数组 Array 交集 并集 差集 去重
原文:http://blog.csdn.net/ma_jiang/article/details/52672762 最劲项目需要用到js数组去重和交集的一些运算,我的数组元素个数可能到达1000以上, ...
- js数组的splice函数
一直没搞懂数组的splice函数,今天稍微测试了一下,了解了它的功能,在这里记录一下 1.测试 测试① var a = [1,2,3]; console.info(a.splice(1,1)); co ...
- js — 数组Array
目录 1. isArray 2. 转换方法 3. 分割字符串 join 4. 栈方法 5. 队列方法 6. 重排序方法 7. 操作方法 8. 位置方法 - 索引 9. 迭代方法 数组 array 解释 ...
- 「面试指南」JS数组Array常用算法,Array算法的一般解答思路
先看一道面试题 在 LeetCode 中有这么一道简单的数组算法题: // 给定一个整数数组 nums 和一个目标值 target, // 请你在该数组中找出和为目标值的那两个整数,并返回他们的数组下 ...
- [学习笔记]JS 数组Array push相关问题
前言: 今天用写了一个二维数组,都赋值为零,然后更新其中一个值,结果和预期是不一样,会整列的相同位置都是同一个值. 1.用Chrome的控制台样例如下: arrs[2][2] =1的赋值,竟然是三个数 ...
- JS数组 Array
1.创建数组 var array=new Array(); 2.添加数组 array.push("111"); array.push("111"); array ...
- js 数组array es5-es6+ 新增方法函数
arr.forEach(function(item,index,arr){},this) 相当于普通的for循环,第一个回调参数,第二个this可以重定向[箭头函数则不生效] arr.map() 非 ...
随机推荐
- Python标准库10 多进程初步 (multiprocessing包)
作者:Vamei 出处:http://www.cnblogs.com/vamei 欢迎转载,也请保留这段声明.谢谢! 我们已经见过了使用subprocess包来创建子进程,但这个包有两个很大的局限性: ...
- U盘安装Linux CentOS 6.5 64位操作系统(来自互联网)
从centOS6.5开始直接把iso文件写入u盘就行了. 方法1:windows平台:1.用UltraISO打开iso(如:CentOS-6.5-x86_64-bin-DVD1.iso)2.然后点“启 ...
- oracle常用的数据迁移方法
源地址:http://wenku.baidu.com/link?url=lI6UYpvDs_y8ku6DytEZLl4GSJjQ0GAGPvv8txrbRoQKgqzTCMAfBZI5mn9t-KQk ...
- (easy)LeetCode 228.Summary Ranges
Given a sorted integer array without duplicates, return the summary of its ranges. For example, give ...
- python通过163邮箱发送邮件
from email.mime.multipart import MIMEMultipart from email.mime.text import MIMEText import smtplib i ...
- 重设mysql的root密码,MAC OSX
前些天装得mysql突然链接不上了,原谅我小白,没有在安装后改密码,mysql初始登陆不需要密码,但是之后root是有个临时密码的,然后..然后就登不上了. 网上有很多改密码的帖子,关键的UPDATE ...
- Powerdesigner 导出Excel格式数据字典 导出Excel格式文件
版权声明:本文为博主原创文章,转载请注明出处; 网上我也看到了很多的Powerdesigner 导出方法,因为Powerdesigner 提供了部分VBA功能,所以让我用代码导出Excel格式文件得以 ...
- 转——Android应用开发性能优化完全分析
[工匠若水 http://blog.csdn.net/yanbober 转载请注明出处.] 1 背景 其实有点不想写这篇文章的,但是又想写,有些矛盾.不想写的原因是随便上网一搜一堆关于性能的建议,感觉 ...
- Win2D 官方文章系列翻译 - 避免内存泄漏
本文为个人博客备份文章,原文地址: http://validvoid.net/win2d-avoiding-memory-leaks/ 在托管 XAML 应用中使用 Win2D 控件时,必须谨慎处理对 ...
- 002..NET MVC实现自己的TempBag
原文链接:http://www.dotnetbips.com/articles/bc422c95-02cc-4d05-9c5c-fa89d0e78cc0.aspx 1.前言 本来今天是想发那篇关于在W ...