您现在的位置是:首页 > IT分类 > html+js网站首页html+jsJS中数组相关方法:统计

JS中数组相关方法:统计

  • 蓝天
  • html+js
  • 2020-03-09 10:56:01
简介1. Array.from()Array.frommethod从array - like或iterable对象创建一个新的浅拷贝
浅拷贝是对象的逐位副本。创建一个新对象,该对象具有原始对象中值的精确副本。如果对象的

1. Array.from()

Array.frommethod从array - like或iterable对象创建一个新的浅拷贝EdP蓝天个人博客-一个自学的好博客
浅拷贝是对象的逐位副本。创建一个新对象,该对象具有原始对象中值的精确副本。如果对象的任何字段是对其他对象的引用,则仅复制引用地址,即仅复制内存地址EdP蓝天个人博客-一个自学的好博客
句法 : Array.from(arrayLike[, mapFn[, thisArg]])EdP蓝天个人博客-一个自学的好博客
Array.from()方法就是将一个类数组对象或者可遍历对象转换成一个真正的数组。Array.from有三个参数,Array.from(arrayLike[, mapFn[, thisArg]]),arrayLike:想要转换成数组的伪数组对象或可迭代对象;mapFn:如果指定了该参数,新数组中的每个元素会执行该回调函数;thisArg:可选参数,执行回调函数 mapFn 时 this 对象。该方法的返回值是一个新的数组实例(真正的数组)EdP蓝天个人博客-一个自学的好博客
各类用法例如:
//类数组转数组
let array = {
0: '蓝天',
1: '18',
2: '男',
3: ['user1', 'user2', 'user3'],
'length': 4
}
let arr = Array.from(array)
console.log(arr) // ['蓝天','18','男',['user1','user2','user3']]
//字符串中的数组
var str ="123"; // String是可迭代的
Array.from(str); // [ '1', '2', '3']
//使用引用复制数组
var array = [{name:'阿龙'}];
var newArray = Array.from(array);
newArray[0].name; //阿龙
array[0].name ="蓝天";
newArray[0].name; //蓝天
//该值是复制数组中"蓝天"的更改,因为它是浅复制的
//对于数组内部的数组,这也表现相同
var array = [[1, 2]]
var newArray = Array.from(array);
array[0][0] = 5;
console.log(newArray) ;//[[5, 2]]
//从具有重复值的数组创建唯一值的新数组
var array = [1, 2, 3, 4, 5, 5, 4, 3, 2, 1];
var set = new Set(array); //删除重复的元素
var uniqueArray = Array.from(set)// [1,2,3,4,5]
//使用map函数
var array = [1, 2, 3, 4, 5]
var doubledArray = Array.from(array, (value, index) => value + value) //[2,4,6,8,10]
//我们还可以从对象创建一个Array。如果对象具有属性length 。如果一个对象具有length属性,则Array.from认为它是一个可迭代对象并创建一个数组,length并将该值设置为undefined。
var obj = { length: 3 }
var array = Array.from(obj);//[undefined, undefined, undefined];
//我们可以使用map函数和上面的代码来创建一个将生成带数字的数组的函数
function fillArray(length) {
var obj = { length };
return Array.from(obj, (val, index) => index);
}
fillArray(10);[0, 1, 2, 3, 4, 5, 6, 7, 8, 9]
//您可以将this参数作为第三个参数传递并在map函数内使用它
//如果我们传递undefined或null,则抛出cannot convert undefined or null to object错误
//如果传递了非可迭代对象,则返回一个 empty-array

2.Array.isArray()

此方法检查传递的参数是否为数组EdP蓝天个人博客-一个自学的好博客
句法 : Array.isArray(value) 如果是数组则返回true,否则返回false。EdP蓝天个人博客-一个自学的好博客
返回true示例:
Array.isArray([]); //true
Array.isArray([1]); //true
Array.isArray(new Array());//true
// Array.prototype is an array of functions
Array.isArray(Array.prototype);
//返回false示例:
Array.isArray();
Array.isArray({});
Array.isArray(null);
Array.isArray(undefined);
Array.isArray(100);
Array.isArray('Array');
Array.isArray(true);
Array.isArray(false);
Array.isArray(new Uint8Array(32));
Array.isArray({ __proto__: Array.prototype });

