2022年百度公司前端开发实习生面试题（应聘 求职 面试准备资料）.docx
2022年百度公司前端开发实习生面试题第1题：写出 javascript 运行结果：alert('5'+5);结果：第2题：写出 javascript 运行结果：for(var i=0; ilO; i+) alert(i);结果：10第3题：Cookie> sessionStorage> localstorage 的区分参考：共同点：都是保存在扫瞄器端，且同源的。tail:H+Boolean(this.tail);10 ；11 var cat=new Cat();12 cat.getlnfo();复制代码构造器：1 function Animal(leg,tail)2 this.leg=leg;3 this.tail=tail;4 )56 function Cat(name,leg,tail)7 Animal.call(this,leg,tail);8 this.name=name;9 this.getlnfo=function()10 return “Animal'sname:,+this.name+H,numberofleg:,+this.leg+H,has tail:M+Boolean(this.tail);11);12 )1314 var cat=new Catfeat1,4,true);-io 15 cat.getlnfo();复制代码一 11区分：cookie数据始终在同源的 恳求中携带(即使不需要)， 即cookie在扫瞄器和服务器间来回传递。而sessionstorage和 localstorage不会自动把数据发给服务器，仅在本地保存。cookie数据 还有路径(path)的概念，可以限制cookie只属于某个路径下。存储 大小限制也不同，cookie数据不能超过4k,同时由于每次 恳求 都会携带cookie,所以cookie只适合保存很小的数据，如会话标识。 sessionstorage localstorage虽然也有存储大小的限制，但比cookie 大得多，可以到达5M或更大。数据有效期不同，sessionstorage：仅 在当前扫瞄器窗口关闭前有效，自然也就不行能长久保持； localstorage：始终有效，窗口或扫瞄器关闭也始终保存，因此用作长 久数据；cookie只在设置的cookie过期时间之前始终有效，即使窗口 或扫瞄器关闭。作用域不同，sessionStorage不在不同的扫瞄器窗口 中共享，即使是同一个页面；localstorage在全部同源窗口中都是共 享的；cookie也是在全部同源窗口中都是共享的。Web Storage支持 大事通知机制，可以将数据更新的通知发送给监听者。Web Storage 的api接口使用更便利。第4题：javascript中call。方法和apply。方法的区分。参考：call。和apply。方法作用相同，动态转变运行上下文，跨作用 域调用函数或方法。区分：唯一区分在于两个方法的其次个参数，call。方法的其次个参 数是依次给将要调用的函数或方法传递参数；而叩ply()方法的其次个 参数是数组或类数组(arguments)。例 子： foo.call(this, paral/para2,para3)等 价 于foo.apply(this,paral,para2/para3)第5题：什么是"use strict”?使用它的好处和坏处是什么？参考：use strict(严格模式)是在ECMAScript5中提出来的，是 为javascript定义了一种不同的解析与执行模型。在严格模式下， ECMAScript3中一些不确定的行为将得处处理，而且对某些担忧全操 作也会抛出错误。(参考javascript高级程序设计)严格模式分为全 局严格模式和局部严格模式。好处：(1)、消退Javascript语法的一些不合理、不严谨之处，削减-3-一些怪异行为；（2）、消退代码运行的一些担忧全之处，保证代码运行的平安；（3）、提高编译器效率，增加运行速度；（4）、为将来新版本的Javascript做好铺垫。坏处：在一个全局环境下使用严格模式，会使得非严格模式下的代 码merge后可能消失问题。第6题：写一段简洁的正那么表达式，匹配并取出字符串 s:.baidu /s?cl=3中的域名局部（注：域名局部非固定）参考：1 var str=, s:/.baidu /s?cl=3M;23 var reg=/ s：W(A-Za-z.+)VS+/；45 var result=reg.exec(str);7 if(result)89 alert(resultl);1011)第7题：用原生javascript编写程序：创立一个ul无序列表元素添加到body 中，ul下包含5个li元素，每个li元素包含一个text类型元素，text 元素内容可自定义。参考：url=/url1 !DOCTYPE HTML PUBLIC H-/W3C/DTD HTML 4.01 Transitional/ENH " :/w3.org/TR/html4/loose.dtcr2 html3 head4 meta -equiv=,lContent-TypeM content=,text/html;charset=UTF-8,5 title2022百度实习笔试题7/title6 script7 window.onload=function()8 var ulNode=document.create日ement('ur);9 var bodyNode=document.get日ementsByTagName('body');10 bodyNode0.appendChild(ulNode);11 forfvar i=0; i5; i+)12 var liNode=document.create日ementCIi);13 var textNode=document.createTextNode('li,+i);14 liNode.appendChild(textNode);15 ulNode.appendChild(liNode);16 )17 )18 /script19 /head20 body2122/body23 /html第8题:-6-用HTML和css实现如下布局，只需写出排版结构及样式，不要求 把内容一起写上。参考：IDOCTYPE HTML PUBLIC H-/W3C/DTD HTML 4.01 Transitional/ENH, :/.w3.org/TR/html4/loose.dtd,1htmlheadmeta -equiv="Content-Type” content=,text/html;charset=UTF-8Mtitle2022百度实习笔试题8/titlestyleli list-style-type: none;.info float: left; margin: 0 20px 20px;/style/headbodydivullidiv style=Mmargin: 20px;Mb 精彩分类/b/div/lili-7 divimg src="OOOO.png" alt="捕食草"/div divpspan 捕食草/spannbsp;nbsp;nbsp;nbsp;span 所属分类：草本植物 /span/pp是一种食虫植物。/p/div/lili style="clear: both;"/lilidivimg src="OOOO.png" alt="虎鲸" /divdivpspan 虎鲸/spannbsp;nbsp;nbsp;nbsp;nbsp;span 所属分类： 海洋 /span/pp是一种大型齿鲸。/p/div/li/ul/div/body/html（ps：这一题确实写得很挫）8第9题：【附加题】假设有一个基础对象叫"动物，拥有以下属性：腿的数 量、是否有尾巴，有另外一个对象叫“猫，拥有“动物对象的属性, 并增加一个属性为：动物名称，再增加一个方法，返回动物名称+腿 的数量+是否有尾巴的描述，请使用javascript原型链继承来创立以上 2个对象。参考：原型链：1 function Animal()2 Animal.prototype.Ieg=4;3 Animal.prototype.tail=true;4 var animal=new Animalf);5 function Cat()6 Cat.prototype=animal;7 Cat.prototype.name=,cat,;8 Cat.prototype.getlnfo=function()9 return "Animal's name:H+this.name+n,number of leg:,+this.leg+,has9
