javascript-你可能不知道的数组

 

1. 可以尝试用console.table()来打印数组看的更清楚

2.array.of创建数组

let a = new Array(6);
      console.log(a.length);
      console.table(a);
      let arr = Array.of(6);
      console.log(arr.length);
      console.table(arr);

3.如何检测数组

typeof检测引用类型都为Object

所以
检测array需要用Array.isArray这个api。

4.=>array

1. split
2. Array.from(str)
   方法(2)在将对象转为数组时会出错但是写成这样的形式即可完美转换：
   {
   0:1,2:2,length:2
   };

5.文档元素也可以直接转换为array

  const div = document.querySelectorAll("div");
  [...div].map(function (item) {
    item.addEventListener("click", function () {
      this.classList.toggle("hide");
    });
  });

6.可以用扩展预算符(…)来连接数组

 let array1 = ["1", "2"];
    let array2 = ["3", "4"];
    array1 = [...array1, ...array2];
    console.log(array1);

7.使用解构语法操作数组

 let arr = ["2020", 2021];
    let year1 = arr[0];
    let year = arr[1];
    let [year1, year] = arr;
    console.log(year1);
    console.log(year1, year);
	//加入默认值
    let [name, year = 2021] = ["sam"];
    console.log(year);
    //只想要第二个
    let[,B] = [a,b];

8.数组添加元素的方法

以下方法均会改变原数组

1. array[x] = A;
2. array = […a,…b];
3. push:
   返回：新数组长度
4. pop：
   返回：弹出的东西
5. unshift：
   返回：新数组长度
6. shift：
   返回：弹出的东西
7. splice(开始的位置（包含），结束的位置（不包含），用什么替代):
   返回：改变的新数组
   以下方法均不会改变原数组
8. slice(1,2)
   返回：截出来的数组

9.数组的拆分与合并

1. split:拆
2. join:合并

10.清空数组的方法

1. let A = [];(新建一个空数组，赋值给原变量—不建议 消耗内存空间)
2. A.length = 0;（改变原数组，建议 不消耗空间）
3. splice;
4. pop;
5. shift;

11. 数组的查询

1. 左 => 右
   arr.indexOf(‘开始查找位置’,‘结束查找位置’);
   返回：如果有返回位置没有返回-1;
2. 右 => 左
   arr.lastIndexOf(‘开始查找位置’,‘结束查找位置’);
   返回：如果有返回位置没有返回-1;

12.find and findIndex

find

返回:item
类似过滤器

 let array = [1, 2, 3, 4, 5];
  let data = array.find(function (item) {
    return item == 2;
  });
  console.log(data); //返回值为2

 findIndex类似find返回的是index

 let array = [
    {id:0,name:'one'},
    {id:1,name:'two'},
    {id:2,name:'three'},
    {id:3,name:'four'},
];

let index = array.findIndex(item=>{
    return item.id == 1
})

console.log(index); //返回的索引值为1

13.arr.sort() 排序

//从小到大 升序排列
  arr = sort(arr, function (a, b) {
    return b - a;
  });
//从大到小 降序排列
  arr = sort(arr, function (a, b) {
    return a - b;
  });

14.循环

没标识的都可以改变原数组

1. for
2. for of

• 里面是值类型：原数组不变
• 里面是引用类型：原数组改变

1. for in
2. forEach

• 对于dom数组可以直接使用，并不用转换

15.迭代器

1. keys

• 通过迭代对象获取索引

const ss = ["a", "b"];
const keys = ss.keys();
console.log(keys.next());
console.log(keys.next());

• 获取数组所有键

const arr = ["A", "B", "C", "D"];

for (const key of arr.keys()) {
  console.log(key);
}

2.values

• 通过迭代对象获取值

const array = ["a", "b"];
const values = array.values();
console.log(values.next());
console.log(values.next());
console.log(values.next());

 

 

• 获取数组的所有值

"use strict";
const array = ["a", "b", "c", "d"];

for (const value of array.values()) {
  console.log(value);
}

 3.entries

• 返回数组所有键值对，下面使用解构语法循环

const array = ["a", "b", "c", "d"];
for (const [key, value] of array.entries()) {
  console.log(key, value);
}

 16. every，some

• every:全部通过返回true
• some:有符合条件就返回true

17.map

map（value，index，array）

• 值类型：不改变原数组
• 引用类型：直接改变原数组

18. filter

• filter（value，index，array)
• 返回符合条件的元素

19.reduce、reduceRight

使用 reduce 与 reduceRight 函数可以迭代数组的所有元素，reduce 从前开始 reduceRight 从后面开始。

第一个参数是执行函数，第二个参数为初始值

• 传入第二个参数时将所有元素循环一遍
• 不传第二个参数时从第二个元素开始循环

reduce(('上次返回的值', '当前元素值','当前索引','原数组') => {}, '初始值');