Array.from 方法用于将两类对象转为真正的数组
let arrayLike = { '0': 'a', '1': 'b', '2': 'c', length: 3 };
// ES5的写法 var arr1 = [].slice.call(arrayLike);
// ['a', 'b', 'c']
// ES6的写法
let arr2 = Array.from(arrayLike);// ['a', 'b', 'c']
实际应用中,常见的类似数组的对象是DOM操作返回的NodeList集合,以及函数内部的arguments对象。Array.from都可以将它们转为真正的数组
let ps = document.querySelectorAll('p');
Array.from(ps).forEach((p)=> {
console.log(p);
});
// 展开语法
[...ps].forEach((p)=> {
console.log(p);
});
// arguments对象
function foo() {
return Array.from(arguments);
}
Array.of() 方法用于将一组值,转换为数组。
Array.of(3, 11, 8) // [3,11,8]
Array.of(3) // [3]
Array.of(3).length // 1
这个方法的主要目的,是弥补数组构造函数Array()的不足。因为参数个数的不同,会导致Array()的行为有差异。
Array() // []
Array(3) // [, , ,]
Array(3, 11, 8) // [3, 11, 8]
上面代码中,Array方法没有参数、一个参数、三个参数时,返回结果都不一样。只有当参数个数不少于2个时,Array()才会返回由参数组成的新数 组。参数个数只有一个时,实际上是指定数组的长度。
Array.of() // []
Array.of(undefined) // [undefined]
Array.of(1) // [1]
Array.of(1, 2) // [1, 2]
copyWithin() 在当前数组内部,将指定位置的成员复制到其他位置(会覆盖原有成员),然后返回当前数组。也就是说,使用这个方 法,会修改当前数组。
- target 必需。复制到指定目标索引位置。
- start 可选。元素复制的起始位置。
- end 可选。停止复制的索引位置 (默认为 array.length)。如果为负值,表示倒数。
copyWithin: ƒ copyWithin(target, start, end) 赋值数组,
[1, 2, 3, 4, 5].copyWithin(0, 3) // [4, 5, 3, 4, 5]
// 将3号位复制到0号位
[1, 2, 3, 4, 5].copyWithin(0, 3, 4) // [4, 2, 3, 4, 5]
// -2相当于3号位,-1相当于4号位
[1, 2, 3, 4, 5].copyWithin(0, -2, -1)
// [4, 2, 3, 4, 5] // 将3号位复制到0号位
[].copyWithin.call({length: 5, 3: 1}, 0, 3)
// {0: 1, 3: 1, length: 5}
// 将2号位到数组结束,复制到0号位
var i32a = new Int32Array([1, 2, 3, 4, 5]);
i32a.copyWithin(0, 2); // Int32Array [3, 4, 5, 4, 5]
// 对于没有部署TypedArray的copyWithin方法的平台
// 需要采用下面的写法
[].copyWithin.call(new Int32Array([1, 2, 3, 4, 5]), 0, 3, 4);
// Int32Array [4, 2, 3, 4, 5]
上面代码表示将从3号位直到数组结束的成员(4和5),复制到从0号位开始的位置,结果覆盖了原来的1和2。
用于找出第一个符合条件的数组成员。它的参数是一个回调函数,所有数组成员依次执行该回调函数,直到找出第一个返回值为true的成员,然后返回该成员。如果没有符合条件的成员,则返回undefined。
find() 找出第一个符合条件的数组成员
所有数组成员依次执行该回调函数,直到找出第一个返回值 为true的成员,然后返回该成员。如果没有符合条件的成员,则返回undefined。
[1, 4, -5, 10].find((n) => n < 0) // -5
[1, 5, 10, 15].find((value, index, arr) => value > 9; ) // 10
[1, 5, 10, 15].find((value, index, arr) => value > 100 ) // undefined
findIndex() 返回第一个符合条件的数组成员的位置,如果所有成员都不符合条件,则返回-1
[1, 5, 10, 15].findIndex((value, index, arr) => value > 100 ) //-1
[1, 5, 10, 15].findIndex((value, index, arr) => value > 100 ) //3
fill() 把数组中的值替换成一个相同的固定值 把一个值可以复制此
数组中已有的元素,会被全部抹去
['a', 'b', 'c'].fill(7) // [7, 7, 7]
fill方法还可以接受第二个和第三个参数,用于指定填充的起始位置和结束位置
['a', 'b', 'c'].fill(7, 1, 2) // ['a', 7, 'c']
entries() keys()和values() 可以 用for…of循环进行遍历,唯一的区别是keys()是对键名的遍历、values()是对键值的遍历,entries()是对键值对的遍历
includes() 查找数组中是否存在某一个值 匹配的字符串返回 true,否则返回 false。
[1, 2, 3].includes(2); // true
[1, 2, 3].includes(4); // false
[1, 2, NaN].includes(NaN); // true
indexOf 第一个出现位置 如果不到就返回-1
[1,2,2,3,9].indexOf(9) // 4
[1,2,2,3,9].indexOf(8) // -1
Map和Set数据结构有一个has方法,需要注意与includes区分
Set与WeakSet 和 Map WeakMap
数组的空位 数组的空位指,数组的某一个位置没有任何值。比如,Array构造函数返回的数组都是空位。
- forEach(), filter(), every() 和some()都会跳过空位。
- map()会跳过空位,但会保留这个值
- join()和toString()会将空位视为undefined,而undefined和null会被处理成空字符串。
- for…of 不会 忽略空位
Array(3) // [, , ,]
Array.from方法会将数组的空位,转为undefined,也就是说,这个方法不会忽略空位
Array.from(['a',,'b']) // [ "a", undefined, "b" ]
扩展运算符(…)也会将空位转为undefined。
[...['a',,'b']] // [ "a", undefined, "b" ]
entries()、keys()、values()、find()和findIndex()会将空位处理成undefined。
flat 扁平化数组 但是可以用 join() 或者来toString()
join()分割数组 有默认参数 为 (,号)
formlist = [
[{
name: 'name1',
valus: '',
isfocus: false,
},
{
name: 'uuid1',
valus: '',
isfocus: false,
},
],
[{
name: 'name2',
valus: '',
isfocus: false,
},
{
name: 'uuid2',
valus: '',
isfocus: false,
},
],
[{
name: 'name3',
valus: '',
isfocus: false,
},
{
name: 'uuid3',
valus: '',
isfocus: false,
},
]
];
list = [1, 2, 3, [4, 8, [9, 0],]]
console.log(list.join()); //1,2,3,4,8,9,0
console.log(list.toString()); //1,2,3,4,8,9,0
console.log(formlist.flat(2)); // object [{…}, {…}, {…}, {…}, {…}, {…}]
//如果不管有多少层嵌套,都要转成一维数组,可以用Infinity关键字作为参数
console.log(formlist.flat(Infinity)) /*[
{ name: 'name1', valus: '', isfocus: false },
{ name: 'uuid1', valus: '', isfocus: false },
{ name: 'name2', valus: '', isfocus: false },
{ name: 'uuid2', valus: '', isfocus: false },
{ name: 'name3', valus: '', isfocus: false },
{ name: 'uuid3', valus: '', isfocus: false }
]*/
join() 或者来toString() 来扁平化数组,存字符串或者数字数组有效,对数组对象无效 用于数组对象返回的是字符串[object Object]
console.log(formlist.toString()); // 字符串 [object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
console.log(formlist.join()); // 字符串 [object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
map 返回一个新数组,也可返回指定条件的
let obj = [{name:'ls',age:'15',sex:'',jg:'四川.广安'},{name:'张三丰',age:'15',sex:'',jg:'重庆.渝北'},{name:'斑斑',age:'25',sex:'',jg:'湖北.武汉'},{name:'有多少',age:'22',sex:'',jg:'四川.成都'},{name:'ls',age:'15',sex:'',jg:'福建'}];
let felt = obj.map((e)=>{
if(e.jg.includes('四川')){
return e;
}
})
for (const i in felt) {
for (const s in felt[i]) {
console.log( felt[i][s])
}
}
some 数组中一个为真 就返回true 否则就返回false
var arr = [1, 2, 3, 4, 5, 6];
let mm = arr.some((e) => {
return e >= 7;
})
let mm1 = arr.some((e) => {
return e >= 6;
})
console.log(mm,mm1)// false true
every() 数组中全部满足则返回ture 一个满足都返回false
var arr = [1, 2, 3, 4, 5, 6];
let mm = arr.every((e) => {
return e >= 1;
})
let mm1 = arr.every((e) => {
return e >= 7;
})
console.log(mm, mm1) //true false
参数为 单个值, 多个以逗号分开, 也可是一个数组使用展开运算
concat: ƒ concat() //合并数组
/**
* 数组中一个满足条件的 就返回true
*/
every: ƒ every()
/**
* 过滤数组中的数据 返回过滤完后的数据
*/
filter: ƒ filter()
flatMap: ƒ flatMap()
/**
* 返回一个指定的值在数组中出现的最后一次索引
*/
lastIndexOf: ƒ lastIndexOf()
/**
* 删除数组最后一个
*/
pop: ƒ pop()
/**
* 向数组最后位置追加数据
*/
push: ƒ push()
/**
* reduce() 方法接收一个函数作为累加器,数组中的每个值(从左到右)开始缩减,最终计算为一个值。
参数 描述
total 必需。初始值, 或者计算结束后的返回值。
currentValue 必需。当前元素
currentIndex 可选。当前元素的索引
arr 可选。当前元素所属的数组对象。
initialValue 可选。传递给函数的初始值
* array.reduce(function(total, currentValue, currentIndex, arr), initialValue)
* 数组和
* let nb = numbers = [15, 3, 2, 4.7,1.3];
let conh = nb.reduce((total, currentValue, currentIndex, ar)=>{
return total+ar[currentIndex]
},0)
console.log(conh)
*/
reduce: ƒ reduce()
/**
* reduceRight() 方法的功能和 reduce() 功能是一样的,不同的是 reduceRight() 从数组的末尾向前将数组中的数组项做累加。
*/
reduceRight: ƒ reduceRight()
/**
* 颠倒数组颠倒数组中元素的顺序:
*/
reverse: ƒ reverse()
/**
* shift() 方法用于把数组的第一个元素从其中删除,并返回第一个元素的值。
*/
shift: ƒ shift()
/**
* start, 可选。规定从何处开始选取。如果是负数,那么它规定从数组尾部开始算起的位置。也就是说,-1 指最后一个元素,-2 指倒数第二个元素,以此类推。
* end 可选。规定从何处结束选取。该参数是数组片断结束处的数组下标。如果没有指定该参数,那么切分的数组包含从 start 到数组结束的所有元素。如果这个参数是负数,那么它规定的是从数组尾部开始算起的元素。
* 返回一个新的数组,包含从 start 到 end (不包括该元素)的 arrayObject 中的元素。
* array.slice(start, end)
*/
slice: ƒ slice()
/**
* some() 方法用于检测数组中的元素是否满足指定条件(函数提供)。
some() 方法会依次执行数组的每个元素:
如果有一个元素满足条件,则表达式返回true , 剩余的元素不会再执行检测。
如果没有满足条件的元素,则返回false。
*/
some: ƒ some()
/**
* 方法用于对数组的元素进行排序。
排序顺序可以是字母或数字,并按升序或降序。
默认排序顺序为按字母升序。
*/
sort: ƒ sort()
/**
* 方法用于添加或删除数组中的元素
* 这种方法会改变原始数组
*
* index 必需。规定从何处添加/删除元素。该参数是开始插入和(或)删除的数组元素的下标,必须是数字。
* howmany 可选。规定应该删除多少元素。必须是数字,但可以是 "0"。如果未规定此参数,则删除从 index 开始到原数组结尾的所有元素。
* item1, ..., itemX 可选。要添加到数组的新元素
* 如果从 arrayObject 中删除了元素,则返回的是含有被删除的元素的数组。
* array.splice(index,howmany,item1,.....,itemX)
*
*/
splice: ƒ splice()
/**
* 回一个字符串表示数组中的元素。数组中的元素将使用各自的 toLocaleString 方法转成字符串,这些字符串将使用一个特定语言环境的字符串(例如一个逗号 ",")隔开。
*/
toLocaleString: ƒ toLocaleString()
/**
* 将数组转为字符串
*/
toString: ƒ toString()
/**
* 向数组前面添加数据
*/
unshift: ƒ unshift()