js数组方法总结

xiao_cheng_

已于 2024-03-15 10:25:50 修改

阅读量631

点赞数 1

分类专栏： js 文章标签： javascript 前端

于 2023-04-17 13:51:27 首次发布

本文链接：https://blog.csdn.net/xiao_cheng_/article/details/130195110

版权

js 专栏收录该内容

12 篇文章 0 订阅

订阅专栏

数组常用方法

改变原数组的方法：push、unshift、pop、shift、sort、splice、reverse、

push：向数组尾部添加一个数值，返回值是数组的长度

let arr = [1, 3, 5, 6, 7]
 console.log(arr.push(2)) // 6
 console.log(arr)  // [1, 3, 5, 6, 7, 2]

// 向尾部添加多个数值
arr.push(1, 2, 3) // [1, 3, 5, 6, 7, 1, 2, 3]
// 若是写成数组的形式，会把整个数组当成一个元素添加进数组的尾部；
arr.push([4,5,6,7]) // [1, 3, 5, 6, 7, [4,5,6,7]]

unshift：向头部添加一个或多个数值，返回数组的长度

let arr = [1, 3, 5, 6, 7]
 console.log(arr.unshift(2)) // 6
 console.log(arr)  // [2, 1, 3, 5, 6, 7]
 //若是写成数组的形式，会把整个数组当成一个元素添加进数组的头部；
 arr.unshift([2,2,2]) // [[2, 2, 2],1, 3, 5, 6, 7]
 //向数组头部添加多个值
 arr.unshift(3,4,5) // [3, 4, 5, 1, 3, 5, 6, 7]

pop：删除数组尾部元素，并且将删除的元素返回，不接受指定参数

let arr = [1, 3, 5, 6, 7]
console.log(arr.pop()) //  7
console.log(arr)  // [1, 3, 5, 6]
// 不接受指定参数，仍旧删除数组尾部的一个元素
arr.pop(3) // 6
console.log(arr)  //  [1, 3, 5]

shift：删除数组的第一个元素并将其返回，然后把所有随后的元素下移一个位置来填补数组头部的空缺

let a = [1, 2, 3]
console.log(a.shift())   // 1 (被删除的数组元素)
console.log(a)         //  [2, 3]

sort：将数组中的元素排序并返回排序后的数组，当不带参数调用sort()时，数组元素以字母表顺序排列

let a = new Array("banana","cherry","apple");
a.sort(); // a: ['apple', 'banana', 'cherry']

(一)为了按照其他方式而非字母顺序进行数组排序，必须给sort方法传递一个比较函数，该函数决定了它的两个参数在排好序的数组中的先后顺序。假设第一个参数应该在前，比较函数应该返回一个小于0的数值。反之，假设第一个参数应该在后，函数应该返回一个大于0的数值。并且，假设两个值相等(也就是说，它们的顺序无关紧要)，函数应该返回0

let a = [33,4,1111,222];
a.sort();             //字母表顺序:1111,222,33,4
a.sort(function(a,b){  //数值顺序：4，33，222，1111
    return a-b;        //根据顺序，返回负数、0、正数
})
a.sort(function(a,b){return b-a});  //数值大小相反的顺序
结合一下：
function sortArr(isOrder = true) { // 默认为升序
  return function(a, b) {
    if (isOrder) {
      return a - b
    } else{
      return b - a
    }
  }
}
a.sort(sortArr()) // a：[4, 33, 222, 1111]
a.sort(sortArr(false))  // a：[1111, 222, 33, 4]

(二)数组对象排序

let a = [
  { id: 33, name: '夜雨声烦' },
  { id: 4, name: '石不转' },
  { id: 1111, name: '冰雨' },
  { id: 222, name: '沐雨橙风' },
];
function dateSort(property, isOrder = true) { //默认代表升序，false为降序
  return function(a, b) {
    let value1 = a[property]
    let value2 = b[property]
    if (isOrder) {
      return value1 - value2
    } else {
      return value2 - value1
    }
  }
}
a.sort(dateSort('id')) // a如下：
0: {id: 4, name: '石不转'}
1: {id: 33, name: '夜雨声烦'}
2: {id: 222, name: '沐雨橙风'}
3: {id: 1111, name: '冰雨'}

a.sort(dateSort('id', false)) // a如下：
0: {id: 1111, name: '冰雨'}
1: {id: 222, name: '沐雨橙风'}
2: {id: 33, name: '夜雨声烦'}
3: {id: 4, name: '石不转'}

