数组

常⽤的数组操作⽅法有哪些?

Array.shift()

  • 删除并返回第⼀个元素作⽤:从数组中删除第⼀个元素(即下标为0的元素),并返回该元素。 注意:1)删除元素之后,数组的⻓度-1。

Array.pop()

  • 删除并返回最后⼀个元素 作⽤:从数组中删除最后⼀个元素(即下标为length-1的元素),并返回该元素。 注意:1)删除元素之后,数组的⻓度-1。

Array.push(param1[,param2,…paramN])

  • 尾部添加元素 作⽤:在数组的尾部添加⼀个元素,并返回新数组的⻓度。 注意:1)它是直接修改该数组,⽽不是重新创建⼀个数组。

Array.unshift(newElement1[,newElement2,…newElementN])

  • 头部添加元素 作⽤:在数组的头部添加⼀个或多个元素,并返回新数组的⻓度。 注意:1)它是直接修改该数组,⽽不是重新创建⼀个数组

Array.join([separator])

  • 转换成字符串 作⽤:把数组的所有元素放⼊到⼀个字符串中。 注意:1)参数separator表示字符串中元素的分隔符,可以为空,默认为半⻆逗号。

Array.reverse()

  • 反转数组 作⽤:把数组的所有元素顺序反转。 注意:1)该⽅法会直接修改数组,⽽不会创建新的

    数组

数组如何进⾏降维(扁平化)

  • 利⽤Array.some⽅法判断数组中是否还存在数组,es6展开运算符连接数组

  • let arr = [1,2,[3,4]]
    while (arr.some(item => Array.isArray(item))) {
    arr = [].concat(...arr);
    }
    
    1
    2
    3
    4
    5
    6
    7

    + 使⽤数组的concat⽅法

    + ```
    let arr = [1,2,[3,4]]
    let result = []
    result = Array.prototype.concat.apply([], arr)
  • es6中的flat函数也可以实现数组的扁平化

  • let arr = [1,2,['a','b',['中','⽂',[1,2,3,[11,21,31]]]],3];
    let result = arr.flat( Infinity )
    
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38





    ## 数组去重,能⽤⼏种⽅法实现?

    + 利⽤ES6 Set去重(ES6中最常⽤)

    + ```
    function unique (arr) {
    return Array.from(new Set(arr))
    }
    var arr = [1,1,'true','true',true,true,15,15,false,false, undefined,undefined,
    null,null, NaN, NaN,'NaN', 0, 0, 'a', 'a',{},{}];
    console.log(unique(arr))
    //[1, "true", true, 15, false, undefined, null, NaN, "NaN", 0, "a", {}, {}]
    ```

    + 利⽤for嵌套for,然后splice去重(ES5中最常⽤)

    + ````
    function unique(arr){
    for(var i=0; i<arr.length; i++){
    for(var j=i+1; j<arr.length; j++){
    if(arr[i]==arr[j]){ //第⼀个等同于第⼆个,splice⽅法删除第⼆个
    arr.splice(j,1);
    j--;
    }
    }
    }
    return arr;
    }
    var arr = [1,1,'true','true',true,true,15,15,false,false, undefined,undefined,
    null,null, NaN, NaN,'NaN', 0, 0, 'a', 'a',{},{}];
    console.log(unique(arr))
    //[1, "true", 15, false, undefined, NaN, NaN, "NaN", "a", {…}, {…}] //NaN和{}没
    有去重,两个null直接消失了
  • 利⽤indexOf去重

  • function unique(arr) {
    if (!Array.isArray(arr)) {
    console.log('type error!')
    return
     }
    var array = [];
    for (var i = 0; i < arr.length; i++) {
    if (array .indexOf(arr[i]) === -1) {
    array .push(arr[i])
     }
     }
    return array;
    }
    var arr = [1,1,'true','true',true,true,15,15,false,false, undefined,undefined,
    null,null, NaN, NaN,'NaN', 0, 0, 'a', 'a',{},{}];
    console.log(unique(arr))
    
    // [1, "true", true, 15, false, undefined, null, NaN, NaN, "NaN", 0, "a", {…},
    {…}] //NaN、{}没有去重
    
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23

    + 利⽤sort去重

    + ````
    function unique(arr) {
    if (!Array.isArray(arr)) {
    console.log('type error!')
    return;
    }
    arr = arr.sort()
    var arrry= [arr[0]];
    for (var i = 1; i < arr.length; i++) {
    if (arr[i] !== arr[i-1]) {
    arrry.push(arr[i]);
    }
    }
    return arrry;
    }
    var arr = [1,1,'true','true',true,true,15,15,false,false, undefined,undefined,
    null,null, NaN, NaN,'NaN', 0, 0, 'a', 'a',{},{}];
    console.log(unique(arr))
    // [0, 1, 15, "NaN", NaN, NaN, {…}, {…}, "a", false, null, true, "true",
    undefined] // NaN、{}没有去重
  • 利⽤includes

  • function unique(arr) {
    if (!Array.isArray(arr)) {
    console.log('type error!')
    return
     }
    var array =[];
    for(var i = 0; i < arr.length; i++) {
    if( !array.includes( arr[i]) ) {//includes 检测数组是否有某个值
    array.push(arr[i]);
     }
     }
    return array
    }
    var arr = [1,1,'true','true',true,true,15,15,false,false, undefined,undefined,
    null,null, NaN, NaN,'NaN', 0, 0, 'a', 'a',{},{}];
    console.log(unique(arr))
    
    //[1, "true", true, 15, false, undefined, null, NaN, "NaN", 0, "a", {…}, {…}]
    // {} 没有去重
    
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14

    + 利⽤fifilter

    + ```
    function unique(arr) {
    return arr.filter(function(item, index, arr) {
    //当前元素,在原始数组中的第⼀个索引==当前索引值,否则返回当前元素
    return arr.indexOf(item, 0) === index;
    });
    }
    var arr = [1,1,'true','true',true,true,15,15,false,false, undefined,undefined,
    null,null, NaN, NaN,'NaN', 0, 0, 'a', 'a',{},{}];
    console.log(unique(arr))
    //[1, "true", true, 15, false, undefined, null, "NaN", 0, "a", {…}, {…}]
  • 利⽤递归去重

  • function unique(arr){
    return arr.reduce((prev,cur) => prev.includes(cur) ? prev : [...prev,cur],
    []);
    }
    var arr = [1,1,'true','true',true,true,15,15,false,false, undefined,undefined,
    null,null, NaN, NaN,'NaN', 0, 0, 'a', 'a',{},{}];
    console.log(unique(arr));
    // [1, "true", true, 15, false, undefined, null, NaN, "NaN", 0, "a", {…}, {…}]
    

