【TS】10分钟精通数组

constructor

返回数据对象原型构造方法:

let fruits = [1,2,3,4];
console.log(fruits.constructor);

//print: [Function: Array]

length

返回数组长度

拓展操作符

let fruits = [1,2,3,4];

let copy = [0, ...fruits, 5];
console.log(copy);
// print [ 0, 1, 2, 3, 4, 5 ]

*拓展操作符适用于任何可迭代的对象(可以使用for/of循环遍历)

而字符串也是可迭代对象,所以我们就可以进行比较好玩的操作:

let fruits = [1,2,3,4];

let copy1 = [0, "56789"];
let copy2 = [...fruits, ..."56789"];
console.log(copy1);
console.log(copy2);
//print 
[ 0, '56789' ]
[1,   2,   3,   4,   '5', '6', '7', '8', '9']

Array.of()

这是个工厂方法,使用其参数值(无论多少个)作为数组元素创建并返回新数组。

Array.from()

let copy = Array.from(original);
  • 他创建的是真正的数组副本。类数组对象不是数组对象,有些浏览器的方法返回的是类数组对象可以用上面的方法转为正真的数组方便后续的操作。
  • Array.from()也可以接受第二个可选的参数,如果给第二个参数传入了一个函数,源对象的每个元素都会传入这个函数,然后这个函数的返回值代替原数组元素作为新数组的元素。
let original = [1,2,3,4];

let copy = Array.from(original, (org)=>{
    return org + 10;
});
console.log(copy);
//print [ 11, 12, 13, 14 ]

push()

在数组的末尾添加一个或者多个元素。

a = [];
a.push(0);
// a == [0]

unshift()

在数组的开头插入一个元素,将已有的数组元素移到更高位的索引。

pop()

移除数组中的最后一个元素,并且导致数组的length减一。

shift()

删除并返回数组的第一个元素

delete

delete操作符可以删除数组元素,但不会改变数组的长度,相当于,把对应索引的元素变为undefined。

let a = [1,2,3];
delete a[2];
2 in a //false ,
a.length //3

for/of

遍历一个数组(或者任意一个可以迭代的对象)

let letters  = [.... "hello world"]
let string = "";
for (let letter of letters){
  string += letter;
}
string // "hello world"

entries()

遍历的时候不仅可以获取到数组,并且可以获取到对应的索引。

let letters  = [.... "hello world"]
let string = "";
for (let letter [index,letter] of letters.entries()){
  if (index % 2 === 0) string += letter;
}
string // "hlowrd"

forEach()

迭代数组的每一个元素,对于每一个元素都调用一次我们指定的函数,注意的是如果是稀疏数组,则不会对不存在的数组元素调用这个函数。

let letters  = [ , ,"hello world"]
let string = "";
letters.forEach((letter) =>{
    string += letter?.toUpperCase();
})
console.log(string)  // HELLO WORLD

值得注意的是:foeEach()并没有与常规for循环中的break语句对等的机制去提前结束迭代。

map()

把调用它的数组的每个元素传入到我们传入的函数中,并返回这个函数的返回值。

let a  = [1,2,3]
a.map(x =>x*x) //[1,4,9]

值得注意的是:

  • map会返回一个新的数组,并不会修改调用它的数组。
  • 如果调用它的数组是一个稀疏数组,那么返回的数组同样是一个稀疏数组,它与原始的数组一样地稀疏。

filter()

返回一个数组,该数组是调用它地数组地子数组,传入该函数地应该为一个断言函数,会把返回值为true的元素筛选出来。

此处为语雀内容卡片,点击链接查看:https://yuque.antfin-inc.com/xqwina/fbyewg/zomw2z

值得注意的是,如果是一个稀疏数组,那么则会跳过不存在的元素,所以它返回的数组始终是稠密的。

find()

遍历数组,返回断言函数返回值为真的元素,在找到第一个元素后停止迭代。

没找到匹配的元素时返回undefined

findIndex()

遍历数组,返回断言函数返回值为真的元素d的索引,在找到第一个元素后停止迭代。

没找到匹配的元素时,返回-1

every()

断言函数只要有false时,返回false,否则返回true。

let letters  = [ ,3, 1];
letters.every((x) => {   if (x) return x < 4 });

如果为空数组,则为true。

some()

断言函数只要有true,就返回true,否则会false。

let letters  = [ ,5, 5];
let e = letters.some((x) => {   if (x) return x < 4 }); //false

如果为空数组,则为true。

reduce()

使用我们的归并函数对我们的数组进行归并,最终产生一个值。

let a = [1,2,3]
a.reduce((x,y) => x+Y, 0) //6,在第一次执行的时候,x是0,y是1.
a.reduce((x,y) => x*Y,1)//6
a.reduce((x,y) => (x>Y)?x:Y//3,最大值是三
  • 如果传第二个参数,即初始值,则函数一开始的时候会以第一个元素作为初始值。
  • 所以,如果数组为空数组,则不传入,初始值的话,会报错误。

reduceRight()

与reduce()一样,只不过是从大的索引值开始归并。

flat()

打平数组。

let a = [ , 1, [1,2], [1,[1,[2]]]];
a.flat() //[ 1, 1, 2, 1, [ 1, [ 2 ] ] ]
a.flat(1) //[ 1, 1, 2, 1, [ 1, [ 2 ] ] ]
a.flat(2) // [ 1, 1, 2, 1, 1, [ 2 ] ]

flatMap()

相当于 a.map(f).flat(), 但是他的效率远高于a.map(f).flat()

let phrases = ["Hello world","I am NGB"]
phrases.flatMap(phrase =>phrase.split(" "); // ["Hello", "world", "I", "am"  "NGB"]

目录

constructor

length

拓展操作符

Array.of()

Array.from()

push()

unshift()

pop()

shift()

delete

for/of

entries()

forEach()

map()

filter()

find()

findIndex()

every()

some()

reduce()

reduceRight()

flat()

flatMap()


猜你喜欢

转载自blog.csdn.net/niuguobao/article/details/127502953