关于前端:JavaScript数组详解全网最全

9次阅读

共计 15801 个字符，预计需要花费 40 分钟才能阅读完成。

定义数组的形式有多种，别离如下

let array=[]（字面量）
let array=new Array()
let array=new Array([length]) length 示意长度
let array=new Array(arg1,arg2,arg3….)

let array=[];   // 初始化一个空数组
let array2=new Array();  // 初始化一个空数组
let array3=new Array(10); // 初始化一个长度为 10 的数组，数组的每一项都是 empty
let array4=new Array(10,20,30,40);//  初始化一个长度为 4 的数组，数组的项别离为 10，20，30，40

其中在开发中，let array=[]应用的最多，也是举荐的。

定义一个数组之后须要向数组中增加对应的项，这里先介绍几种简略的解决办法。

array[index]=xxx
array[array.length]=xxx

let array=[];
array[0]=100;
array[1]=200;
console.log(array); //   100，200

let array2=[10,20];
array2[array.length]=30;
console.log(array2);  // 10 20 30

如果须要批改的项存在则执行批改操作，不存在执行新增操作

let array=[];
array[0]=100;
array[1]=200;
console.log(array); //   100，200

array[1]=300;    // 项存在，执行批改操作
console.log(array); // 100 300

arr.length=xxx xxx 小于数组的长度就能够删除项

let array=[];
array[0]=100;
array[1]=200;
console.log(array); //   100，200
array.length=0;
console.log(array); // []

循环遍历每一项，for 循环，forEach 循环等等
下标 (索引) 获取，array[index] 其中 index 示意索引

let array=[10,20,30,40,50];
console.log(array[0]); // 获取数组的第一项 10
for(let i=0;i<array.length;i++){console.log(array[i]);  //  遍历数组的每一项 10，20，30，40，50
}

初始化数组之后，数组自带有一个 length 属性，示意数组的长度，这里就不再进行介绍了，检测数组的办法有 instanceof 和 Array.isArray()

let array=[10,20,30,40,50];
console.log(Array.isArray(array));  // true
console.log(array instanceof Array); // true

咱们晓得数组是对象，既然是对象就必然离不开属性 (length) 和办法，对于属性 length，就那啥了，你们懂的，次要介绍一下数组的办法，这里分为 ES5 数组罕用的办法和 ES6 数组的办法。

Array.toString()：将数组变成由逗号宰割的字符串
Array.valueOf()：返回数组自身

let array=[10,20,30,40,50];
console.log(array.toString());  // 10,20,30,40,50
console.log(array.valueOf());   // [10,20,30,40,50]

Array.push()：将一个或多个元素增加到数组的开端，并返回该数组的新长度
Array.pop()：从数组中删除最初一个元素，并返回该元素的值。此办法更改数组的长度

let array=[];
array.push(10,20,30,40,50,60);
console.log(array);// 10,20,30,40,50,60
let item=array.pop();
console.log(item);// 60
console.log(array);//  10,20,30,40,50

留神：数组的办法不反对推入整个数组，例如 arr.push([1,2,3])不会是 1,2,3，[1,2,3]只会作为数组中的一项，如果想实现，能够应用 ES6 的扩大运算符 …

let array=[10,20,30,40];
let array1=[50,60,70,80];
array.push(...array1); // 应用扩大运算符
console.log(array);// 10,20,30,40,50,60,70,80