(三)对一个字符串数组执行不区分大小写的字母表排序，比较函数首先将参数都转化为小写字符串(使用toLowerCase()方法)，再开始比较

let a = ['ant','Bug','cat','Dog'];
a.sort();   //  区分大小写的排序：['Bug','Dog','ant','cat']
a.sort(function(s,t){  //不区分大小写的排序
    var a = s.toLowerCase();
    var b = s.toLowerCase();
    if(a < b) return -1;
    if(a > b) return 1;
    return 0;
})   //  => ['ant','Bug','cat','Dog']

splice：在数组中插和或删除元素。返回一个由删除元素数组组成的数组，或者如果没有删除元素就返回一个空数组

第一个参数指定了插入和(或)删除的起始位置。
第二个参数指定了应该从数组中删除的元素的个数。
如果省略第二个参数，从起始点开始到数组结尾的所有元素都将被删除。
紧随其后的任意个数的参数指定了需要插入到数组中的元素，从第一个参数指定的位置开始插入

let a = [1,2,3,4,5,6,7,8];
a.splice(4);      //返回[5,6,7,8]; a是[1,2,3,4]
a.splice(1,2);     //返回[2,3]; a是[1,4]
a.splice(1,1);     //返回[4]; a是[1]

// ----删除并插入数组元素
let a = [1,2,3,4,5];
a.splice(2,0,'a','b');     //返回[]; a是[1,2,'a','b',3,4,5]
a.splice(2,2,[1,2],3);     //返回['a','b']; a是[1,2,[1,2],3,3,4,5]

将数组的某一项移动到首位

var layers = [3,4,2,5];
layers.unshift(layers.splice(2,1)[0])
console.log(layers); // =>  [2, 3, 4, 5]

交换数组元素位置

const arr = [1, 2, 4, 3]
arr.splice(3, 1, ...arr.splice(2, 1, arr[3]))

reverse：将数组中的元素颠倒顺序，返回逆序的数组。它不通过重新排列的元素创建新的数组，而是在原先的数组中重新排列他们

let a = [1,2,3];
a.reverse().join()  // => "3,2,1"，并且现在的a是[3,2,1]

不改变原数组的方法：concat、join、slice、reduce、forEach、map、filter、findIndex

concat 创建并返回一个新数组

元素包括调用concat()的原始数组的元素和concat()的每个参数。如果这些参数中的任何一个自身是数组，则连接的是数组的元素，而非数组本身。

let a = [1,2,3];
a.concat(4,5) ;     // 返回[1,2,3,4,5]
a.concat([4,5]);    //返回[1,2,3,4,5]
a.concat([4,5],[6,7])  //返回[1,2,3,4,5,6,7]
a.concat(4,[5,[6,7]])   //返回[1,2,3,4,5,[6,7]]

join 将数组中所有元素都转化为字符串并连接在一起，返回最后生成的字符串

可以指定一个可选的字符串在生成的字符串中来分隔数组的各个元素。如果不指定分隔符，默认使用逗号

let a = [1,2,3];
a.join();     // => "1,2,3"
a.join(" ");  // => "1 2 3"
a.join("")    // => "123";
var b = new Array(10);  //长度为10的空数组
b.join('-')    // => '---------':9个连字号组成的字符串

slice 返回指定数组的一个片段或子数组

两个参数分别指定了片段的开始和结束的位置。返回的数组包含第一个参数指定的位置和所有到但不含第二个参数指定的位置之间的所有数组元素。如果只指定一个参数，返回的数组将包含从开始位置到数组结束的所有元素。如果参数中出现负数，它表示相对于数组中最后一个元素的位置

let a = [1,2,3,4,5];
a.slice(0,3);        //返回[1,2,3]
a.slice(3);          //返回[4,5]
a.slice(1,-1);       //返回[2,3,4]
a.slice(-3,-2);      //返回[3]

(一)纯js 分页

<div id="div"></div>
<button onclick="jump(1)">第一页</button>
<button onclick="jump(2)">第二页</button>
<button onclick="jump(3)">第二页</button>
<script>
    let div = document.getElementById('div')
    let currentList = [1, 2, 3, 4, 5, 6, 7, 8, 9, '夜雨声烦', '石不转', '辉月', '沐雨橙风']
    let pageNum = 1
    let pageSize = 5
    jump()
    function jump(num=1) {
        pageNum = num
        let array = currentList.slice((pageNum - 1) * pageSize, pageNum * pageSize)
        const HTMLString = `
	        ${array.map(element => {
	            return `<p>${element}</p>`
	        }).join('')}
        `
        div.innerHTML = HTMLString
    }
