48个ES6常用代码段

javascript

如何防止别人在你的网页打开控制台?

setInterval(()=>debugger)

函数防抖

防抖动是将多次执行变为最后一次执行

  var timer
  function hiFrequency(){
      if(timer){
          clearTimeout(timer)
      }
        timer = setTimeout(function(){
             console.log('do something')
        }, 300)
  }
  hiFrequency()
  hiFrequency()
  hiFrequency()

函数节流

节流是将多次执行变成每隔一段时间执行。

//待补充

简单的递归

function sun(n){
	if(n===1){
		return 1
	}else{
		return n+sun(n-1)
	}
}
sun(5) // 1+2+3+4+5 ==> 15

逆转消息

'abc'.split('').reverse().join('')

函数柯里化

function fn(template){
	return function(data){
    	return template.replace(`{name}`,data.name)
	}
}
var t=fn('<div>hi, I am {name}</div>')
t({name:"weibo"}) //"<div>hi, I am weibo</div>"
t({name:"jack"})  //"<div>hi, I am jack</div>"

浅拷贝

  • Object.assign() 主要用于浅拷贝或是合并对象
  • JSON.parse()和JSON.stringify() 只能够解析json表示的数据结构,因此函数这种不能被json表示的类型将不能被正确处理。

数组去重复

Array.from(new Set([1,2,2]))

事件代理

ul>li*8>{A$}

var ul=document.querySelector('ul')
ul.onclick=(e)=>{
  if(e.target.tagName=='LI'){
    console.log(e.target.innerText)
  }
}

当前元素的index

var index = [].indexOf.call(e.target.parentNode.children, e.target);

将NodeList转数组

1. const nodelistToArray = Array.prototype.slice.call(nodelist);
2. const nodelistToArray = [...nodelist]
3. const nodelistToArray = Array.from(nodelist)

严格相等(NaN,+0,-0)

1. Object.is(NaN,NaN) //true
2. Object.is(+0,-0)	//false

生存min~max整数的随机数

Math.floor(Math.random()*(max-min+1)+min);

实时监控dom

const myObserver = new ResizeObserver(entries => {
    console.log(entries)
});
const someEl = this.$el.querySelector(".box");
myObserver.observe(someEl);