每日一题 12.19

按照计划，每天更新五道自己不会（或者不能一下子回答的）的每日一题

父容器高度塌陷的解决方案

1. 开启BFC -> overflow:hidden
2. 伪类

div::after{
    content:'',
    display:block,
    clear:both
}

3. 加一个div

数组去重的方式

1、使用set

Array.from(new Set(array))

2、使用 filter()

array.filter((item, index) => array.indexOf(item) === index)

3、使用 reduce()

array.reduce((pre, current) => pre.includes(current) ? pre : [...pre,current], [])

深拷贝和浅拷贝的方式

• 深拷贝

1. JSON.stringfy

JSON.parse(JSON.stringify(data))

优点：好用，简单
缺点：undefined,正则,function等会丢失

2. 递归

const deepClone = (obj) => {
    const cloneObj = Array.isArray(obj) ? [] : {}
    if (obj && typeof obj === 'object') {
        for (const key in obj) {
            if (obj[key] && typeof obj[key] === "object") {
                cloneObj[key] = deepClone(obj[key])
            } else {
                cloneObj[key] = obj[key]
            }
        }
    }
    return obj
}

• 浅拷贝

1. 赋值 =
2. Object.assign

数组扁平化有几种方法

1. flat 但是多维做不到 -> 做的到，传个参数，比如预计最高是3层，那就传个3

const flatten = (arr)=>{
    while (arr.some(item=>Array.isArray(item))){
        arr = arr.flat()
    }
    return arr
}

2. 迭代 [].concat + ...arr

const flattenIterate = (arr) => {
    while (arr.some(item => Array.isArray(item))) {
        arr = [].concat(...arr)
    }
    return arr
}

3. 递归（两种）

• 普通

const flattenNormalRecursion = (arr) => {
    let newArr = []
    arr.forEach(item => {
        if (Array.isArray(item)) {
            newArr = [...newArr, ...flattenNormalRecursion(item)]
        } else {
            newArr.push(item)
        }
    })
    return newArr
}

• reduce + ...

const flattenReduceRecursion = (arr) => {
    return arr.reduce((pre, current) => (Array.isArray(current) ?
        [...pre, ...flattenReduceRecursion(current)] : [...pre, current]), [])
}

4. string + split

const flattenStringSplit = (arr)=>{
    return  arr.toString().split(',').map(item=>Number(item))
}

如何同时发多个请求

Promise.all,Promise.race细说