</script>

reduce和reduceRight 将数组元素进行组合，生成单个值。也可以称之为“注入”和“折叠”。reduce和reduceRight均不改变原数组，

需要两个参数，第一个是执行化简操作的函数，第二个(可选)的参数是一个传递给函数的初始值。
语法：


reduceRight(callbackFn, initialValue) // initialValue为可选参数
reduce(callbackFn, initialValue)  // initialValue为可选参数
callbackFn函数被调用时可以传入一下参数：
1.accumulator：上一次调用 callbackFn 的结果。在第一次调用时，如果指定了 initialValue 则为指定的值，否则为 array[0] 的值
2.currentValue：当前元素的值。在第一次调用时，如果指定了 initialValue，则为 array[0] 的值，否则为 array[1]
3.currentIndex：currentValue 在数组中的索引位置。在第一次调用时，如果指定了 initialValue 则为 0，否则为 1
4.array：调用了 reduce() 的数组本身。

第一次执行回调函数时，不存在“上一次的计算结果”。如果需要回调函数从数组索引为 0 的元素开始执行，则需要传递初始值。否则，数组索引为 0 的元素将被用作初始值，迭代器将从第二个元素开始执行（即从索引为 1 而不是 0 的位置开始）。
如果数组为空，且未提供initialValue，则抛出异常
callbackFn 仅对已分配值的数组索引进行调用。不会对稀疏数组中的空槽进行调用。

reduce() 不会改变被调用的数组，但是作为 callbackFn 提供的函数可能会改变数组。但需要注意的是，在第一次调用 callbackFn 之前，数组的长度会被保存

1. 当开始调用 reduce() 时，callbackFn 将不会访问超出数组初始长度的任何元素
2. 对已访问索引的更改不会导致再次在这些元素上调用 callbackFn
3. 如果数组中一个现有的、尚未访问的元素被 callbackFn 更改，则它传递给 callbackFn 的值将是该元素被修改后的值。被删除的元素则不会被访问

如果数组只有一个元素（无论位置如何）且未提供 initialValue，或者提供了 initialValue 但数组为空，则将返回该单个值，而不调用 callbackFn

const getMax = (a, b) => Math.max(a, b);

// 从索引 0 开始为数组中的每个元素调用回调函数
[1, 100].reduce(getMax, 50); // 100
[50].reduce(getMax, 10); // 50

// 仅为索引 1 处的元素调用回调函数
[1, 100].reduce(getMax); // 100

// 不调用回调函数
[50].reduce(getMax); // 50
[].reduce(getMax, 1); // 1

[].reduce(getMax); // TypeError

let data = [1, 2, 3, 4]
data.reduce((x, y) => x+y)
console.log(data) //  [1, 2, 3, 4]
let arr = data.reduce((x, y) => x+y)
console.log(arr)  // 10
    
let data1 = [4, 3, 2, 1]
data1.reduceRight((x, y) => x*y)
console.log(data1) // [4, 3, 2, 1]
let arr1 = data.reduce((x, y) => x+y)
console.log(arr1)  // 24

reduce使用的函数与foreach和map使用的函数不同。数组元素、元素的索引和数组本身将作为第2~4个参数传递给函数。第一个参数是到目前为止的化简操作累积的结果。第一次调用函数时，第一个参数是一个初始值，它就是传递给reduce的第二个参数。在接下来的调用中，这个值就是上一次化简函数的返回值。
在空数组上，不带初始值参数调用reduce将导致类型错误异常。如果调用它的时候只有一个值–数组只有一个元素并且没有指定初始值，或者有一个空数组并且指定一个初始值–reduce只是简单地返回那个值而不会调用化简函数
reduceRight的工作原理和reduce一样，不同的是它按照数组索引从高到低(从右到左)处理数组，而不是从低到高
reduce和reduceRight都能接收一个可选的参数，它指定了化简函数调用时的this关键字的值。可选的初始值参数仍然需要占一个位置

示例：

1、求和，求积、最大值