Array.shift()：从数组中删除第一个元素，并返回该元素的值。此办法更改数组的长度
Array.unshift()：办法将一个或多个元素增加到数组的结尾，并返回该数组的新长度(该办法批改原有数组）

let array=[10,20,30,40];
let item=array.shift();
console.log(item);  // 10
console.log(array);// 20,30,40
array.unshift(100,200,300);
console.log(array);// 100,200,300,20,30,40

Array.reverse()：将数组中元素的地位颠倒，并返回该数组。数组的第一个元素会变成最初一个，数组的最初一个元素变成第一个。该办法会扭转原数组
Array.sort()：对数组的元素进行排序，并返回数组。默认排序程序是在将元素转换为字符串，而后比拟它们的 UTF-16 代码单元值序列时构建的

let array1=[10,20,30,40,50];
array1.reverse();
console.log(array1);// 50,40,30,20,10
let array2=[10,5,20,30,40,50];
array2.sort();
console.log(array2);// 10,20,30,40,5,50

控制台输入能够看到，sort 排序办法并没有实现咱们冀望的后果 5，10，20，30，40，50，这是因为首先 sort 会调用每个数组项的 toString()转型办法，而后比拟失去的字符串，如果要实现冀望的后果，能够在 sort 中传入一个函数实现排序。

Array.sort(function(a,b){})

a：用于比拟的第一个参数

b：用于比拟的第二个参数

如果第一个参数应该位于第二个参数之前则返回一个正数，如果两个参数相等则返回 0，如果第一个参数应该位于第二个参数之后则返回一个负数。

Array.sort()实现升序

let array=[10,20,40,50,30];
function compare(x,y) {if(x<y){return -1;}else if(x>y){return 1}else {return 0}
}
array.sort(compare);
console.log(array);    // 10，20，30，40，50

通过排序之后，失去了排序之后升序的后果，如果想要实现降序，将地位调换一下就能够了

Arra.sort()实现降序

let array=[10,20,40,50,30];
function compare(x,y) {if(x<y){return 1;}else if(x>y){return -1}else {return 0}
}
array.sort(compare);
console.log(array); // 50,40,30,20,10

如果是对于数值类型或者其 valueOf()办法会返回数值类型的对象类型，能够间接应用第一个参数减去第二个参数

Array.concat()：用于合并两个或多个数组。此办法不会更改现有数组，而是返回一个新数组
Array.slice([start,end])：能够承受一或两个参数，即返回项的起始地位和完结地位，只有一个参数，返回该参数指定地位到以后数组开端的所有项，如果有两个参数，该办法返回起始地位到完结地位之间的项(但不包含完结地位的项)
Array.splice()：
- 删除 => 能够删除任意数量的项，只需指定两个参数，要删除第一项的地位和要删除的项数
- 插入 => 能够向指定地位插入任意数量的项，只需提供 3 个参数，起始地位，0，要插入的项，如果要插入多个项，能够传入第 n 项，第 n + 1 项，…
- 替换 => 能够向指定地位插入任意数量的项，且同时删除任意数量的项, 只需指定 3 个参数，起始地位，要删除的项数和要插入的的任意数量的项，插入的项数不用与删除的项数相等
Array.join()：应用不同的符号连贯数组

Array.concat()

let array=[10,20,30,40];
let array1=[50,60];
let newArray=array.concat(array1);
console.log(newArray);  // 10,20,30,40,50,60
let array2=array.concat('20',[50,60],80);
console.log(array2);  // 10,20,30,40,20,50,60,80

Array.slice(start,end)

start：示意起始地位的索引

end：示意完结地位的索引

let array=[10,20,30,40,50,60,70];
let array1=array.slice(1);// 没有完结地位，示意从起始地位到数组开端
console.log(array1);// 20,30,40,50,60,70
let array2=array.slice(2,5); // 起始地位的索引为 2，完结地位的索引为 5(不包含完结地位)
console.log(array2);// 30,40,50

留神：如果 slice()办法中起始地位或完结地位中有正数，则用数组的长度加上该数来确定，举个例子：在一个蕴含 5 项的数组中 slice(-2,-1)和 slice(3,4)是一样的，如果完结地位小于起始地位则返回空数组。

Array.splice(index,item)实现删除操作

let array=[10,20,30,40,50];
array.splice(2,2); // 从索引 2 开始删除两项
console.log(array); //  10,20,50

Array.splice(start,0,addItem)实现新增操作

let array=[10,20,30];
array.splice(1,0,40,50,60);//  从下标 1 开始删除 0 项，新增 40，50，60 这三项
console.log(array); // 10,40,50,60,20,30

Array.splice(start,deleteItem,addItem)实现批改操作

let array=[10,20,30,40,50,60,70];
array.splice(2,2,90,100,110); // 从下标 2 开始删除 2 项，插入 90，100，110 这三项
console.log(array);//   10,20,90,100,110,50,60,70

须要留神的一点是：插入项的时候是插入以后删除项的后面

Array.join()

这个办法能够应用不同的符号连接成字符串，默认不传参数应用逗号 (,) 进行连贯

let array=[10,20,30,40,50,60];
let array1=array.join('-');
let array2=array.join('|');
let array3=array.joing();
console.log(array1); // 10-20-30-40-50-60
console.log(array2); // 10|20|30|40|50|60
console.log(array3); // 10,20,30,40,50,60

Array.indexOf(searchElement,fromIndex)：从数组的结尾 (地位 0) 开始向后查找，没有找到返回 -1
Array.lastIndexOf(searchElemengt,fromIndex)：从数组的开端开始向前查找，没有找到返回 -1

searchElement：须要查找的元素

fromIndex：示意从什么地位开始查找

// 索引     0,1,2,3,4,5,6,7,8
let array=[1,2,3,4,5,4,3,2,1];
console.log(array.indexOf(4));// 3 查找元素为 4 第一次呈现的地位
console.log(array.lastIndexOf(4));// 5 查找元素为 4 最初一次呈现的地位
console.log(array.indexOf(4,4));  // 5 从索引 4 开始查找元素为 4 第一次呈现的地位
console.log(array.lastIndexOf(4,4))// 3 从索引 4 开始查找元素为 4 最初一个呈现的地位

Array.every(function(item,index,array))：对数组中的每一项运行给定函数，如果该函数对每一项都返回 true, 则返回 true
Array.filter(function(item,index,array))：对数组中的每一项运行给定函数，返回该函数会返回 true 的项组成的数组
Array.some(function(item,index,array))：对数组中的每一项运行给定函数，如果该函数对任一项返回 true, 则返回 true
Array.forEach(function(item,index,array))：对数组中的每一项运行给定函数，这个办法没有返回值
Array.map(function(item,index,array))：对数组中的每一项运行给定函数，返回每次函数调用的后果返回的数组

let arrays=[1,2,3,4,5,4,3,2,1];
let everyResult=arrays.every((item,index,array)=>{return item>10;})
console.log(everyResult);   // false
let someResult=arrays.some((item,index,array)=>{return item>10})
console.log(someResult);    // false
let filterResult=arrays.filter((item,index,array)=>{return item>2;})
console.log(filterResult);  // 3,4,5,4,3
let mapResult=arrays.map((item,index,array)=>{return item*2;})
console.log(mapResult);// 2,4,6,8,10,8,6,4,2
arrays.forEach((item,index,array)=>{console.log(item);  // 1,2,3,4,5,4,3,2,1
})

留神：以上办法都不会批改数组中蕴含的值

Array.reduce()：迭代数组的所有项，而后构建一个最终返回的值，从数组的第一项开始，遍历到最初
Array.reduceRight()：迭代数组的所有项，而后构建一个最终返回的值，从数组的最初一项开始，向前遍历到第一项

let array=[1,2,3,4,5];
let sum=array.reduce((prev,cur,index,array)=>{return prev+cur});
console.log(sum);
let sum2=array.reduceRight((prev,cur,index,array)=>{return prev+cur})
console.log(sum2);

留神：reduce 实现的性能有很多，这里只简略的提一下

用于将类对象转为真正的数组，相似数组的对象和可遍历的对象，常见的类数组有：

document.querySelectorAll(‘ 标签 ’)获取的汇合
函数外部属性 arguments 对象

留神：只有是部署了 Iterator 接口的数据结构，Array.from 都能将其转为数组，Array.from()办法还反对相似数组的对象，任何有 length 属性的对象，都能够通过 Array.from 办法转为数组

let lis=document.querySelectorAll('li');
let arrays=Array.from(lis);
arrays.push(11111);
console.log(arrays);// li,li,li,11111
function foo() {var args=Array.from(arguments);
    args.push(10,20);
    console.log(args);  // 10,20
}
foo();

用于将一组值，转换为数组

留神：Array.of()总是返回参数值组成的数组，如果没有参数，就返回一个空数组

console.log(Array.of(3,11,8));  //  3,11,8
console.log(Array.of(3));   // 3
console.log(new Array(1,2));    // 1,2
console.log(Array.of());   // []
console.log(Array.of(undefined)); // undefined
console.log(Array.of(1));   //  1
console.log(Array.of(1,2)); // 1,2

在以后数组外部，将指定地位的成员复制到其它地位(会笼罩原有成员), 而后返回以后数组

参数：

target(必须)：从该地位开始替换数据，如果为负值，示意倒数

start(可选)：从该地位读取数据，默认为 0，如果为负值，示意从开端开始计算

end(可选): 到该地位前进行读取数据，默认等于数组长度，如果为负值，示意从开端开始计算

[1, 2, 3, 4, 5].copyWithin(-2)
// [1, 2, 3, 1, 2]
[1, 2, 3, 4, 5].copyWithin(0, 3)
// [4, 5, 3, 4, 5]
[1, 2, 3, 4, 5].copyWithin(0, 3, 4)
// [4, 2, 3, 4, 5]
[1, 2, 3, 4, 5].copyWithin(-2, -3, -1)
// [1, 2, 3, 3, 4]

应用给定值，填充一个数组

console.log(['a','b','c'].fill(7)); // 7,7,7
console.log(new Array(3).fill(10)); // 10,10,10
console.log(['a','b','c'].fill(7,1,2));// 'a',7,'c'

Array.find()：用于找出第一个符合条件的数组成员，它的参数是一个回调函数，所有数组成员顺次执行该回调办法，直到找出第一个返回值为 true 的成员，而后返回该成员，如果没有符合条件的成员，则返回 undefined。
Array.findIndex()：返回第一个符合条件的数组成员地位，如果所有成员都不符合条件，则返回 -1

let item1=[1,4,-5,10,-6].find((n)=>n<=-5);
console.log(item1);  // -5
let item2=[1,4,-5,10].find((item,index,arr)=>{return item<-5})
console.log(item2); // undefined

let item3=[1,5,10,15].findIndex((item,index,arr)=>{return item>9});
console.log(item3); // 下标为 2

返回一个布尔值，示意某个数组是否蕴含给定的值

[1, 2, 3].includes(2);     // true
[1, 2, 3].includes(4);     // false
[1, 2, 3].includes(3, 3);  // false
[1, 2, 3].includes(3, -1); // true
[1, 2, NaN].includes(NaN); // true

Array.flat([depth])：用于将嵌套的数组拉平，变成一维数组，该办法返回一个新数组，对原始数据没有影响
Array.flatMap()：对原数组的每一个成员执行一个函数 (相当于执行 Array.map() 办法)，而后对返回值组成的数组执行 flat 办法，该办法返回一个新数组，不扭转原数组

depth：指定要提取嵌套数组的构造深度，默认值为 1

let array1=[1,2,[3,4]].flat();
console.log(array1); // 1,2,3,4
let array2=[1,2,[3,[4,5]]].flat();
console.log(array2)    // 1,2,3[,4,5]
let array3=[1,2,[3,[4,5]]].flat(2);
console.log(array3);// 1,2,3,4,5

#### 数组实例的 entries()、keys()、values()

keys()：对数组键名的遍历

values()：对数组键值的遍历

entries()：对数组键值对的遍历

数组其实也是有键的，个别咱们用 console.log()办法输入的时候都是它的值，键示意索引，能够应用 console.info()办法输入详细信息

let array=[1,2,3,4,5];
for(let item of array.keys()){console.log('键是:'+item);    // 0,1,2,3,4
}
for(let item of array.values()){console.log('值是:'+item);  // 1,2,3,4,5
}
for(let [index,value] of array.entries()){console.log(` 键：${index}, 值:${value}`);
}

上文说了一下数组自带的排序办法 sort，会将数组的每一项都调用 toString()办法再进行比拟，咱们先来看下一个简略的例子

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title> 简略排序 </title>
    </head>
    <body>
        <script type="text/javascript">
            var numbers=[4,6,8,0,1,2,3,7,9];
            numbers.sort();// 调用数组内置排序办法
            console.log(numbers);//0,1,2,3,4,6,7,8,9
            numbers.reverse();// 将数组进行反转
            console.log(numbers);//9,8,7,6,4,3,2,1,0
        </script>
    </body>
</html>

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title> 简略数组自定义排序 </title>
    </head>
    <body>
        <script type="text/javascript">
            var number=[0,1,10,15,5];
            function arrAsc(a,b){    // 实现数组升序的办法
                if(a>b){return 1;}else if(a<b){return -1;}else{return 0;}
            }
            number.sort(arrAsc);// 调用数组升序的办法
            console.log(number);//0.1,5,10,15
            function arrDesc(a,b){    // 实现数组降序的办法
                if(a>b){return -1;}else if(a<b){return 1;}else{return 0;}
            }
            number.sort(arrDesc);// 调用数组降序的办法
            console.log(number);//15,10,5,1,0
            
        </script>
    </body>
</html>

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title> 简略对象自定义属性排序 </title>
    </head>
    <body>
        <script type="text/javascript">
            var friuts=[
                {
                    name:'apple',
                    price:18.5,
                    count:10
                },
                {
                    name:'pear',
                    price:1.5,
                    count:5,
                },
                {
                    name:'banana',
                    price:20.5,
                    count:20
                },
            ]
            console.log(JSON.stringify(friuts));// 未排序前
            // 按价格升序排序
            friuts.sort(function(x,y){return x.price-y.price;});
            console.log(JSON.stringify(friuts));
            // 按名称排序
            friuts.sort(function(x,y){if(x.name>y.name){return 1;}else if(x.name<y.name){return -1;}else{return 0;}
            });
            console.log(JSON.stringify(friuts));
        </script>
    </body>
</html>

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title> 通用的排序办法 </title>
    </head>
    <body>
        <script type="text/javascript">
            var friuts=[
                {
                    name:'apple',
                    price:18.5,
                    count:10
                },
                {
                    name:'pear',
                    price:1.5,
                    count:5,
                },
                {
                    name:'banana',
                    price:20.5,
                    count:20
                },
            ]
            var sortExp=function(key,isAsc){return function(x,y){if(isNaN(key)){if(x[key]>y[key]){return 1*(isAsc?1:-1);
                            
                        }else if(x[key]<y[key]){return -1*(isAsc?1:-1);
                        }else{return 0;}
                        
                    }else{return (x[key]-y[key])*(isAsc?1:-1)
                    }
                }
            }
            // 价格升序
            friuts.sort(sortExp('price',true));
            console.log(JSON.stringify(friuts));
            // 价格降序
            friuts.sort(sortExp('price',false));
            console.log(JSON.stringify(friuts));
            // 名称升序
            friuts.sort(sortExp('name',true));
            console.log(JSON.stringify(friuts));
            // 名称降序
            friuts.sort(sortExp('name',false));
            console.log(JSON.stringify(friuts));
            // 数量升序
            friuts.sort(sortExp('count',true));
            console.log(JSON.stringify(friuts));
            // 数量降序
            friuts.sort(sortExp('count',false));
            console.log(JSON.stringify(friuts));
        </script>
    </body>
</html>

function unique (arr) {return Array.from(new Set(arr))
}
let array=[1,2,3,1,2,'true','true',false,false,undefined,undefined,null,null,NaN,NaN,{},{}]
console.log(unique(array));//  1,2,3,'true',false,undefined,null,NaN,{},{}

毛病：能够看到 {} 无奈实现去重

function unique(array){for(let i=0;i<array.length;i++){    // 外层循环元素
        for(let j=i+1;j<array.length;j++){  // 内层进行值比拟
            if(array[i]==array[j]){array.splice(j,1);
                j--;
            }
        }
    }
    return array;
}
let array=[1,2,3,1,2,'true','true',false,false,undefined,undefined,null,null,NaN,NaN,{},{}];
console.log(unique(array)); // 1,2,3,'true',false,undefined,NaN,NaN,{},{}

双层循环，外层循环元素，内层循环时比拟值。值雷同时，则删去这个值

毛病：null 间接隐没，NaN 和 {} 无奈实现去重

function unique(arr) {let array = [];
    for (let i = 0; i < arr.length; i++) {if (array.indexOf(arr[i]) === -1) {array.push(arr[i])
        }
    }
    return array;
}
let array=[1,2,3,1,2,'true','true',false,false,undefined,undefined,null,null,NaN,NaN,{},{}];
console.log(unique(array));// 1,2,3,'true',false,undefined,null,NaN,NaN{},{}

毛病：NaN 和 {} 无奈实现去重

function unique(arr) {arr = arr.sort()
    let array= [arr[0]];
    for (let i = 1; i < arr.length; i++) {if (arr[i] !== arr[i-1]) {array.push(arr[i]);
        }
    }
    return array;
}
let array=[1,2,3,1,2,'true','true',false,false,undefined,undefined,null,null,NaN,NaN,{},{}];
console.log(unique(array));// 1, 2, 3, NaN, NaN, {}, {}, false, null, "true", undefined

利用 sort()排序办法，而后依据排序后的后果进行遍历及相邻元素比对。

毛病：NaN 和 {} 无奈实现去重

function unique(arr) {let array= [];
    let  obj = {};
    for (var i = 0; i < arr.length; i++) {if (!obj[arr[i]]) {array.push(arr[i])
            obj[arr[i]] = 1
        } else {obj[arr[i]]++
        }
    }
    return array;
}
let array=[1,2,3,1,2,'true','true',false,false,undefined,undefined,null,null,NaN,NaN,{},{}];
console.log(unique(array));// 1, 2, 3, "true", false, undefined, null, NaN, {}

function unique(arr) {let array =[];
    for(let i = 0; i < arr.length; i++) {if( !array.includes( arr[i]) ) {array.push(arr[i]);
        }
    }
    return array
}
let array=[1,2,3,1,2,'true','true',false,false,undefined,undefined,null,null,NaN,NaN,{},{}];
console.log(unique(array));// 1, 2, 3, "true", false, undefined, null, NaN, {}, {}

毛病：{}无奈实现去重

function unique(arr) {let obj = {};
    return arr.filter(function(item, index, arr){return obj.hasOwnProperty(typeof item + item) ? false : (obj[typeof item + item] = true)
    })
}
let array=[1,2,3,1,2,'true','true',false,false,undefined,undefined,null,null,NaN,NaN,{},{}];
console.log(unique(array));// 1, 2, 3, "true", false, undefined, null, NaN, {}

利用 hasOwnProperty 判断是否存在对象属性

function unique(arr) {return arr.filter(function(item, index, arr) {return arr.indexOf(item, 0) === index;  // NaN 无奈实现查找
    });
}
let array=[1,2,3,1,2,'true','true',false,false,undefined,undefined,null,null,NaN,NaN,{},{}];
console.log(unique(array));// 1,2,3,'true',false,undefined,null,{},{}

毛病：NaN 不见了，{}也无奈实现去重

function unique(arr) {
    var array= arr;
    var len = array.length;
    array.sort(function(a,b){   // 排序后更加不便去重
        return a - b;
    })
    function loop(index){if(index >= 1){if(array[index] === array[index-1]){array.splice(index,1);
            }
            loop(index - 1);    // 递归 loop，而后数组去重
        }
    }
    loop(len-1);
    return array;
}
let array=[1,2,3,1,2,'true','true',false,false,undefined,undefined,null,null,NaN,NaN,{},{}];
console.log(unique(array));// false,null,1,2,3,'true',NaN,NaN,{},{},undefined

毛病：{},NaN 没有实现去重

function arrayNonRepeatfy(arr) {let map = new Map();
    let array = new Array();  // 数组用于返回后果
    for (let i = 0; i < arr.length; i++) {if(map .has(arr[i])) {  // 如果有该 key 值
            map .set(arr[i], true); 
        } else {map .set(arr[i], false);   // 如果没有该 key 值
            array .push(arr[i]);
        }
    } 
    return array ;
}
let array=[1,2,3,1,2,'true','true',false,false,undefined,undefined,null,null,NaN,NaN,{},{}];
console.log(arrayNonRepeatfy(array));// 1,2,3,'true',false,undefined,null,NaN,{},{}

创立一个空 Map 数据结构，遍历须要去重的数组，把数组的每一个元素作为 key 存到 Map 中。因为 Map 中不会呈现雷同的 key 值，所以最终失去的就是去重后的后果。

毛病：{}没有实现去重

function unique(arr){return arr.reduce((prev,cur) => prev.includes(cur) ? prev : [...prev,cur],[]);
}
let array=[1,2,3,1,2,'true','true',false,false,undefined,undefined,null,null,NaN,NaN,{},{}];
console.log(unique(array));// 1,2,3,'true',false,undefined,null,NaN,{},{}

毛病：{}没有实现去重

let array=[1,2,3,4,5,1,2,3,4];
let newArray=[...new Set(array)];
console.log(newArray);  //   1,2,3,4,5

通过对本篇博客学习，置信大家对数组有更近一步的意识，如果感觉本篇博客对您有帮忙的话，记得给作者三连，点赞👍👍👍，关注，珍藏，您的反对就是我写作路上最大的能源，咱们下篇文章见。

参考资料

https://developer.mozilla.org…

https://segmentfault.com/a/11…

https://es6.ruanyifeng.com/#d…

JavaScript 高级程序设计（第 3 版）

正文完

前端

发表至：前端

2021-06-15

0

关于前端:3D可视化18个WebGL框架和Web3D图形库

关于前端:输入-url-到页面展示发生了什么

关于前端:多用户商城系统OctShop架构设计之小程序＋公众号＋H5版＋App四合一

关于前端:Elementui-Form-表单

关于前端:VuejsElementUIvant生成动态表单配置

关于前端:JavaScript数组详解全网最全

定义数组的形式

数组的增删改查

数组的新增

数组的批改

数组的删除

数组的查问

检测数组的办法和数组的 length 属性

ES5 数组罕用的办法

转换方法

栈办法（遵循后进先出的准则）

队列办法（遵循先进先出的准则）

重排序办法

操作方法

地位办法

迭代办法

归并办法

ES6 数组新增的办法

Array.from()

Array.of()

Array.copyWithin(target,start=0,end=this.length)

Array.fill()

Array.find()和 Array.findIndex()

Array.includes()

Array.flat()和 Array.flatMap()

数组排序的办法

数组的简略排序

对象数组排序

自定义排序办法

手写数组去重的 12 种办法

1、应用 ES6 中的 Set 实现去重（ES6 中最罕用）

2、应用双重 for 循环和 splice 实现去重（ES5）

3、应用 indexOf 实现去重

4、应用 sort()实现去重

5、应用对象的属性不能雷同的特点实现去重

6、应用 includes 实现去重

7、应用 hasOwnProperty 实现去重

8、应用 filter 实现去重

9、应用递归实现去重

10、应用 Map 数据结构实现去重

11、应用 reduce+includes 实现去重

12、应用 […new Set(arr)] 实现去重

结尾

Just My Socks（注册教程 内含优惠码）

Just My Socks（注册教程内含优惠码）