数组操作

数组去重

const arr = [1,2,3,4,1,2,NaN,null,undefined,Nan,null,undefined,'a','a'];
#方法:  使用indexOf includes filter  set等
1. const s = [...new Set(arr)];
2. const s = arr.filter((v,i,self) => !self.inCludes(v,i+1));
3. const s = arr.filter((v,i,self) => self.indexOf(v) === i); (不能正确的识别NaN)

数组扁平化

const arr = [1,2,3,['a','b',['c']],[4]];
arr.flat(Infinity) 参数是深度 返回一个新的数组
//使用tostring
arr.toString().split(',')
// 使用递归
function depth(arr) {
    return arr.reduce((init,v)=> {
        return init.concat(Array.isArray(v)?depth(v):v);
    }, [])
}

原生实现new

function _new() {
    const arg = [...arguments];
    const func = arg.splice(0,1)[0];
    cosnt resObj = Object.create(func.prototype);
    func.call(resObj, ...arg);
    return resObj;
}

tcp

juejin.cn/post/684490…

拖放 drag drop

**拖放元素 具备的方法**
ondragstart 开始拖放
ondrag  拖放过程中
ondragend  拖放结束

**目标目标元素**
ondragenter 拖放元素进入容器时
ondragover  拖拽时,拖放元素在容器内持续触发,
需要e.prevetdefault才可以触发drop (默认不允许一个元素拖放到其他元素内)
ondragleave 拖放元素离开容器时
ondrop 拖放元素在容器内,松开鼠标结束拖放时

**传递数据 事件属性 dataTransfer**
e.dataTransfer.setData(type, data)
type: text html 也可以自定义 data 值,一般在dragstart中获取
e.dataTransfer.getDate(type)
读取值 只能在drop事件中获取值
e.dataTransfer.clearData()
e.dataTransfer.dropEffect = 'move'
只能在dragover事件调用, 设置拖拽元素被放下事件的样式
e.dataTransfer.effectAllowed = 'move'
只能在dragstart事件调用,设置拖拽时应带有的样式类型

offset client scroll

pageX/Y获取到的是触发点相对文档区域左上角距离，会随着页面滚动而改变

import require

例: let { stat, exists, readFile } = require('fs');
require 是运行是加载,只有运行时才能得得到对象,
上面代码实质是整体加载fs模块,生成一个对象,
然后再从对象中加载3个方法

例: import { stat, exists, readFile } from 'fs';
import 是编辑时加载或者也称静态加载, 即是es6在编译时就完成了模块加载,效率比commonjs模块的加载方式高