3.Array.of()

Array.of 方法从传递的参数创建一个新数组
Array.of(1) // [1]
Array.of(1,"str",[1, 2],{ n:10 } ) // [1,“string”,Array(3),{...}]

4.Array.concat

合并数组array or value传递并创建一个新数组。返回的数组是传递的参数的浅表副本
array1.concat[array2,arr3,arr4,....arrN]
例如:
var array = [1, 2, 3]
var newArr = array.concat([7, 8, 9], [4, 5, 6]); // [1,2,3,7,8,9,4,5,6]

5.Array.keys

该keys()方法返回一个Array Iterator包含数组索引的新对象
var arr = [1, 2, 3];
var keys = arr.keys(); //它返回一个Array迭代器
console.log(...keys)
//之间的差Object.keys()和Array.keys()是Array.keys()也采取孔作为指标
var arr = [1,,3];
Object.keys(arr); // [0,2]
console.log(...arr.keys())// 0,1,2
// undefined不是一个洞
var arr = [1,undefined,2]
Object.keys(arr); // [0,1,2]
console.log(...arr.keys())// 0,1,2

6.Array.values()

Array.values()方法返回一个Array iterator包含数组值的对象。通过使用迭代器,我们可以迭代遍历数组的所有值
var array = ['阿龙', '阿虎', '阿豹', '蓝天'];
var arrayIterator = array.values(); // Array iterator
console.log(...arrayIterator) //阿龙 阿虎 阿豹 蓝天
//或者我们可以使用for ...来迭代迭代器
for (let vehicle of arrayIterator) {
console.log(vehicle);// 阿龙 阿虎 阿豹 蓝天
}

7. Array.entries()

该entries方法返回一个Array Iterator包含该index-value对数组的返回值,关键是数组的索引
var array = ['a','b','c'];
var iterator = array.entries();
console.log(...iterator)
// [0,“a”] [1,“b”] [2,“c”]
//或者我们可以用于...
for (let entry of iterator) {
console.log(entry);
}
//输出 [0,“a”] [1,“b”][2,“c”]
//或者
for (const [index, element] of iterator)
console.log(index, element);
//输出 0“a” 1“b” 2“c”

8.Array.push()

push方法将元素添加到数组的末尾,此方法返回新长度EdP蓝天个人博客-一个自学的好博客
句法 : array.push(n1, n2,...n)
var array = ['阿龙', '阿虎', '阿豹', '蓝天']
var newLen = array.push('博客'); // 5
//array:['阿龙', '阿虎', '阿豹', '蓝天','博客']

9.Array.unshift()

该unshift()方法与push方法相同,唯一的区别是,它将元素添加到数组的开头
var array = ['阿龙', '阿虎', '阿豹', '蓝天']
var newLen = array.unshift('博客'); // 5
//array:['博客','阿龙', '阿虎', '阿豹', '蓝天']

10.Array.pop()

该pop()方法删除数组的最后一个元素
var array = ['阿龙', '阿虎', '阿豹', '蓝天']
array.pop()//['阿龙', '阿虎', '阿豹']

11. Array.shift()

该方法从数组中删除第一个元素
var array = ['阿龙', '阿虎', '阿豹', '蓝天']
array.shift()//[ '阿虎', '阿豹', '蓝天']

12. Array.toString()

该toString()方法将数组转换为字符串,并返回字符串
var array = ["蓝天个人博客",168];
array.toString();//蓝天个人博客,168
//提醒:如果其中有任何对象,则将其转换为 [object Object],或者说如果数组中包含数组也就是常见的二维三维数组,用此方法也将被展平成字符串

13. Array.join()