var a = [1,2,3,4,5];
var sum = a.reduce(function(x,y) {return x+y},0); //数组求和
var product = a.reduce(function(x,y) {return x*y}, 1);//数组求积
var max = a.reduce(function(x,y) {return (x>y)? x :y;});//求最大值

sun：第一次调用化简函数时的参数是0和1.将两者相加并返回1.再次调用时的参数是1和2，他返回3.然后计算3+3=6、6+4=10，最后计算10+5=15；最后的值是15，reduce返回这个值

参考链接https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array/reduce

2、求对象数组中值的总和

const objects = [{ x: 1 }, { x: 2 }, { x: 3 }];
const sum = objects.reduce((pre, current) => pre + current.x, 0);
console.log(sum); // 6

3、展平嵌套数组

const flattened = [
      [0, 1],
      [2, 3],
      [4, 5],
    ].reduce((pre, current) => pre.concat(current), []);
console.log(flattened) [0, 1, 2, 3, 4, 5]

4、计算数组中每个元素出现的次数及计算数组中给定元素出现的次数

let arr = ['aa', 'bb', 'cc', 'aa', 'aa', 'bb']
    let nameNum = arr.reduce((pre, next) => {
      if (next in pre) {
        pre[next]++
      } else {
        pre[next] = 1
      }
      return pre
    }, {})
    console.log(nameNum) // {aa: 3, bb: 2, cc: 1}
// 计算数组中给定元素出现的次数
let data = arr.reduce((count, curr) => count += Number(curr === 'aa'), 0)
console.log(data) // 3

5、按属性对对象进行分组

const people = [
      { name: "Alice", age: 21 },
      { name: "Max", age: 20 },
      { name: "Jane", age: 20 },
    ];

    function groupBy(objectArray, property) {
      return objectArray.reduce((pre, obj) => {
        const key = obj[property];
        const curGroup = pre[key] ?? [];
        console.log(obj, key, curGroup, pre)
        return { ...pre, [key]: [...curGroup, obj] };
      }, {});
    }
    const groupedPeople = groupBy(people, "age");
    console.log(groupedPeople);
    // {
	//   20: [
	//     { name: 'Max', age: 20 },
	//     { name: 'Jane', age: 20 }
	//   ],
	//   21: [{ name: 'Alice', age: 21 }]
	// }

6、数组去重和数组对象去重

// 数组去重
const array = ["a", "b", "a", "b", "c", "e", "e", "c", "d", "d", "d", "d"];
    const duplicate = array.reduce((pre, current) => {
      if (!pre.includes(current)) {
        return [...pre, current];
      }
      return pre;
    }, []);

    console.log(duplicate); // ['a', 'b', 'c', 'e', 'd']

// 数组对象去重
const array = [{ id: 1, label: 'aaa' }, { id: 2, label: 'aaa' }, { id: 1, label: 'aaa' }, { id: 4, label: 'aaa' }]
const obj = {}
const duplicate = array.reduce((pre, current) => {
  if (!obj[current.id]) {
    obj[current.id] = true && pre.push(current)
  }
  return pre
}, [])

console.log(duplicate) // [{ "id": 1,"label": "aaa"},{ "id": 2,"label": "aaa"},{ "id": 4,"label": "aaa"}]

map：将调用的数组的每个元素传递给指定的函数，并返回一个数组，它包含该函数的返回值

传递给map的函数的调用方式和传递给forEach的函数的调用方式不一样。但传递给map的函数应该有返回值
如果是稀疏数组，返回的也是相同方式的稀疏数组：它具有相同的长度，相同的缺失元素

let a = [1,2,3];
let b = a.map(function(x) {return x*x;})     //b是[1,4,9]

forEach ：从头至尾遍历数组，为每个元素调用指定的函数

传递的函数作为forEach的第一个参数。然后forEach使用三个参数调用该函数：数组元素、元素的索引和数组本身。
如果只关心数组元素的值，可以编写只有一个参数的函数–额外的参数将忽略

var data = [1,2,3,4,5];                    //要求和的数组
//计算数组元素的和值
var sum = 0;                               //初始为0
data.forEach(function(value) {sum += value})//将每个值累加到sum上
sum                                          // => 15
//每个数组元素的值自加1
data.forEach(function(v,i,a) {a[i] = v+1;})
data                                          // =>[2,3,4,5,6]

中断forEach循环

break、continue、return均无法中断forEach循环，break和continue会报错，return只是中断当前项，并没有断掉循环

