起航学习网

今天小T要跟大家分享的文章是关于2021年Web前端开发面试题汇总。由于内容较多小T分开为大家介绍，今天首先来和小T一起看一看第一部分的内容，希望这些面试题能够对正准备找Web前端开发相关工作的小伙伴们有所帮助。

1. 说几条写JavaScript的基本规范?

1) 不要在同一行声明多个变量;

2) 请使用===/!==来比较true/false或者数值;

3) 使用对象字面量替代new Object这种形式;

4) 减少使用全局函数, 全局变量;

5) switch语句必须带有default分支;

6) if语句必须使用大括号;

7) for-in循环中的变量;

应该使用var关键字明确限定作用域;

从而避免作用域全局污染。

2. 说说平衡二叉树?

平衡二叉搜索树(Self-balancing binary search tree)

又被称为AVL树。

具有以下性质：

1)它是一棵空树或它的左右两个子树

的高度差的绝对值不超过1，

并且左右两个子树都是一棵平衡二叉树。

2)平衡二叉树必定是二叉搜索树，反之则不一定。

3)平衡二叉树的常用实现方法有红黑树、AVL、

替罪羊树、Treap、伸展树等。

最小二叉平衡树的节点的公式如下：

F(n)=F(n-1)+F(n-2)+1 备注：1是根节点，

F(n-1)是左子树的节点数量，

F(n-2)是右子树的节点数量。

3. 清除浮动和解决垂直外边距重叠的解决方案?

问题描述:

1) 父元素没有设置宽高，尺寸由子元素撑起;

子元素一旦浮动，父元素高度会发生塌陷。

2)子元素设置margin-top会作用的父元素的margin-top;

此时会造成垂直外边距重叠。

.clearfix::after,.clearfix::before{

content: ' ';

display: table;

clear: both;

}

4. sessionStorage 、localStorage 和 cookie ?

相同点:

都用于浏览器端存储的缓存数据;

不同点:

1) 存储内容是否发送到服务器端

当设置了Cookie后，数据会发送到服务器端，

造成一定的宽带浪费;xxxstorage则会将数据保存

到本地，不会造成宽带浪费;

2) 数据存储大小不同

Cookie数据不能超过4K，适用于会话标识;

xxxstorage数据存储可以达到5M;

3) 数据存储的有效期限不同

cookie只在设置了Cookid过期时间

之前一直有效，即使关闭窗口或者浏览器;

sessionStorage,仅在关闭浏览器之前有效;

localStorage,数据存储永久有效;

4) 作用域不同

cookie和localStorage是在同源同窗口中

都是共享的;

sessionStorage不在不同的浏览器窗口

中共享，即使是同一个页面;

5. 判断一个单词是否是回文?

回文是指把相同的词汇或句子，

在下文中调换位置或颠倒过来，

产生首尾回环的情景，

叫做回文，也叫回环。

比如 cacac，redivider 。

let checkPalindrom = (str)=>{

return str ===

str.split('').reverse().join('');

}

6. 不借助临时变量，进行两个整数的交换?

输入 a = 3, b =1,

输出 a = 1, b =3

let swap = (a , b)=>{

b = b - a;

a = a + b;

b = a - b;

return [a,b];

}

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

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

nav：定义只包含导航链接的章节;

header：定义页面或章节的头部;

它经常包含 logo、页面标题和导航性的目录。

footer：定义页面或章节的尾部;

它经常包含版权信息、法律信息链接和反馈建议用的地址。

aside：定义和页面内容关联度较低的内容，

如果被删除，剩下的内容仍然很合理。

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

get请求类似于查找的过程，用户获取数据，

可以不用每次都与数据库连接，所以可以使用缓存。

post不同，post做的一般是修改和删除的工作，

所以必须与数据库交互，所以不能使用缓存。

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

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

promise、generator、async/await

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

预加载：提前加载图片，

当用户需要查看时可直接

从本地缓存中渲染。

懒加载：懒加载的主要目的

是作为服务器Web前端开发的优化，

减少请求数或延迟请求数。

两种技术的本质：

两者的行为是相反的，

一个是提前加载，

一个是迟缓甚至不加载。

懒加载对服务器Web前端开发有一定

的缓解压力作用，

预加载则会增加服务器Web前端开发压力。

11. bind，apply，call的区别?

通过apply和call改变函数的this指向，

这两个函数的第一个参数都是一样的，

表示要改变指向的那个对象，

第二个参数，apply是数组，

而call则是arg1,arg2...这种形式。

通过bind改变this作用域

会返回一个新的函数，

这个函数不会马上执行。

12. 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>

以上就是小T今天为大家分享的关于2021年Web前端开发面试题汇总的文章，希望本篇文章能够对想要参加Web前端开发面试的小伙伴们有所帮助，想要了解更多Web前端开发相关知识记得关注IT培训网Web培训官网。最后祝愿小伙伴们面试成功，成为一名优秀的Web前端开发工程师。

【免责声明：本文图片及文字信息均由小T转载自网络，旨在分享提供阅读，版权归原作者所有，如有侵权请联系我们进行删除。】

Web前端开发工程师，是从事Web前端开发工作的工程师。主要进行网站的开发、优化、完善的工作。网页制作是Web 1.0时代的产物，那时网站的主要内容都是静态的，用户使用网站的行为也以浏览为主。

一位好的Web前端开发工程师在知识体系上既要有广度，又要有深度，所以很多大公司即使出高薪也很难招聘到理想的Web前端开发工程师。现在说的重点不在于讲解技术，而是更侧重于对技巧的讲解。技术非黑即白，只有对和错，而技巧则见仁见智。以前会Photoshop和Dreamweaver就可以制作网页，现在只掌握这些已经远远不够了。无论是开发难度上，还是开发方式上，现在的网页制作都更接近传统的网站后端开发，所以现在不再叫网页制作，而是叫Web前端开发。Web前端开发在产品开发环节中的作用变得越来越重要，而且需要专业的Web前端开发工程师才能做好，这方面的专业人才近两年来备受青睐。Web前端开发是一项很特殊的工作，涵盖的知识面非常广，既有具体的技术，又有抽象的理念。简单地说，它的主要职能就是把网站的界面更好地呈现给用户。

文章出自：http://qh.itpxw.cn/peixun/web/202186338.html

文章标题：2021年Web前端开发面试题汇总(一)



免责声明：本站文章均由入驻起航学习网的会员所发或者网络转载，所述观点仅代表作者本人，不代表起航学习网立场。如有侵权或者其他问题，请联系举报，必删。侵权投诉

(责任编辑：深圳学历教育网)