此方法通过连接数组的所有元素来创建字符串EdP蓝天个人博客-一个自学的好博客
语法:join(separator)这里的分隔符是可选的EdP蓝天个人博客-一个自学的好博客
字符串被连接,每个元素由提供的分隔符分隔。如果未传递分隔符,则默认情况下它将与之连接"," 。
var array = ['蓝天','蓝天个人博客'];
array.join(); //“蓝天,蓝天个人博客”
array.join("|"); //“蓝天|蓝天个人博客”

14. Array.includes()

此方法测试元素是否存在于数组中。如果它在数组中,则返回true,否则返回false,该方法遵循相同的Array.indexOf方法概念EdP蓝天个人博客-一个自学的好博客
语法:includes(elementToSearch, fromIndex)
[1, 2, 3].includes(2); // true
[1, 2, 3].includes(4); // false

15. Array.reverse()

此方法展平多维数组,并返回一个新数组EdP蓝天个人博客-一个自学的好博客
例如:
var array = [1, 2, 3, 4,[1, 2]]
var newArray = array.flat(); // [1,2,3,4,1,2]

16.Array.some()

该array.some 方法检查是否return true 提供了测试函数的数组中的任何一个元素EdP蓝天个人博客-一个自学的好博客
如果任何元素通过测试,则返回true,否则返回false
array.some(testFunction, thisArg(optional));
例如:
function isOdd(value, index, array) {
return value % 2;
}
[2, 6, 8, 0, 4].some(isOdd); // false
[12, 5, 8, 1, 4].some(isOdd); // true

17.Array.every()

该array.every 方法检查是否returns true 提供了测试函数的数组的所有元素,它返回true,如果所有元素都通过了测试,则返回falseEdP蓝天个人博客-一个自学的好博客
例如:
function isOdd(value, index, array) {
return value % 2;
}
[1, 7, 8, 1, 5].every(isOdd); // false
[11, 5, 9, 1, 7].every(isOdd); // true

18.Array.sort()

该sort方法对数组的元素进行排序并返回已排序的数组EdP蓝天个人博客-一个自学的好博客
例如:
var arr = [4, 3, 6, 5, 7, 2, 1];
arr.sort();
console.log(arr);
//输出结果[1,2,3,4,5,6,7]
var arr = [4, 3, 6, 5, 7, 2, 1];
arr.sort();
arr.sort(function (a, b) {
return b - a;
});
console.log(arr);
//输出结果[7,6,5,4,3,2,1]

19.Array.fill()

此方法使用给定范围的给定值替换(修改)数组的值EdP蓝天个人博客-一个自学的好博客
句法 : array.fill( value, startIndex(optional), endIndex(optional) )EdP蓝天个人博客-一个自学的好博客
例如:
var array = [1, 2, 3, 4, 5]
array.fill(3, 2, 4) // [1, 2, 3, 3, 5]
array.fill(8, 1, 2) // [1, 8, 3, 3, 5]
//如果开始和结束索引相同,则不会发生填充
array.fill(9, 1, 1) // [1, 8, 3, 3, 5]
//我们也可以为开始和结束索引参数传递负索引
array.fill(9, -3, -2) // [1, 8, 9, 3, 5]
//如果我们传递起始索引<结束索引然后没有填充
array.fill(19, 4, 3) // [1, 8, 9, 3, 5]

20.Array.reduce()

educe() 方法对累加器和数组中的每个元素 (从左到右)应用一个函数,将其减少为单个值EdP蓝天个人博客-一个自学的好博客
语法:array.reduce(function (accumulator, currentValue, currentIndex, array), initialValue)EdP蓝天个人博客-一个自学的好博客
accumulator:上一次调用回调返回的值,或者是提供的初始值(initialValue)EdP蓝天个人博客-一个自学的好博客
currentValue:数组中正在处理的元素EdP蓝天个人博客-一个自学的好博客
currentIndex:数据中正在处理的元素索引,如果提供了 initialValue ,从0开始;否则从1开始EdP蓝天个人博客-一个自学的好博客
array: 调用 reduce 的数组EdP蓝天个人博客-一个自学的好博客
initialValue:可选项,其值用于第一次调用 callback 的第一个参数。如果没有设置初始值,则将数组中的第一个元素作为初始值EdP蓝天个人博客-一个自学的好博客
例如:
var res = [
0, 1, 2, 3, 4
].reduce((
accumulator, currentValue, currentIndex, array
) => {
return accumulator + currentValue; //10
});

