1.[].slice.call(NodeList) 2.Array.prototype.slice.call(NodeList) 3.Array.from(NodeList) 4.解构赋值[...NodeList] 5.for循环push

会改变原来数组的有： pop()---删除数组的最后一个元素并返回删除的元素。 push()---向数组的末尾添加一个或更多元素，并返回新的长度。 shift()---删除并返回数组的第一个元素。 unshift()---向数组的开头添加一个或更多元素，并返回新的长度。 reverse()---反转数组的元素顺序。 sort()---对数组的元素进行排序。 splice()---用于插入、删除或替换数组的元素。 不会改变原来数组的有： concat()---连接两个或更多的数组，并返回结果。 every()---检测数组元素的每个元素是否都符合条件。 some()---...

// 😂表情 const regStr = /[\uD83C|\uD83D|\uD83E][\uDC00-\uDFFF][\u200D|\uFE0F]|[\uD83C|\uD83D|\uD83E][\uDC00-\uDFFF]|[0-9|*|#]\uFE0F\u20E3|[0-9|#]\u20E3|[\u203C-\u3299]\uFE0F\u200D|[\u203C-\u3299]\uFE0F|[\u2122-\u2B55]|\u303D|[\A9|\AE]\u3030|\uA9|\uAE|\u3030/; if (regStr.test(resultInfo.result...

1.在地址栏输入URL (1).浏览器进行DNS查找,把域名转换成真实的IP地址 (2).根据IP地址,找到提供网站内容的服务器 2.找到服务器后 (3).浏览器通过TCP握手机制跟服务器建立连接 [现在大多数服务器都是用的https协议那么会多一步TLS握手,建立加密的隧道,通过对称加密+非对称加密的混合加密机制保证数据传输的安全性] 3.在与服务器建立起连接后 (4).浏览器发送Http(s)请求,来获取服务器响应的HTML文件 [这里在接收服务器响应的时候,这里有一个slow start机制,受制于TCP连接的限制,浏览器会先收到前14kb的数据,后续才会加速传输速度,下载其他文件] 4...

1.用useRef获取到form表单 2.使用form的方法,validateFields触发校验 const forms = useRef(null) const [form] = Form.useForm() // async 和 await 写法 const onFinish = async () =>{ const passed = forms.current.validateFields() //触发表单校验 if(passed){ ..... } } // 普通写法 const onFinish = () =>{ forms.curre...

条件统计 // pre是数组的第一项 // next是下一项 // 但是传入了初始值,初始值可以看作数组的第一项,从而达到next成为了ary[0] const ary = [1,2,3,4,5] const result = ary.reduce((pre,next)=>{ next > 2 ? pre++ : null return pre },0) //<-pre初始值传入 console.log(result) //3 去重配合new Map const ary = [1,2,2,3,4,5,6,6] const newAry = [] ary.redu...

平常我们封装组件后使用都是自闭合的形式,全靠数据+v-for+show+if来进行内部渲染 现在封装一个组件,并让他具有接收父组件传入DOM的功能进行渲染 1.简单的使用 // 封装组件:Packagin.vue <div> <span>封装的组件</span> <slot/> </div> // 父组件使用它 <div> <Packagin> <input/> //传入的DOM </Packagin> </div> 2.让插槽在没有DOM显示的时候有默认值 ...

let nums = ["1", "2", "3", "4", "5", "6", "7", "8", "9", "0", 'A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K', 'L', 'M', 'N', 'O', 'P', 'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X', 'Y', 'Z', 'a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j', 'k', 'l', 'm', 'n', 'o', 'p', 'q', 'r', 's', 't', ...

useRouter一定要放在setUp顶部执行,不然作用域变动,返回值将会变成undefined,届时无法调用push API 解释 router.push({}) 以默认的栈方式,进行路由跳转 router.replace({}) 以replace(覆盖上一条记录),进行路由跳转 router.back() 回退 router.forward() 前进 router.go(number) 正数前进number次,负数就回退number次 使用方法1: setUp(){ const router = useRouter() //提前创建好实例 co...

1.document.execCommand('Copy') 旧(不推荐) API有可能会被废弃 const node = document.createElement('input'); //创建节点 node.value = '旧方法的复制'; //设置节点的值 document.body.appendChild(node); //添加到DOM树中 node.select(); // 选中 document.execCommand('Copy'); // documen...

1.html 加载时发生了什么 在页面加载时，浏览器把获取到的HTML代码解析成1个DOM树 DOM树里包含了所有HTML标签 浏览器把所有样式(用户定义的CSS和用户代理)解析成CSS结构体 DOM Tree 和 CSS结构体组合后构建render tree 什么是回流 当render tree中的一部分(或全部)因为元素的规模尺寸，布局，隐藏等改变而需要重新构建。 这就称为回流(reflow)。 每个页面至少需要一次回流，就是在页面第一次加载的时候，这时候是一定会发生回流的，因为要构建render tree。 在回流的时候，浏览器会使渲染树中受到影响的部分失效，并重新构造这部分渲染树 比如...

如果在react中想异步访问事件属性（如在setTimeout内） 应该在是处理事件时调用event.persist() 这会从事件池中移除该合成函数并允许对该合成事件的引用被保留下来。 注意:面对异步时,普通值(可继承下来)和节点属性(续特殊处理才能继承下来) 注意:ES6的箭头函数是没有this和arguments的,如果想快捷使用arguments需要使用function式 例如: //节流函数 const throttle = (fun, delay) => { let valid = true return function () { ...

?.其实和.是差不多的用法 但是.的话,对于调用时,如果主体是undefined之类的,会产生报错 let obj = { name:'123' } console.log(obj.age.name) 报错,因为age是undefined,无法在undefined上读取属性name console.log(obj?.age?.name) undefined这个就很稳健,避免报错 //开发中的实际例子 if(obj.age && obj.age.name){ //之所以做这样...

一.for...in for(let index in Object){ //输出的是键名index } 二.for...of for(let item of Array){ //输出的是键值item } 三.v-for='item in Object' <div v-for="(item, name, index) in object" :key='item.id'> //item,键名,索引 </div>