js学习笔记（五）

一、数组的扁平化处理

  数组的扁平化即将一个多维数组变为一个一维数组。其方法如下：

1.使用flat()

arr.flat(Infinity)

2.利用正则表达式

  弊端：会把所有类型都变成字符串

JSON.stringify(arr).replace(/\[|\]/g,"").split(",")

3.正则改良版

JSON.parse("["+JSON.stringify(arr).replace(/\[|\]/g,"")+"]")

4.使用reduce

const newArr = (arr) => {
    return arr.reduce((pre, cur) => {
        return pre.concat(Array.isArray(cur)?newArr(cur):cur);
    }, [])
}

5.函数递归

const arrs = function(arr){
    let result = [];
    for(let i = 0 , len = arr.length ; i < len ; i++){
        if(Array.isArray(arr[i])){
            result = result.concat(arrs(arr[i]));
        } else{
            result.push(arr[i]);
        }
    }
    return result;
}

二、BFC

  BFC即块级格式化上下文，只有块级盒子可以参与，用一套特殊的规则约束，与外部规则无关。

1.BFC的作用

• 取消盒子的margin塌陷
• 阻止元素被浮动元素覆盖

2.如何创建BFC

• float的值不为none
• position的值不为static或relative
• display的值是inline-block、flex或inline-flex
• overflow:hidden

三、call、apply、bind的区别与联系

• 联系：三者都可以改变this指向
• 区别：1. call、apply会立即执行，bind不会立即执行
     2.call和apply第一个参数都是改变上下文的对象，call的第二个参数必须一个个写，但apply传的是数组