JavaScript常用数组方法
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了JavaScript常用数组方法相关的知识，希望对你有一定的参考价值。
JavaScript数组方法有以下这些：
forEach() 方法对数组的每一个元素执行一次提供的函数。
map() 方法创建一个新数组，其结果是该数组都执行一次函数，原函数保持不变。
filter() 方法使指定函数测试数组的每一个元素，并放回一个通过元素的新数组。
some() 方法测试该数组有元素通过了指定函数的测试，如果有返回true，否则，返回false。
every() 方法测试该数组是否全部通过指定函数测试，全部通过返回true，否则，返回false。
Array.of() 方法创建一个具有可变数量参数的新数组实例，而不考虑参数的数量或类型。
Array.isArray() 方法适用于确定传递的值是否为Array
slice() 方法将数组的一部分浅拷贝，返回到从开始到结束（不包括结束）选择的新数组对象。原始数组不会被修改。
splice() 方法通过删除现有元素或添加新元素来更改数组的内容，第一个参数索引位置，第二个参数删除的个数，第三个参数添加新内容
find() 方法返回数组中满足提供的测试函数的第一个元素的值。
语法： arr.find(callback[, thisArg])
findIndex()方法返回数组中满足提供的测试函数的第一个元素的索引。否则返回-1。
语法： arr.findIndex(callback[, thisArg])
indexOf()方法返回在数组中可以找到给定元素的第一个索引，如果不存在，则返回-1。
语法： arr.indexOf(searchElement)
arr.indexOf(searchElement[, fromIndex = 0])
lastIndexOf() 方法返回指定元素（也即有效的 javascript 值或变量）在数组中的最后一个的索引，如果不存在则返回 -1。从数组的后面向前查找，从 fromIndex 处开始。
语法： arr.lastIndexOf(searchElement[, fromIndex = arr.length - 1])
includes() 方法用来判断当前数组是否包含某指定的值，如果是，则返回 true，否则返回 false。
语法： arr.includes(searchElement)
arr.includes(searchElement, fromIndex)
forEach 遍历数组
|
1
2
3
4
5
|
var arr = ["a", "b", "c"];arr.forEach(function(element,index) { console.log(element,index); }); |
map 返回新数组，为当前元素加字符串m
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
|
var arr = ["a", "b", "c"];arr.map(function(element,index) { return element += "m";});// 将给定数组的元素转成整数["1", "2", "3"].map(parseInt); // [1, NaN, NaN]// 等价于["1", "2", "3"].map(function(value,index,array){ return parseInt(value,index);});parseInt(3,1); // NaN parseInt(string, radix) 函数将给定的字符串以指定基数解析成为整数。 |
1 var arr = ["郭靖","黄蓉","洪七公","黄药师","欧阳锋","杨康","穆念慈"]; 2 3 function arrayToJson(arr){ 4 var narr = null, 5 json=null; 6 7 narr = arr.map(function(currentValue,index){ 8 9 return "\""+index+"\":\""+currentValue+"\"";10 11 }); 12 13 json = "{"+narr.join(",")+"}"; 14 return JSON.parse(json); 15 } //{0: "郭靖", 1: "黄蓉", 2: "洪七公", 3: "黄药师", 4: "欧阳锋", 5: "杨康", 6: "穆念慈"}
filter 返回大于10的元素
|
1
2
3
4
5
6
7
|
// 12, 130, 44var arr = [12, 5, 8, 130, 44];arr.filter(function(value){ return value>10});// 等价于arr.filter((value)=>value>10); |
some 判断当前数组有元素大于10的元素
|
1
2
3
4
|
var arr = [12, 5, 8, 130, 44];arr.some(function(value){ // true return value>10}); |
every 判断当前数组所有元素是否都大于10
|
1
2
3
4
|
var arr = [12, 5, 8, 130, 44];arr.every(function(value){ // false return value>10}); |
创建数组
Array.of() 方法创建一个具有可变数量参数的新数组实例，而不考虑参数的数量或类型。
|
1
2
3
4
5
6
7
8
9
|
Array.of(3); // [7]Array(3); // Array(3) 创建一个包含 3 个 undefined 元素的数组if(!Array.of){ Array.of = function(){ return Array.prototype.slice.call(arguments); }} |
判断是否数组
Array.isArray() 方法适用于确定传递的值是否为Array
|
1
2
3
4
5
6
7
8
9
10
11
12
13
|
Array.isArray([]); // trueArray.isArray(new Array()); // trueArray.isArray(Array.prototype); // trueArray.isArray(Array.of(undefined)); // trueArray.isArray(null); // falseArray.isArray(undefined); // falseif(!Array.isArray){ Array.isArray = function(){ return Object.prototype.toString.call(arguments) === "[object Array]"; }} |
slice() 方法将数组的一部分浅拷贝，返回到从开始到结束（不包括结束）选择的新数组对象。原始数组不会被修改。
|
1
2
3
4
5
|
var arr = ["zero", "one", "two", "three"];var sliced = arr.slice(1,3);console.log(arr); // ["zero", "one", "two", "three"]console.log(sliced); // ["one", "two"] |
splice() 方法通过删除现有元素或添加新元素来更改数组的内容，第一个参数索引位置，第二个参数删除的个数，第三个参数添加新内容
|
1
2
3
4
5
6
7
8
9
|
var arr = ["aaa","bbb","ccc"];// 在索引1的位置添加一个新元素dddarr.splice(1,0,"ddd"); // ["aaa", "ddd", "bbb", "ccc"]// 在索引2的位置删除一个元素arr.splice(2,1); // ["aaa", "ddd", "ccc"]// 在索引1的位置删除一个元素并添加两个元素arr.splice(1,1,"eee","fff"); // ["aaa", "eee", "fff", "ccc"] |
例一、find()方法 查找数组中第一个大于等于15的元素
|
1
2
3
4
|
var num = [10,3,5,15,100,1].find(function(elem, index){ return elem>=15;});console.log(num) // 15 |
例二、findIndex() 查找数组中第一个大于等于15的元素的位置（索引）
|
1
2
3
4
|
var num = [10,3,5,15,100,1].findIndex(function(elem, index){ // 15 return elem>=15;});console.log(num) // 3 |
例三、indexOf () 查找5所在的位置，默认索引位置从零开始
|
1
2
3
|
[0,1,2,3,4,5,6].indexOf(5); // 5 从索引0的位置往后查找[0,1,2,3,4,5,6].indexOf(5,5); // 5[0,1,2,3,4,5,6].indexOf(5,10); // -1 从索引10的位置往后查找 |
例四、lastIndexOf() 查找5所在的位置，默认索引位置当前数组长度减一
|
1
2
3
4
|
[0,1,2,3,4,5,6].lastIndexOf(5); // 5 从索引位置数组长度减一向前查找[0,1,2,3,4,5,6].lastIndexOf(5, 6); // 5[0,1,2,3,4,5,6].lastIndexOf(5, 10); // 5[0,1,2,3,4,5,6].lastIndexOf(5, 1); // -1 从索引1的位置向前查找 |
例五、includes
|
1
2
3
|
[0,1,2,3,4,5,6].includes(5); // true 从索引0位置往后查找是否存在5元素，是[0,1,2,3,4,5,6].includes(10); // false[0,1,2,3,4,5,6].includes(5,10); // false 从索引10位置往后查找是否存在10元素，否 |
forEach() 方法对数组的每一个元素执行一次提供的函数。
map() 方法创建一个新数组，其结果是该数组都执行一次函数，原函数保持不变。
filter() 方法使指定函数测试数组的每一个元素，并放回一个通过元素的新数组。
some() 方法测试该数组有元素通过了指定函数的测试，如果有返回true，否则，返回false。
every() 方法测试该数组是否全部通过指定函数测试，全部通过返回true，否则，返回false。
forEach 遍历数组
|
1
2
3
4
5
|
var arr = ["a", "b", "c"];arr.forEach(function(element,index) { console.log(element,index); }); |
map 返回新数组，为当前元素加字符串m
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
|
var arr = ["a", "b", "c"];arr.map(function(element,index) { return element += "m";});// 将给定数组的元素转成整数["1", "2", "3"].map(parseInt); // [1, NaN, NaN]// 等价于["1", "2", "3"].map(function(value,index,array){ return parseInt(value,index);});parseInt(3,1); // NaN parseInt(string, radix) 函数将给定的字符串以指定基数解析成为整数。 |
filter 返回大于10的元素
|
1
2
3
4
5
6
7
|
// 12, 130, 44var arr = [12, 5, 8, 130, 44];arr.filter(function(value){ return value>10});// 等价于arr.filter((value)=>value>10); |
some 判断当前数组有元素大于10的元素
|
1
2
3
4
|
var arr = [12, 5, 8, 130, 44];arr.some(function(value){ // true return value>10}); |
every 判断当前数组所有元素是否都大于10
|
1
2
3
4
|
var arr = [12, 5, 8, 130, 44];arr.every(function(value){ // false return value>10}); |
以上是关于JavaScript常用数组方法的主要内容，如果未能解决你的问题，请参考以下文章