JavaScript —— 数组
Array方法
1、查找元素
indexOf()用来查找传进来的参数在目标数组中是否存在。如果目标数组包含该参数,就返回该元素在数组中的索引;如果不包含,就返回-1。
如果数组中包含多个相同的元素,indexOf()函数总是返回第一个与参数相同的元素的所有。有另外一个功能与之相似的函数:lastIndexOf(),该函数返回相同元素中最后一个元素的索引,如果没找到相同元素,则返回-1。
1. var names = ["David", "Cynthia", "Raymond", "Clayton", "Jennifer"];
2.
3. var pos = names.indexOf("Raymond");
4. if (pos >= 0) {
5. console.log("Found Raymond at position " + pos);
6. } else {
7. console.log("Raymond not found in array.");
8. }
9.
10. // >>> 输出 Found Raymond at position 2
2、数组的字符串表示
有两个方法可以将数组转化为字符串:join()和toString()。这两个方法都返回一个包含数组所有元素的字符串,各元素之间用逗号分隔开。
1. var names = ["David", "Cynthia", "Raymond", "Clayton", "Jennifer"];
2.
3. var namestr = names.join();
4. console.log(namestr); // David,Cynthia,Raymond,Clayton,Jennifer
5.
6. namestr = names.toString();
7. console.log(namestr); // David,Cynthia,Raymond,Clayton,Jennifer
3、由已有数组创建新数组
concat()和splice()方法允许通过已有数组创建新数组。Concat方法可以合并多个数组创建一个新数组,splice()方法截取一个数组的子集创建一个新数组。
concat()方法的工作原理:该方法的发起者是一个数组,参数是另一个数组。作为参数的素组,其中的所有元素都被连接到调用concat()方法的数组后面。
1. var cisDept = ["Mike", "Clayton", "Terrill", "Danny", "Jennifer"];
2. var dmpDept = ["Raymond", "Cynthia", "Bryan"];
3.
4. var itDiv = cis.concat(dmpDept);
5. console.log(itDiv); // ["Mike", "Clayton", "Terrill", "Danny", "Jennifer", "Raymond", "Cynthia", "Bryan"]
6.
7. itDiv = dmpDept.concat(cisDept);
8. console.log(itDiv); // ["Raymond", "Cynthia", "Bryan", "Mike", "Clayton", "Terrill", "Danny", "Jennifer"]
splice()方法从现有数组里截取一个新数组。该方法的第一个参数是截取的起始索引,第二个参数是截取的长度。
1. var itDiv = ["Mike", "Clayton", "Terrill", "Raymond", "Cynthia", "Danny", "Jennifer"];
2. var dmpDept = itDiv.splice(3, 3);
3.
4. console.log(dmpDept); // ["Raymond", "Cynthia", "Danny"]
5. console.log(cisDept); // ["Mike", "Clayton", "Terrill", "Jennifer"]
4、为数组添加元素
有两个方法可以为数组添加元素:push() 和unshift()。push()方法会将一个元素添加到数组末尾。
1. var nums = [1, 2, 3, 4, 5];
2. console.log(nums); // 1, 2, 3, 4, 5
3.
4. nums.push(6);
5. console.log(nums); // 1, 2, 3, 4, 5, 6
和在数组的末尾添加元素比起来,在数组的开头添加元素更难。如果不利用数组提供的可变函数,则新的元素添加进来后,需要把后面的每个元素都相应地向后移一个位置。unshift()方法可以将元素添加在数组的开头。
1. var nums = [2, 3, 4, 5];
2. console.log(nums); // 2, 3, 4, 5
3.
4. nums.unshift(1);
5. console.log(nums); // 1, 2, 3, 4, 5
5、从数组中删除元素
使用pop()方法可以删除数组末尾的元素。使用shift() 方法可以删除数组的第一个元素。
1. var nums = [1, 2, 3, 4, 5];
2. console.log(nums); // 1, 2, 3, 4, 5
3.
4. nums.pop();
5. console.log(nums); // 1, 2, 3, 4
6.
7. nums.shift();
8. console.log(nums); // 2, 3, 4
6、从数组中间位置添加和删除元素
删除数组中的第一个元素和在数组开头添加一个元素存在同样的问题——两种操作都需要将数组中的剩余元素向前或向后移,然而splice()方法可以帮助我们执行其中任何一种操作。使用splice() 方法为数组添加元素,需提供如下参数:
- · 起始索引(也就是你希望开始添加元素的地方);
- · 需要删除的元素个数(添加元素时该参数设为0);
- · 想要添加进数组的元素。
9. var nums = [1, 2, 3, 7, 8, 9];
10. var newElements= [4, 5, 6];
11.
12. nums.splice(3, 0, newElements);
13. console.log(nums); // 1, 2, 3, 4, 5, 6, 7, 8, 9
14.
15. // 要插入数组的元素不必组织成一个数组,它可以是任意的元素序列
16. var nums1 = [1, 2, 3, 7, 8, 9];
17. nums1.splice(3, 0, 4, 5, 6);
18. console.log(nums); // 1, 2, 3, 4, 5, 6, 7, 8, 9
19.
20. // 使用splice()方法从数组中删除元素
21. var nums2 = [1, 2, 3, 100, 200, 300, 400, 4, 5];
22. nums2.splice(3, 4);
23. console.log(nums2); // 1, 2, 3, 4, 5
7、为数组排序
reverse() 方法将数组中元素的顺序进行翻转。sort()方法时按照字典顺序对元素进行排序的,因此它嘉定元素都是字符串类型,即使元素时数字类型,也被认为是字符串类型。为了让sort()方法也能排序数字类型的元素,可以在调用方法时传入一个大小比较函数,排序时,sort()方法将会根据该函数比较数组中两个元素的大小,从而决定整个数组的顺序。
1. // reverse()方法
2. var nums = [1, 2, 3, 4, 5];
3. nums.reverse();
4.
5. console.log(nums); // 5, 4, 3, 2, 1
6.
7. // sort()方法
8. var names = ["David", "Mike", "Cynthia", "Clayton", "Bryan", "Raymond"];
9. names.sort();
10. console.log(names); // Bryan, Clayton, Cynthia, David, Mike, Raymond
11.
12. var nums1 = [3, 1, 2, 100, 4, 200];
13. nums1.sort();
14. console.log(nums1); // 1, 100, 2, 200, 3, 4
15.
16. nums1.sort(function(num1, num2) {
17. return num1 - num2;
18. });
19.
20. console.log(nums1); // 1, 2, 3, 4, 100, 200
8、迭代器方法(不产生任何新数组)
迭代器方法对数组中的每一个元素应用一个函数,可以返回一个值、一组值或者一个新数组。
1. function square(num) {
2. console.log(num + '-' + num * num);
3. }
4.
5. var nums = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
6. nums.forEach(square);
另一个迭代器方法是every(),该方法接收一个返回值为布尔类型的函数,对数组中的每个元素使用该函数。如果对于所有的元素,该函数均返回true,则该方法返回true。
1. function isEven(num) {
2. return num % 2 == 0;
3. }
4.
5. var nums = [2, 4, 6, 8, 10];
6. var even = nums.every(isEven);
7.
8. if (even) {
9. console.log("all numbers are even.");
10. } else {
11. console.log("not all numbers are even.");
12. }
13.
14. // >>> 输出 all numbers are even.
some()方法也接受一个返回值为布尔类型的函数,只要有一个元素使得该函数返回true,该方法就返回true。
1. function isEven(num) {
2. return num % 2 == 0;
3. }
4.
5. var nums = [1, 3, 5, 9];
6. var even = nums.some(isEven);
7.
8. if (even) {
9. console.log("all numbers are even.");
10. } else {
11. console.log("no numbers are even.");
12. }
13.
14. // >>> 输出 no numbers are even.
reduce()方法接收一个函数,返回一个值。该方法会从一个累加值开始,不断对累加值和数组中的后续元素调用该函数,直到数组中的最后一个元素,最后返回得到的累加值。
1. function add(runningTotal, currentValue) {
2. return runningTotal + currentValue;
3. }
4.
5. var nums = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
6. var sum = nums.reduce(add);
7. console.log(sum); // 55
9、迭代器方法(生成新数组)
有两个迭代器方法可以产生新数组:map()和filter()。map()和forEach()有点儿像,对数组中的每个元素使用某个函数。两者的区别是map()返回一个新的数组,该数组的元素是对原有元素应用某个函数得到的结果。
1. var grades = [77, 65, 81, 92, 83];
2. var newGrades = grades.map(function(grade) {
3. return grade += 5;
4. });
5.
6. console.log(newGrades); // [82, 70, 86, 97, 88]
filter()和every()类似,传入一个返回值为布尔类型的函数。和every()方法不同的是,当对数组中的所有元素应用该函数,结果均为true时,该方法并不返回true,而是返回一个新数组,该数组包含应用该函数后结果为true的元素。
1. function isEven(num) {
2. return num % 2 == 0;
3. }
4.
5. function isOdd(num) {
6. return num % 2 != 0;
7. }
8.
9. var nums = [];
10. for (var i = 0; i < 20; i++) {
11. nums[i] = i + 1;
12. }
13.
14. var evens = nums.filter(isEven);
15. console.log("even numbers:");
16. console.log(evens); // [2, 4, 6, 8, 10, 12, 14, 16, 18, 20]
17.
18. var odds = nums.filter(isOdd);
19. console.log("odd numbers:");
20. console.log(odds); // [1, 3, 5, 7, 9, 11, 13, 15, 17, 19]
JavaScript —— 数组的更多相关文章
- Javascript数组操作
使用JS也算有段时日,然对于数组的使用,总局限于很初级水平,且每每使用总要查下API,或者写个小Demo测试下才算放心,一来二去,浪费不少时间:思虑下,堪能如此继续之?当狠心深学下方是正道. 原文链接 ...
- Javascript数组操作(转)
1.数组的创建 var arrayObj = new Array(); //创建一个数组 var arrayObj = new Array([size]); //创建一个数组并指定长度,注意不是上限, ...
- JavaScript 数组
JavaScript 数组 简介:数组是值的有序集合,JavaScript在同一个数组中可以存放多种类型的元素,而且是长度也是可以动态调整的,可以随着数据增加或减少自动对数组长度做更改. 一:创建数组 ...
- 也谈面试必备问题之 JavaScript 数组去重
Why underscore (觉得这部分眼熟的可以直接跳到下一段了...) 最近开始看 underscore.js 源码,并将 underscore.js 源码解读 放在了我的 2016 计划中. ...
- js 判断数组包含某值的方法 和 javascript数组扩展indexOf()方法
var questionId = []; var anSwerIdValue = []; ////javascript数组扩展indexOf()方法 Array.prototype.indexOf ...
- JavaScript 数组 length 属性获取数组长度或设置数组元素的数目
JavaScript 数组 length 属性 JavaScript 数组 length 属性可返回或设置或组中元素的数目,语法如下: array_object.length 利用 length 属性 ...
- 【读书笔记】-- JavaScript数组
数组是一段线性分配的内存,它通过整数计算偏移并访问其中的元素.大多数的语言都会要求一个数组的元素是相同类型,但JavaScript数组可以包含任意类型. var misc = ['string', n ...
- 什么才是正确的javascript数组检测方式
前面的话 对于确定某个对象是不是数组,一直是数组的一个经典问题.本文专门将该问题择出来,介绍什么才是正确的javascript数组检测方式 typeof 首先,使用最常用的类型检测工具——typeof ...
- javascript数组对象排序
javascript数组对象排序 JavaScript数组内置排序函数 javascript内置的sort函数是多种排序算法的集合 JavaScript实现多维数组.对象数组排序,其实用的就是原生的s ...
- javascript数组的知识点讲解
javascript数组的知识点讲解 阅读目录 数组的基本方法如下 concat() join() pop() push() reverse() shift() sort() splice() toS ...
随机推荐
- CorelDRAW(cdr) 2018安装教程详解
令人期待的coreldraw2018最新版已经发布了,相信各位设计从业者已经迫不及待想要知道这次版本会带来什么新的东西,本次小编带来的coreldraw2018破解版,附有注册补丁,激活之后可以永久免 ...
- rowid快速分页解析
版权声明:个人随笔,实用你就COPY,看不懂不解释 https://blog.csdn.net/HelloCqk1/article/details/36628787 --分页第一步 获取数据物理地址 ...
- java list 排序,建议收藏的排序方法
每天学习一点点 编程PDF电子书.视频教程免费下载:http://www.shitanlife.com/code public static void main(String[] args) { ...
- 2018-2019-2 20175105 实验一《JAVA开发环境的熟悉》实验报告
一.实验内容及步骤 (一)使用JDK编译.运行简单的Java程序 利用cd指令和mkdir指令创建文件夹 利用vim指令编辑源代码文件 利用javac指令编译,利用java指令运行 (二)使用IDEA ...
- 论文列表 for Action recognition
要读的论文: https://www.cnblogs.com/hizhaolei/p/10565405.html 骨架动作识别论文汇总 https://blog.csdn.net/bianxuewei ...
- https安全协议原理
那么什么是HTTPS? HTTPS(Hypertext Transfer Protocol Secure)是一种通过计算机网络进行安全通信的传输协议.HTTPS经由HTTP进行通信,但利用TLS来加密 ...
- django_redis作为 session backend 使用配置
Django 默认可以使用任何 cache backend 作为 session backend, 将 django-redis 作为 session 储存后端不用安装任何额外的 backend # ...
- Html5 标签一(文本)
1.html编辑器:Sublime Text 2.标签(文本) 一 Sublime Text 作用:html编辑器. 下载地址:http://www.sublimetextcn.com/ 二 文本 总 ...
- 【Codeforces Round 725】Canada Cup 2016
模拟Canada Cup 2016,ABC三题,Rank1376 第三题卡住了 Codeforces 725 C 求出两个相同字符的位置,记为x和y. 然后考虑把相同的那个字符放在第一行的什么地方, ...
- date日期 格式化
这个是别人写的,我拿过来用的,哈哈 Date.prototype.format = function(fmt) { var o = { "M+" : this.getMonth() ...