面试笔试题_前端_js简答_专项练习(1)

天津丁未春风科技有限公司试卷部分1、Generator了解2、手写Promise实现3、Promise优缺点4、观察者模式5、手写实现bind6、手写实现4种继承7、css菊花图8、http状态码9、async和await：10、算法和数据结构：11、封装JSONP12、手动实现map(forEach以及filter也类似)13、js实现checkbox全选以及反选14、对原型链的理解？prototype上都有哪些属性15、为什么使用继承16、setTimeout时间延迟为何不准17、事件循环述，宏任务和微任务有什么区别？18、letconstvar作用域19、节流和防抖20、实现一个sleep函数丁未春风，伴你成功！更多 资料 新概念英语资料下载李居明饿命改运学pdf成本会计期末资料社会工作导论资料工程结算所需资料清单 关注公众号天津丁未春风科技有限公司答案部分1、Generator了解ES6提供的一种异步编程解决 方案 气瓶 现场处置方案 .pdf气瓶 现场处置方案 .doc见习基地管理方案.doc关于群访事件的化解方案建筑工地扬尘治理专项方案下载 ,Generator函数是一个状态机，封装了多个内部状态。function*helloWorldGenerator(){yield'hello';yield'world';return'ending';}varhw=helloWorldGenerator();调用后返回指向内部状态的指针,调用next()才会移向下一个状态,参数:hw.next()丁未春风，伴你成功！更多资料关注公众号天津丁未春风科技有限公司//{value:'hello',done:false}hw.next()//{value:'world',done:false}hw.next()//{value:'ending',done:true}hw.next()//{value:undefined,done:true}2、手写Promise实现varmyPromise=newPromise((resolve,reject)=>{//需要执行的代码...if(/*异步执行成功*/){resolve(value)}elseif(/*异步执行失败*/){reject(error)}})myPromise.then((value)=>{//成功后调用,使用value值},(error)=>{//失败后调用,获取错误信息error})3、Promise优缺点优点:解决回调地狱,对异步任务写法更 标准 excel标准偏差excel标准偏差函数exl标准差函数国标检验抽样标准表免费下载红头文件格式标准下载 化与简洁化缺点:首先，无法取消Promise，一旦新建它就会立即执行，无法中途取消;其次，如果不设置回调函数，Promise内部抛出的错误，不会反应到外部;第三，当处于pending状态时，无法得知目前进展到哪一个阶段（刚刚开始还是即将完成).极简版promise封装:functionpromise(){this.msg=''//存放value和errorthis.status='pending'varthat=thisvarprocess=arguments[0]process(function(){that.status='fulfilled'that.msg=arguments[0]丁未春风，伴你成功！更多资料关注公众号天津丁未春风科技有限公司},function(){that.status='rejected'that.msg=arguments[0]})returnthis}promise.prototype.then=function(){if(this.status==='fulfilled'){arguments[0](this.msg)}elseif(this.status==='rejected'&&arguments[1]){arguments[1](this.msg)}}4、观察者模式又称发布-订阅模式,举例子说明.实现:发布者管理订阅者队列,并有新消息推送功能.订阅者仅关注更新就行5、手写实现bindFunction.prototype.bind=function(){//保存原函数varself=this//取出第一个参数作为上下文,相当于[].shift.call(arguments)varcontext=Array.prototype.shift.call(arguments)//取剩余的参数作为arg;因为arguments是伪数组,所以要转化为数组才能使用数组 方法 快递客服问题件处理详细方法山木方法pdf计算方法pdf华与华方法下载八字理论方法下载 vararg=Array.prototype.slice.call(arguments)//返回一个新函数returnfunction(){//绑定上下文并传参self.apply(context,Array.prototype.concat.call(arg,Array.prototype.slice.call(arguments)))}}6、手写实现4种继承functionFather(){}functionChild(){}丁未春风，伴你成功！更多资料关注公众号天津丁未春风科技有限公司//1\.原型继承Child.prototype=newFather()//2\.构造继承functionChild(name){Father.call(this,name)}//3\.组合继承functionChild(name){Father.call(this,name)}Child.prototype=newFather()//4\.寄生继承functioncloneObj(o){varclone=object.create(o)clone.sayName=...returnclone}//5\.寄生组合继承//6\.ES6classextend继承7、css菊花图四个小圆点一直旋转//父标签animation:antRotate1.2sinfinitelinear;//子标签animation:antSpin1sinfinitelinear;@keyframeantSpin{to{opacity:1}}@keyframeantRotate{to{transform:rotate(405)}}//animation-delay:逐个延迟0.4s丁未春风，伴你成功！更多资料关注公众号天津丁未春风科技有限公司8、http状态码1**:服务器收到请求,需请求者进一步操作2**:请求成功3**:重定向,资源被转移到其他URL了4**:客户端错误,请求语法错误或没有找到相应资源5**:服务端错误,servererror304:NotModified.指定日期后未修改,不返回资源9、async和await：Generator函数的语法糖，将*改成async，将yield换成await。是对Generator函数的改进,返回promise。异步写法同步化，遇到await先返回，执行完异步再执行接下来的.内置执行器,无需next()10、算法和数据结构：算法：解决具体问 题 快递公司问题件快递公司问题件货款处理关于圆的周长面积重点题型关于解方程组的题及答案关于南海问题 所需要的解决方法。执行效率最快的最优算法。时间复杂度。输入，输出，有穷性，确定性，可行性。冒泡排序，二叉树遍历，最长回文，二分查找，指针，链表等，堆栈，队列等。力扣，codewar，算法导论。数据结构：逻辑结构：集合、线性、树形、图形结构物理结构：顺序、链式存储结构11、封装JSONPfunctionjsonp({url,param,callback}){returnnewPromise((resolve,reject)=>{varscript=document.createElement('script')window.callback=function(data){resolve(data)document.body.removeChild('script')}varparam={...param,callback}vararr=[]for(letkeyinparam){arr.push(`${key}=${param[key]}`)}丁未春风，伴你成功！更多资料关注公众号天津丁未春风科技有限公司script.src=`${url}?${arr.join('&')}`document.body.appendChild(script)})}12、手动实现map(forEach以及filter也类似)//for循环实现Array.prototype.myMap=function(){vararr=thisvar[fn,thisValue]=Array.prototype.slice.call(arguments)varresult=[]for(vari=0;iv+1))//forEach实现(reduce类似)Array.prototype.myMap=function(fn,thisValue){varresult=[]this.forEach((v,i,arr)=>{result.push(fn.call(thisValue,v,i,arr))})returnresult}vararr0=[1,2,3]console.log(arr0.myMap(v=>v+1))13、js实现checkbox全选以及反选反选全选12314、对原型链的理解？prototype上都有哪些属性在js里，继承机制是原型继承。继承的起点是对象的原型（Objectprototype）。一切皆为对象，只要是对象，就会有proto属性，该属性存储了指向其构造的指针。Objectprototype也是对象，其proto指向null。对象分为两种：函数对象和普通对象，只有函数对象拥有『原型』对象（prototype）。prototype的本质是普通对象。Functionprototype比较特殊，是没有prototype的函数对象。new操作得到的对象是普通对象。当调取一个对象的属性时，会先在本身查找，若无，就根据proto找到构造原型，若无，继续往上找。最后会到达顶层Objectprototype，它的proto指向null，均无结果则返回undefined，结束。由proto串起的路径就是『原型链』。通过prototype可以给所有子类共享属性丁未春风，伴你成功！更多资料关注公众号天津丁未春风科技有限公司15、为什么使用继承通常在一般的项目里不需要,因为应用简单,但你要用纯js做一些复杂的工具或框架系统就要用到了,比如webgis、或者js框架如jquery、ext什么的,不然一个几千行代码的框架不用继承得写几万行,甚至还无法维护。16、setTimeout时间延迟为何不准单线程,先执行同步主线程,再执行异步任务队列17、事件循环述，宏任务和微任务有什么区别？先主线程后异步任务队列先微任务再宏任务18、letconstvar作用域块级作用域,暂时性死区19、节流和防抖函数节流是指一定时间内js方法只跑一次。比如人的眨眼睛，就是一定时间内眨一次。这是函数节流最形象的解释。//函数节流滚动条滚动varcanRun=true;document.getElementById("throttle").onscroll=function(){if(!canRun){//判断是否已空闲，如果在执行中，则直接returnreturn;}canRun=false;setTimeout(function(){console.log("函数节流");canRun=true;},300);丁未春风，伴你成功！更多资料关注公众号天津丁未春风科技有限公司};函数防抖是指频繁触发的情况下，只有足够的空闲时间，才执行代码一次。比如生活中的坐公交，就是一定时间内，如果有人陆续刷卡上车，司机就不会开车。只有别人没刷卡了，司机才开车。//函数防抖vartimer=false;document.getElementById("debounce").onscroll=function(){clearTimeout(timer);//清除未执行的代码，重置回初始化状态timer=setTimeout(function(){console.log("函数防抖");},300);};20、实现一个sleep函数//这种实现方式是利用一个伪死循环阻塞主线程。因为JS是单线程的。所以通过这种方式可以实现真正意义上的sleep()。functionsleep(delay){varstart=(newDate()).getTime();while((newDate()).getTime()-start