前端都应该阅读这些文章

一个合格(优秀)的前端都应该阅读这些文章:https://juejin.im/post/5d387f696fb9a07eeb13ea60
腾讯前端面试篇(一)
https://juejin.im/post/5c19c1b6e51d451d1e06c163
前端2018年精选好文,请打包带走:https://juejin.im/entry/5c45daa8e51d45527201b4a5
你未必知道的CSS知识点(第二季):https://juejin.im/post/5d9ec8b0518825651b1dffa3?utm_source=gold_browser_extension#heading-32

1、大数相加

**1**
	function add(a,b){
		var res=''
		var c=0
		a=a.split('')
		b=b.split('')
		
		while(a.length||b.length||c){
			c+=~~a.pop()+~~b.pop()//~ 是JavaScript中的操作符,按位非,~~ 经常用来进行取整和类型转换
			res=c%10+res
			c=c>9//在保存进位值的时候,用的并不是 1 和 0 ,而是true 和 false,这是因为隐式类型转换的时候,true会转为1,false会转为0。 
		}
		return res
	}
console.log(add('111113333333333111111111111','22222222222222222'))	

2、input输入框实现autocomplete效果

**1、html**
   <div>
    <input type="text" id = "autocom" placeholder = "autocomplete输入框">
    <ul id = "match"></ul>
</div>
***2、js***
	var arr = ['a','apple','abandon','bilibili','beep','before','become','being','highmaintains','by','bye','banana']
	document.getElementById('autocom').addEventListener('input',function(event){
		var val=event.target.value
		if(val){
			autofun(val,arr)		
		}else{
			document.getElementById('match').innerHTML=''
		}
	})
	function autofun(val,arr){
		var list=[]
		arr.forEach((item)=>{
			if(item.startsWith(val,0)){
				list.push('
  • '+item+'
  • '
    ) } document.getElementById('match').innerHTML=list.join('') }) } document.getElementById('match').addEventListener('click',function(event){ var target=event.target if(target.tagName.toLowerCase()==='li'){ document.getElementById('autocom').value=target.innerText document.getElementById('match').innerHTML='' } })

    你可能感兴趣的:(js)