数组中的forEach和map的区别?

forEach() 和 map() 两个⽅法都是ECMA5中Array引进的新⽅法,都是⽤来遍历数组中的每⼀项。

它们之间的区别:

  • map速度⽐forEach快
  • map会返回⼀个新数组,不对原数组产⽣影响,foreach不会产⽣新数组,forEach返回undefifined
  • map因为返回数组所以可以链式操作,forEach不能
  • map⾥可以⽤return(return的是什么,相当于把数组中的这⼀项变为什么(并不影响原来的数 组,只是相当于把原数组克隆⼀份,把克隆的这⼀份的数组中的对应项改变了) 。
  • forEach⾥⽤return不起作⽤,forEach不能⽤break,会直接报错。

for in和for of的区别?

在JavaScript中遍历数组通常是使⽤for…i循环,在ES5具有遍历数组功能的还有forEach、map、fifilter、

some、every、reduce、reduceRight等。for…in和for…of是两种增强型循环,for…in是ES5标准,在

ES6中新增了for…of的循环⽅式。

  • for…in :遍历以任意顺序迭代⼀个对象的除Symbol以外的可枚举属性,包括继承的可枚举属性
  • for…of:遍历在可迭代对象,包括 Array , Map , Set , String , TypedArray ,arguments 对象等等
  • 它们的区别 :
    • for…in可以遍历对象和数组,for…of不能遍历对象
    • for…in 循环不仅遍历对象的键名,还会遍历⼿动添加的其它键,甚⾄包括原型链上的键
    • for…in遍历的索引为字符串类型
    • for..of适⽤遍历数/数组对象/字符串/map/set等拥有迭代器对象的集合,但是不能遍历对象
    • for…of与forEach()不同的是,它可以正确响应break、continue和return语句具有迭代器对象才可以使⽤for…of