javascript-你可能不知道的数组

2022-11-15 14:41:51 浏览数 (1)

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

2.array.of创建数组

代码语言:javascript复制
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

代码语言:javascript复制
  const div = document.querySelectorAll("div");
  [...div].map(function (item) {
    item.addEventListener("click", function () {
      this.classList.toggle("hide");
    });
  });

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

代码语言:javascript复制
 let array1 = ["1", "2"];
    let array2 = ["3", "4"];
    array1 = [...array1, ...array2];
    console.log(array1);

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

代码语言:javascript复制
 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 类似过滤器

代码语言:javascript复制
 let array = [1, 2, 3, 4, 5];
  let data = array.find(function (item) {
    return item == 2;
  });
  console.log(data); //返回值为2

 findIndex类似find返回的是index

代码语言:javascript复制
 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() 排序

代码语言:javascript复制
//从小到大 升序排列
  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
  • 通过迭代对象获取索引
代码语言:javascript复制
const ss = ["a", "b"];
const keys = ss.keys();
console.log(keys.next());
console.log(keys.next());
  • 获取数组所有键
代码语言:javascript复制
const arr = ["A", "B", "C", "D"];

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

2.values

  • 通过迭代对象获取值
代码语言:javascript复制
const array = ["a", "b"];
const values = array.values();
console.log(values.next());
console.log(values.next());
console.log(values.next());
  • 获取数组的所有值
代码语言:javascript复制
"use strict";
const array = ["a", "b", "c", "d"];

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

 3.entries

  • 返回数组所有键值对,下面使用解构语法循环
代码语言:javascript复制
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 从后面开始。

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

  • 传入第二个参数时将所有元素循环一遍
  • 不传第二个参数时从第二个元素开始循环
代码语言:javascript复制
reduce(('上次返回的值', '当前元素值','当前索引','原数组') => {}, '初始值');

0 人点赞