手写小练习

节流防抖 ：当函数绑定一些持续性的事件时，resize，click，mousemove，键盘输入等等。如果每一次触发都要执行一次函数，这样资源请求太频繁。

防抖：就是指触发时间后n秒才执行函数，如果在n秒内再次执行函数，重新计算函数执行事件
节流：就是指连续触发时间在n秒中会执行一次

防抖函数：

function dobounce（fn,delay）{
let timer 
return function(...args){
if(timer){clearTimeout(timer)}
timer = setTimeout(() =>{
fn.apply(this,args)},delay)}
}

节流：

function   thirottle(fnm,delayu){let last = 0return function(...args){const new = date.now()if(now - last >delay){last = now fn.apply(this,args)}}
}

深拷贝：

const cloneObj = JSON.parse(JSON.stringify(obj)

sort 排序

const arr = 【3,2,5,1,4】
arr.sort((a,b) 
console.log(arr)

冒泡排序：

function bubbleSort(arr){let leng = arr.length for (let i =0;iarr[j+1]】{let num = arr[j]arr[j] = arr[j+1]arr[j+1] =num}}}return arr
}

数组去重set

const newarr = [...new Set(arr)]
或者
const newArr = Array.from(new Set(arr))

使用css绘制三角形

上三角：
div{width: 0px;height: 0px;border-top:20px solid red;border-bottom:20px solid rgb(0,0,0,0);border-left:20px solid rgb(0,0,0,0);border-right:20px solid rgb(0,0,0,0);}

下三角：

.box2{width: 0px;height: 0px;border: 20px solid transparent;/* border-top:20px solid transparent;border-bottom:20px solid rgb(0,0,0,0);border-left:20px solid rgb(0,0,0,0);border-right:20px solid rgb(0,0,0,0); */border-bottom: 20px solid red;}

让盒子居中

position: absolute;top: 50%;left: 50%;margin-left: -100px;margin-top: -100px;

先设置绝对定位，然后定位在页面的高50%和左边的50%。但是注意这时候，盒子自身有大小。所以就必须再移动盒子自身长度的一半，把盒子完全居中

indexOf 去重

const newArr= arr.filter(item,index) =>arr.indexOf(item) ===index

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！