let arr = [1, 2, 3, 4]
 arr.forEach(item => {
     if (item === 3) return
     console.log(item)
 })

在这里插入图片描述

forEach无法在所有元素都传递给调用的函数之前终止遍历：没有像for循环中使用的相应的break语句。如果要提前终止，必须把forEach方法放在一个try中，并能抛出一个异常。如果forEach调用的函数抛出foreach.break异常，循环会提前终止；

let arr = [1, 2, 3, 4]
    try {
        arr.forEach((item) => {
            if (item === 3) throw('中断啦')
            console.log(item)
        })
    }
    catch(e) {
        console.log(e)
    }

在这里插入图片描述
javascript权威指南中代码如下

function foreach(a, f, t) {
	try {a.forEach(f,t);}
	catch(e) {
	    if(e === foreach.break) return;
	    else throw e;
	}
} 
foreach.break = new Error("stopIteration");

filter：返回的数组元素是调用的数组的一个子集。传递的函数是用来逻辑判定的：该函数返回true或false。调用判定函数就像调用forEach和map一样。如果返回值为true或能转化为true的值，那么传递给判定函数的元素就是这个子集的成员，它将被添加到一个作为返回值的数组中

let a = [5,4,3,2,1];
smallvalue = a.filter(function(x) {return x<3;});   //[2,1]
everyother = a.filter(function(x,i) {return i%2 == 0}); // [5,3,1]

filter会跳过稀疏数组中缺少的元素，它的返回数组总是稠密的。为了压缩稀疏数组的空缺，代码如下

let sparse = [1, , 3, 4, undefined, null, 6 ]
var dense  = sparse.filter(function() {return true;});
// dense：[1, 3, 4, undefined, null, 6]，下标为1的过滤掉了

甚至，压缩空缺并删除undefined和null元素，可以这样使用filter

let a= [1, , 3, 4, undefined, null, 6 ]
a = a.filter(function(x) {return x !== undefined && x != null;})
// a： [1, 3, 4, 6]  下标为1、4、5的元素都过滤掉了

find：找到第一个满足测试函数的元素并返回那个元素的值，如果找不到则返回undefined

[1, 5, 10, 15].find(function(value, index, arr) { // 参数：当前值、当前的位置、原数组
  return value > 9;
}) // 10

findIndex：返回传入一个测试条件（函数）符合条件的数组第一个元素位置

为数组中的每个元素都调用一次函数执行：

当数组中的元素在测试条件时返回 true 时, findIndex() 返回符合条件的元素的索引位置，之后的值不会再调用执行函数。
如果没有符合条件的元素返回 -1；
注意: findIndex() 对于空数组，函数是不会执行的。
注意: findIndex() 并没有改变数组的原始值。
find与findIndex都可以接受第二个参数，用来绑定回调函数中的this对象；都发现NaN，弥补了数组的indexOf的不足。

[NaN].indexOf(NaN)
// -1
[NaN].findIndex(y => Object.is(NaN, y))
// 0     findIndex()方法可以借助Object.is()方法做到识别NaN

find和findIndex都是从数组的0号位，依次向后检查，ES2022新增findLast和findLastIndex从数组的最后一个成员开始，依次向前检查，其他都保持不变

const array = [
  { value: 1 },
  { value: 2 },
  { value: 3 },
  { value: 4 }
]; // 寻找第一个value属性为奇数的成员。结果，该成员是{ value: 3 }，位置是2号位
array.findLast(n => n.value % 2 === 1); // { value: 3 }
array.findLastIndex(n => n.value % 2 === 1); // 2

其他方法：some、every、indexOf、lastIndexOf、includes

some和every ：是数组的逻辑判定：它们对数组元素应用指定的函数进行判定，返回true或false

every方法：当且仅当对数组中的所有元素调用判定函数都返回true：

let a = [1,2,3,4,5];
a.every(function(x) {return x<10;})   // => true：所有的值 < 10
a.every(function(x) {return x % 2 === 0;})  // => false：不是所有的值都是偶数

some方法：当数组中至少有一个元素调用判定函数返回true，它就返回true，并且当且仅当数值中所有元素调用判定函数都返回false，它才返回false：

let a = [1,2,3,4,5];
a.some(function(x) {return x%2 === 0;})      // => true:a含有偶数值
a.some(isNaN)                                // => false:a不包含非数值元素

