欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

撩课-Web大前端每天5道面试题-Day14

程序员文章站 2022-06-25 08:14:27
1. 请写出至少5个html5新增的标签,并说明其语义和应用场景? 2. get和post请求在缓存方面的区别? 3. 如何解决异步回调地狱? 4. 图片的懒加载和预加载? 5. bind,apply,call的区别? 6. js怎么控制一次加载一张图片,加载完后再加载下一张? ......

1. 请写出至少5个html5新增的标签,并说明其语义和应用场景?

section:定义文档中的一个章节;

nav:定义只包含导航链接的章节;
header:定义页面或章节的头部;
它经常包含 logo、页面标题和导航性的目录。

footer:定义页面或章节的尾部;
它经常包含版权信息、法律信息链接和反馈建议用的地址。

aside:定义和页面内容关联度较低的内容,
如果被删除,剩下的内容仍然很合理。

 

2. get和post请求在缓存方面的区别?

get请求类似于查找的过程,用户获取数据,
可以不用每次都与数据库连接,所以可以使用缓存。

post不同,post做的一般是修改和删除的工作,
所以必须与数据库交互,所以不能使用缓存。

因此get请求适合于请求缓存。

 

3. 如何解决异步回调地狱?

promise、generator、async/await

 

4. 图片的懒加载和预加载?

预加载:提前加载图片,
当用户需要查看时可直接
从本地缓存中渲染。

懒加载:懒加载的主要目的
是作为服务器前端的优化,
减少请求数或延迟请求数。

两种技术的本质:
两者的行为是相反的,
一个是提前加载,
一个是迟缓甚至不加载。

懒加载对服务器前端有一定
的缓解压力作用,
预加载则会增加服务器前端压力。

 

5. bind,apply,call的区别?

通过apply和call改变函数的this指向,
这两个函数的第一个参数都是一样的,
表示要改变指向的那个对象,
第二个参数,apply是数组,
而call则是arg1,arg2...这种形式。

通过bind改变this作用域
会返回一个新的函数,
这个函数不会马上执行。

 

6. js怎么控制一次加载一张图片,加载完后再加载下一张?

方法一:
<script type="text/javascript">
var obj=new image();
obj.src="http://www.itlike.com/21.jpg";
obj.onload=function(){
    document.getelementbyid("pic")
    .innnerhtml="<img src='"+this.src+"' />";
}
</script>
<div id="pic">加载中……</div>


方法二:
<script type="text/javascript">
var obj=new image();
obj.src="http://www.itlike.com/21.jpg";
obj.onreadystatechange=function(){
   if(this.readystate=="complete"){
       document.getelementbyid("pic")
       .innnerhtml="<img src='"+this.src+"' />";
  }
} 
</script>
<div id="pic">加载中……</div>