面试必问之【数组】篇

所谓数组就是值的有序集合，js数组元素可以是任意类型，并且是动态的，根据需要它们会增长或缩减，js数组是js对象的特殊形式，数组索引碰巧是整数的属性名差不多

创建数组

1. 直接量的方式
2. new Array() //一个数值参数是指定长度 多个参数是显示的指定元素

var a = new Array();
var a = new Array(10);   //长度为10的数组
var a = new Array(10, 2, 'a', 'b'); // [10, 2, 'a', 'b']
复制代码

数组常见方法

1. 添加和删除

//shift unshift
//pop push
// splice() //俗称数组万能方法 插入，删除和替换
复制代码

2. 其他常用方法

//Array.join();  //String.split() 操作相反
//Array.reverse();   //改变了原数组 返回值也是翻转后的数组
//Array.sort();   //改变了原数组 返回值也是翻转后的数组
//Array.concat();   //不会改变原来的数组
//如果这些参数中的任何一个自身是数组，
//则连接的是数组的元素，而非数组本身。但要注意，concat()不会递归扁平化数组的数组。
var a = [1, 2, 3];
a.concat(4, [5, [6, 7]])   //返回[1, 2, 3, 4, 5, [6, 7]]

//Array.slice()   //参数为开始和结束的位置，返回一个数组，不会改变原来的数组
复制代码

3. es6中新增的数组方法

//forEach  //注意forEach中不能使用break
//map     //返回一个映射的新数组
//filter  //返回满足条件形成的新数组
//every和some //返回 true或者false
//reduce  //使用指定的函数将数组元素进行组合，生成单个值  两个参数 一个是化简函数一个是初始值 其中初始值就是化简函数第一次执行时的第二个参数y，如果没有初始值，那么将使用数组的第一个元素当初始值
let arr = [2, 4, 6, 9]
//数组求和
arr.reduce(function(x,y){   //化简函数的参数: 
//toal必选 初始值或者化简后的值, 
//currentValue必选 当前值, 
//currentIndex可选当前索引, 
//arr可选。当前元素所属的数组对象。
    return x*y
},1)
//数组求积

复制代码

判断是否是一个数组

1. Array.isArray()
2. [] instanceof Array()
3. toString()

var isArray = function(o){
    return typeof o === "object" && Object.prototype.toString.call(o) === "[object Array]"
}
复制代码

数组排序

1. 冒泡排序

function popSort(arr){
    for(var i = 0; i<arr.length-1; i++) {
        for(var j=0;j<arr.length-1-i;j++) {
            if(arr[j] > arr[j+1]) {
                let temp = arr[j];
                arr[j] = arr[j+1];
                arr[j+1] = temp;
            }
        }
        
    }
    return arr
}
复制代码

2. 选择排序

function secSort(arr){
    for(var i = 0; i<arr.length; i++) {
        let min = arr[i];
        let minIndex = i;
        for(var j=i; j<arr.length; j++) {
            if(min > arr[j]) {
                min = arr[j]
                minIndex = j
            }
        }
        let temp = min;
        arr[minIndex] = arr[i]
        arr[i] = temp;
        
        
    }
    return arr
}
复制代码

3. sort

var arr = [4,3,6,5,7,2,1];
arr.sort();
arr.sort(function(a,b){   //a-b升序
    return a-b;
});
console.log(arr);
复制代码

数组去重

1. ES6 提供了新的数据结构 Set

const s = new Set();

[2, 3, 5, 4, 5, 2, 2].forEach(x => s.add(x));

for (let i of s) {
  console.log(i);
}
// 2 3 5 4
复制代码

//去除数组的重复成员
let arr1 = [2,3,5,2,4,4,5]
console.log([...new Set(arr1)]);
//[ 2, 3, 5, 4 ]
复制代码

2. 利用对象的属性不能重复

let arr = [2,3,5,2,4,4,5]
let obj = {};
for(let i = 0;i<arr.length;i++) {
    obj[arr[i]] = 1;
}
console.log(Object.keys(obj))  //[ '2', '3', '4', '5' ]  变成了字符串
复制代码

3. 比较去重

let arr = [2,3,5,2,4,4,5]
for(let i = 0;i<arr.length;i++) {
    for(let j = i+1;j<arr.length;j++) {
        if(arr[i] === arr[j]) {
            arr.splice(j,1)
            i--
        }
    }
}
console.log(arr)
复制代码

通过上面的第2个解法引发了思考，如果数组里面有对象呢，解决办法就是在每一次遍历前都需要判断一下类型，如果是对象就单独push进另一个数组里，然后通过解构或者concat重新结合成新数组需要特别说明的是 set非常强大，向 Set 加入值的时候，不会发生类型转换，优先采用1和3， 2一般不用 用的话也需要特殊处理,补充 如果真想用的话，不用对obj了，特殊处理较为复杂，采用map吧

let arr = [2,3,5,2,4,4,5]
let map = new Map();
for(let i = 0;i<arr.length;i++) {
    map.set(arr[i],1)
}
console.log([...map.keys()]) //[ 2, 3, 5, 4 ]
复制代码

将类数组转为数组

1. Array.from()
2. [...arr]

补充 vue相关的

vue中以下不能检测到数据变化

1. this.arr[i] = 'xxx'
2. this.arr.length = 10 解决办法：
3. this.arr.splice()
4. this.$set(this.arr,index,val)

以上就是自己总结的一些有关数组常问的问题，部分给出了答案!当然有一些不足和不完善之处，欢迎各位指出！