21.Array.filter()

此方法根据提供的功能过滤数组元素

例如,在一个Array中,删掉偶数,只保留奇数:EdP蓝天个人博客-一个自学的好博客

var arr = [1, 2, 4, 5, 6, 9, 10, 15];
var r = arr.filter(function (x) {
return x % 2 !== 0;
});
r; // [1, 5, 9, 15]
 
//或者Array中的空字符串删掉,可以这么写:
var arr = ['A', '', 'B', null, undefined, 'C', ' '];
var r = arr.filter(function (s) {
return s && s.trim(); // 注:IE9(不包含IE9)以下的版本没有trim()方法
});
arr; // ['A', 'B', 'C']

22. Array.map()

map函数执行针对数组的所有元素提供的函数并生成一个新数组,并返回该数组EdP蓝天个人博客-一个自学的好博客
例如:
const array = [1, 3, 6, 9];
const newArray = array.map(function (value) {
return value + 1;
});
console.log(newArray);// [2, 4, 7, 10]
console.log(array);//[1, 3, 6, 9]

23.Array.forEach()

该forEach方法执行一个作为参数提供的方法,对阵数组的每个元素一次EdP蓝天个人博客-一个自学的好博客
例如:它是传统for循环的替代品
const numbers = [1, 2, 3, 4, 5];
const copy = [];
for (let i = 0; i < numbers.length; i++) {
copy.push(items[i]);
}
items.forEach(function (item) {
copy.push(item);
});

24. Array.slice()

该slice方法返回一个包含源数组部分的新数组EdP蓝天个人博客-一个自学的好博客
语法Array.slice(start, end)EdP蓝天个人博客-一个自学的好博客
例如:
var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9];
// [0,1,2,3,4,5,6,7,8]
// [-10,-9,-8,-7,-6,-5,-4,-3,-2,-1]
document.writeln(arr.slice(5)); // 输出:6,7,8,9
document.writeln(arr.slice(-5)); // 输出:5,6,7,8,9
document.writeln(arr.slice(0, 3)); // 输出:1,2,3
document.writeln(arr.slice(1, 2)); // 输出:2
document.writeln(arr.slice(3, -2)); // 输出:4,5,6,7
document.writeln(arr.slice(1, 9999)); // 输出:2,3,4,5,6,7,8,9

25.方法Array.splice()

splice()方法通过删除现有元素和 / 或添加新元素来更改一个数组的内容EdP蓝天个人博客-一个自学的好博客
Array.prototype.splice(start, deleteCount, item1, item2, …)EdP蓝天个人博客-一个自学的好博客
startEdP蓝天个人博客-一个自学的好博客
指定修改的开始位置(从0计数)。如果超出了数组的长度,则从数组末尾开始添加内容;如果是负值,则表示从数组末位开始的第几位(从1计数)EdP蓝天个人博客-一个自学的好博客
deleteCount(可选)EdP蓝天个人博客-一个自学的好博客
整数,表示要移除的数组元素的个数。如果 deleteCount 是 0,则不移除元素。这种情况下,至少应添加一个新元素。如果 deleteCount 大于start 之后的元素的总数,则从 start 后面的元素都将被删除(含第 start 位)EdP蓝天个人博客-一个自学的好博客
item1, item2, …(可选)EdP蓝天个人博客-一个自学的好博客
要添加进数组的元素, 从start 位置开始。如果不指定,则 splice() 将只删除数组元素EdP蓝天个人博客-一个自学的好博客
例如:
[14, 3, 77].splice(1, 2) // [3, 77]

转载: 感谢您对蓝天个人博客网站平台的认可,非常欢迎各位朋友分享到个人站长或者朋友圈,但转载请说明文章出处“来源蓝天个人博客 http://www.along168.cn”。

文章评论

联系方式