一旦every和some确认返回什么值它们就会停止遍历数组元素。some在判定函数第一次返回true后就返回true，但如果判定函数一直返回false，它将会遍历整个数组，every恰好相反：它在判定函数第一次返回false后就返回false，但如果判定函数一直返回true，它将会遍历整个数组。在空数组上调用时，every返回true，some返回false

indexOf和lastIndexOf ：indexOf和lastIndexOf搜索整个数组中具有给定值的元素，返回找到的第一个元素的索引或者如果没有找到就返回-1.indexOf从头至尾搜索，而lastIndexOf则反向搜索。

indexOf和lastIndexOf方法不接收一个函数作为其参数。第一个参数是需要搜索的值，第二个参数是可选的：它指定数组中的一个索引，从那里开始搜索。如果省略该参数，indexOf从头开始搜索，而lastIndexOf从末尾开始搜索。第二个参数也可以是负数，它代表相对数组末尾的偏移量

let a = [0,1,3,1,0];
a.indexOf(1)      // => 1:a[1]是1
a.lastIndexOf(1)  // => 3:a[3]是1
a.indexOf(4)      // => -1:没有值为4的元素

includes 方法用来判断一个数组是否包含一个指定的值，根据情况，如果包含则返回 true，否则返回 false

includes(searchElement, fromIndex)
*第一个参数 需要查找的值。
第二个参数(可选) 开始搜索的索引（从零开始），会转换为整数。

负索引从数组末尾开始计数——如果 fromIndex < 0，那么实际使用的是 fromIndex + array.length。然而在这种情况下，数组仍然从前往后进行搜索
如果 fromIndex < -array.length 或者省略 fromIndex，则使用 0，这将导致整个数组被搜索
如果 fromIndex >= array.length，则不会搜索数组并返回 false
0 值都被认为是相等的，不管符号是什么。（即 -0 等于 0），但 false 不被认为与 0 相同。NaN 可以被正确搜索到
当在稀疏数组上使用时，includes() 方法迭代空槽，就像它们的值是 undefined 一样

const arr = [2, '1', '3', '4', 'abc', 'b', 3, NaN]
console.log(arr.includes(1)) // false
console.log(arr.includes('bc')) // false
console.log(arr.includes(3)) // true
console.log(arr.includes(2, -1)) // false
console.log(arr.includes(NaN)) // true

数组遍历时删除某项元素

let currentList = [
        { id: 1, name: '夜雨声烦', role: '剑客' },
        { id: 3, name: '石不转', role: '牧师' },
        { id: 4, name: '沐雨橙风', role: '枪炮师' },
        { id: 2, name: '索克萨尔', role: '术士' },
        { id: 5, name: '一叶知秋', role: '法师' },
        { id: 7, name: '李茂贞', role: '岐王' },
        { id: 9, name: '水云姬', role: '女帝' },
        { id: 8, name: '候卿', role: '尸祖' },
        { id: 6, name: '赵玉真', role: '道士' },
        { id: 10, name: '李寒衣', role: '剑仙' },
        { id: 13, name: '镜玄', role: '剑客' },
        { id: 12, name: '须灵犀', role: '牧师' },
        { id: 11, name: '盖聂', role: '剑士' }
    ]

最后

深复制数组的方法

使用slice()或…扩展运算符(对于对象数组无效)

const arr = [1, 2, 3, 4, 5]
const newArr = [...arr] // 或arr.slice()
newArr.push(6)
console.log(newArr) // [1, 2, 3, 4, 5, 6]
console.log(arr) // [1, 2, 3, 4, 5]

无效：
const arr = [1, 2, { name: '夜雨声烦'}, { age: 18}]
const newArr = arr.slice() // 或 [...arr]
newArr[2].name = "石不转"
console.log(newArr) // [1, 2, {name: 石不转}, {age: 18}]
console.log(arr) // [1, 2, {name: 石不转}, {age: 18}]

判断两个数组是否相等

比较两个数组是否相等，不能直接使用 “==”。
相等运算符比较两个对象时，仅当两个操作数引用同一个对象时返回 true
错误方式：

let arr1 = [1, 2, 'arr']
let arr2 = [1, 2, 'arr']
arr1 == arr2 // false

let arr3 = '1,2,arr'
arr1 == arr3 // true

正确方式

let arr1 = [1, 2, 'arr']
let arr2 = [1, 2, 'arr']
arr1.toString() == arr2.toString() // true
arr1.join() == arr2.join() // true
元素及其下标若不一致可用every()方法