前端一到三年最全面试题（一） 򍹉

原文:
http://blog.gqylpy.com/gqy/431

置顶：来自一名75后老程序员的武林秘籍——必读（博主推荐）


来，先呈上武林秘籍链接：http://blog.gqylpy.com/gqy/401/

你好，我是一名极客！一个 75 后的老工程师！

我将花两分钟，表述清楚我让你读这段文字的目的！

如果你看过武侠小说，你可以把这个经历理解为，你失足落入一个山洞遇到了一位垂暮的老者！而这位老者打算传你一套武功秘籍！

没错，我就是这个老者！

干研发 20 多年了！我也年轻过，奋斗过！我会画原理图，会画 PCB，会模拟，会数字！玩过 PLC，玩过单片机，会用汇编，会用 C！玩过 ARM，比如
PLC，STM32，和时下正在起飞的 NXP RT1052！搞过 DSP，比如 TMS320F28335！搞过 FPGA，不管 Xilinx 还是 Altera，也不管是 Verilog 还是
VHDL，或者直接画数字电路图！我懂嵌入式系统，比如 uCOS 和 Linux！我懂开源的硬件，比如 Arduino
和树莓派!我也搞软件，学了一堆上位机的语言C#，JAVA，Python，Kotlin，Swift！会写爬虫工具，又自学写APP，不管Android 还是 IOS！

可是这一切有什么用呢？土鸡瓦狗！不值一提！干技术的永远就是最苦逼的那个人！

我相信看到这里的你，应该是个 IT
圈的人！或许是个学生，在学习某个技能！或者是个初入职场的年轻人，在啃某个技术！或者是个工程师，被项目困住，想找个资料快速突破阻碍！反正不管怎么样，你们都不会是泛泛之辈，不可能轻易交出智商税！

所以我把这份资料放进我的收费资源里，以证明接下去我要跟你讲的这本武功秘籍是可以真真实实的帮你赚到钱的！

我不知道叫它什么好，我把它写的像武林秘籍！所以我姑且叫它《武林秘籍》或者叫《赚钱秘籍》!

《武林秘籍》里封装了一个本人近期创造的一个可以一劳永逸的赚钱方法！你可以理解为躺着赚钱，或者挂机赚钱！请你放心，不是让你去违法！

我是一个IT男，从来不忽悠别人，这是我做人的原则。若此举能帮助你付起房子首付与月供，减轻一些目前高房价的压力，何乐而不为呢！

我提取里边几个要点：

  1. 将你手里有的资源按照说明书一步一步完成所有动作就可以躺着赚钱。
  2. 你不可能不劳而获，但是用这个方法确实是可以一劳永逸!
  3. 我用业余时间操作这个项目三个月，现在每天稳定收入300+。
  4. 里边会告诉你哪些是资源，怎么源源不断的获取资源。
  5. 里边会告诉你怎么获取爆炸的流量。
  6. 里边会告诉你很多黑技能（不是干坏事）。
  7. 总之，里边字字如金，有些东西我不告诉你可能这辈子都不会知道!

交了这波智商税，你的能力会爆涨，我说的不是你的专业能力，而是在这个社会生存的基础能力！

以上所有的东西可以规为武功的招式，但如果你想短期就实现目标，我还在说明书的最后留下了一些现成资源的下载链接，包括一些稀缺的资源，保证物有所值。这部分内容可以规为内功，继不继承由你自已决定！

好了，最后跟所有的老者不一样的是：这个老人要问你收取一点点小费，才会把无比珍贵的秘籍交到你手中！

以下是付款链接，付款后你将获取《武林秘籍》的访问密码。随后你将解锁另外一个谋生技能，在工作挣着死工资的同时，该技能也能同时帮你赚另一份钱，终身受用！

http://www.gqylpy.com/get_wlmj_pwd

能在此遇见是我们的缘分，我愿意帮助你，祝你取得成功！

传说中的武林秘籍：http://blog.gqylpy.com/gqy/401/

今天给朋友们分享一到三年前端最全的面试题（其中包括HTML，CSS，JS，React，Vue，NodeJS，版本仓库的使用，互联网基础知识）。

面试流程，以及电话面试，HR面试的模拟问题以及面试礼仪：

请看此链接：面试流程以及面试技巧全分析(不管你有几年经验看了以后都会提高你的面试成功几率)

HTML,CSS面试题：

  1. 请讲一下HTML5的特点。
  2. 你知道的语义化的标签有哪些？
  3. CSS3新增了哪些特性？
  4. 请讲一下CSS3动画的优点，你是怎么使用的？
  5. 请讲一下圣杯布局和双飞翼布局。你还知道哪些布局？
  6. 如何写宽高自适应的APP？

    答案：请访问：前端项目自适应屏幕的技巧

  7. 如何更改input的样式？

    答案：请访问：更改input的样式

  8. div+css的布局较table布局有什么优点？
  9. grid布局有过了解么？

    答案：CSS新布局之display: grid;详细介绍

  10. img的alt与title有何异同？strong与em的异同？
  11. 请描述一下渐进增强与优雅降级。
  12. 知道什么是微格式吗？谈谈理解。在前端构建中应该考虑微格式么？
  13. 一个页面上有大量的图片（大型电商网站），加载很慢，你有哪些方法优化这些图片的加载，给用户更高的体验。

    答案：使用精灵图，将小规格的图片整合为一张精灵图，减少浏览器请求次数。

  14. CSS有哪些选择器？

    答案：最全CSS知识整理

  15. CSS中可以通过哪些属性，使得一个DOM元素不显示在浏览器的可视范围内？
  16. 行内元素和块级元素的区别是什么？行内元素的padding和margin可设置么？
  17. 什么是外边距重叠？重叠的结果是什么？
  18. rgba()和opacity的透明效果有什么不同？

    答案：opacity透明子元素会跟着透明（继承），rgba()的透明子元素则不会继承。

  19. 请描述display:none；visibility:hidden；opacity:0;三者的区别；

    答案：最全CSS知识整理

  20. 超链接访问过后hover样式就不出现的问题是什么？怎么解决？
  21. 你知道的css让元素垂直水平居中的方法有哪些？

    答案：请访问：元素垂直水平居中的方法

  22. 如何垂直居中一个浮动元素？

    答案：用定位，计算top与left，可以用CSS的函数calc()计算。

  23. 请讲一下px，em的区别。

    答案：最全CSS知识整理

  24. SASS和LESS是什么？为什么要使用它们？

    答案：CSS预处理器，通过编程的方式来开发CSS，可实现代码简写与复用等。

  25. CSS的link和import的区别是什么？

    答案：最全CSS知识整理

  26. 请讲一下盒模型。
  27. BFC是什么？
  28. html常见兼容性问题。
  29. 对WEB标准以及W3C的理解与认识。
  30. 前端页面有哪三层构成？分别是什么？作用是什么？

    答案：结构层(HTML - - 设置页面的基本结构)、样式层(CSS - - 修改页面展示给用户的样式加一些小交互)、行为层(JS - - 使用户与页面完美交互)

  31. CSS选择符有哪些？块级元素有哪些？空元素有哪些？

    答案：最全CSS知识整理

  32. CSS选择符有哪些？哪些属性可以继承？优先级算法如何计算？CSS新增伪类有哪些？

    答案链接同上。

  33. 请说出position的属性值有哪些。每个值的特点作用。

    答案链接同上。

  34. position和display、margin、collapse、overflow、float这些特性叠加以后会怎么样？
  35. 浏览器标准模式和怪异模式之间的区别是什么？
  36. display的属性值有哪些？可以做什么？

    答案链接：最全CSS知识整理

  37. 哪些CSS属性可以继承？
  38. 你开发过程中遇到过最棘手的html与css问题是什么？

    参考答案：笔者遇到最棘手的是做左侧sidebar导航，具体可看：左侧sidebar和整体分开滚动，并在X轴正常显示二级菜单

JS基础题：

  1. JS的数据类型有哪些？

    答案：请访问：JS数据类型详解

  2. 如何判断JS变量的数据类型？
    1. typeof()
    2. instanceof
    3. constructor
    4. toString
    5. Object.prototype.toString

      关于最重要的Object.prototype.toString请观看：https://blog.csdn.net/weixin_43606158/article/details/93380867

  3. typeof求解的可能值有哪些？
    1. “number”
    2. “string”
    3. “boolean”
    4. “undefined”
    5. “object”
    6. “symbol”
    7. “function”
  4. 数据类型的自动转换和隐式转换你知道哪些？
    • 隐式类型转换：

      • 1 == ‘1’
      • ‘1’ + 1
      • ‘1’ - 1
    • 显示类型转换：
      • parseInt(str,radix)/parseFloat(str,radix)/Number()转变成数字。
      • Boolean(param)转变成布尔值
      • subString()转变成字符串

详细关于JS数据类型转换的内容请观看：一篇文章搞懂JS转换规则

5. “ == ” 和 “ === ” 还有 “ != ” 和 “ !== ”的区别？

- “ == ” 和 “ != ”会做数据隐式类型转换，转换完数据类型在做比较。而“ === ” 和 “ !== ”会先判断数据类型，如果俩者的数据类型不一致直接返回false就不会再去做值的比较了。

6. 讲一讲“ || ” 和 “ && ”。

答案：请访问：彻底了解"||“和”&&"

7. “ i++ ” 和 “ ++i ”的区别。

i++是先引用i的值而后将i递增1。

++i是先将i的值加1而后引用它的值。

8. break，renturn，continue三者的区别

答案：return、break与continue的区别

9. 请讲一讲递归。

函数自身调用自身。 详细请看：递归

用递归实现遍历迭代

10. 你知道哪些算法？

答案：请访问：JS算法小总结

11. 你一般如何调试bug？

答案：请访问：前端调试bug的方法

12. 数组的常用API你知道哪些？

答案：请访问：数组的常用API详解

13. 请讲将数组与伪数组的区别。

答案：请访问：伪数组是什么？伪数组与数组的区别

14. 请讲讲你对面向对象编程的理解。

答案：请访问：面向对象编程(OOP)的概念

15. 请讲讲原型链。

答案：JS原型知识整理

16. 请讲讲继承的方法。

答案：JS继承的六种方法

17. 请讲讲JavaScript作用域。

答案：JS作用域与声名提升

18. 请讲讲变量的声明提升

答案：JS作用域与声名提升

19. 创建对象的方法有哪些？

答案：https://blog.csdn.net/weixin_43606158/article/details/94912023

20. 请讲讲ECMAScript的内置对象。

答案：https://blog.csdn.net/weixin_43606158/article/details/94912023

21. Array在ES5新增遍历的API它们每个的用法，返回值，参数。

答案：数组ES5新增遍历迭代的方法及其区别

22. 请讲讲字符串的常用API。

23. ES5/ES6新增的哪些东西是你平时开发中常用到的？

答案：ES5/6新特性

24. 列举浏览器对象模型BOM里常用的至少四个对象，并列举window对象的常用方法至少五个。

答案：BOM内容的小整理

25. 请讲一下你知道的性能优化的方法。

答案：提高JS性能的12个技巧

26. 事件绑定和普通事件有什么区别？

答案：事件绑定和普通事件的区别

27. IE和其他浏览器事件流的区别。

答案：IE浏览器是事件冒泡，其他浏览器是事件捕获（标准DOM事件流）。

28. IE的标准下有哪些兼容性的写法？

29. 请讲一下this的指向问题。

答案：this的指向

30. 更改this指向的方法有哪些？

答案：更改this指向的方法及其区别

31. 请讲一下bind(),call(),apply()三者的区别。

答案链接同上

32. 请讲一下JavaScript的闭包。有什么特点？对页面有什么影响？

答案：JS闭包的理解

33. 事件委派/事件委托是什么？

答案：事件委派的使用及作用

34. 如何阻止事件冒泡和浏览器默认事件？

答案：浏览器事件默认行为介绍与阻止的方法

JS事件流介绍与阻止事件冒泡

35. 添加，删除，替换，插入到某个节点的方法。

DOM知识详细整理

36. document.load和document.ready的区别。

37. 请讲一下JavaScript的同源策略。

答案：JavaScript的同源策略

38. 请说出你知道的跨域的方法有哪些？最常用的是哪个？怎么使用的？

答案：前端跨域的六种解决方法

39. JavaScript是一门什么样的语言？它有哪些特点？

答案：弱类型语言，类型会做隐式转换，作用域，声名提升。。。

40. 希望获取到页面中所有的checkbox怎么做？（不使用第三方框架）

答案：方法很多，笔者随便写一个朋友们可进行参考：document.getElementsByTagName(‘input‘).filter(item => //根据getAttribute(‘type‘))的结果去筛选checkbox

41. 正则表达式构造函数var reg = new RegExp(‘xxx’)与正则表达式字面量var reg = /xxx/有什么不同？

42. JavaScript中callee和caller的作用？

43. 简述JavaScript的DOM里document获取节点的方法，并说出对应作用。

44. 简述创建函数的几种方式。

答案：JS函数介绍

45. 把script标签放在body结束标签之前和结束标签之后有什么区别？浏览器会怎么解析它们？

46. 请描述iframe的优缺点。

47. 请谈谈cookie的弊端。

48. 请谈谈localStorage和SessionStorage的区别和特点。

49. JS延迟加载的方式有哪些？

50. 哪些操作会造成内存泄漏？

51. 请说一下JavaScript中的垃圾回收机制。

52. 在js中0.1+0.2等于多少？如何让它得到正确答案？

53. 你用过axios么？

答案：axios的使用

54. async，promise，settimeout的执行顺序

答案：一篇文章彻底搞懂异步，同步，setTimeout，Promise，async

55. 前端开发这么久了你知道哪些常用的网站？

答案：前端开发应知网站

56. 你写过哪些前端工具（功能）函数？

答案：前端开发常用功能函数总结

57.

React面试题：

由于内容过多，于是笔者单独整理了一篇文章，请点击链接： React一到三年面试题总结以及进阶题

PS：对不起朋友们，之前放错链接了，放的vue的

Vue面试题整理：

由于内容过多，于是笔者单独整理了一篇文章，请点击链接： Vue一到三年面试题总结

版本仓库的使用：

  1. 你了解Git么？

    答案：Git版本仓库介绍

  2. 你了解SVN么？

    答案：SVN简介及使用方法

  3. Git的常用命令你知道哪些？

    答案：Git常用命令介绍

  4. Git你是怎么解决代码冲突的？

    答案：git解决代码冲突

  5. Git你是怎么回退版本的？

    答案：git回退版本

  6. 命令行的命令你知道哪些？

    答案：命令行常用命令

电脑相关知识：

  1. TCP/IP三次握手与四次挥手你了解过么？

    答案：一篇文章搞懂TCP/IP三次握手与四次挥手，用过手机的都能看懂

  2. 常见状态码及其代表的意义你知道哪些？

    答案：开发过程中常见状态码

  3. 实际开发移动端项目的过程中，你如何使用真机调试呢？

    答案：开发移动端项目在真机上面的调试方法

  4. 请讲讲长连接与短连接。

    答案：https://www.cnblogs.com/gotodsp/p/6366163.html

前端三到五年进阶题：

请看：前端三年到五年面试题分享（实例）

持续更新中。。。

原文:
http://blog.gqylpy.com/gqy/431

原文地址：https://www.cnblogs.com/mypath1/p/11407051.html

时间： 2024-11-12 07:40:32

前端一到三年最全面试题（一） 򍹉的相关文章

前端第四课——JS面试题

笔试题 1.JavaScript的基本数据类型 2.["1","2","3"].map(parseInt)答案? 3.JavaScript中如何将JSON转化成对象/数组?怎么转回来? 4.JavaScript中var的含义和作用 5.document.write和innerHTML的区别? 6.下面的输出结果? var name = "The Window"; var object = { name : "My O

前端涉及的所有知识体系

资源教程: 综合类 前端知识体系 前端知识结构 Web前端开发大系概览 Web前端开发大系概览-中文版 Web Front-end Stack v2.2 免费的编程中文书籍索引 前端书籍 前端免费书籍大全 前端知识体系 免费的编程中文书籍索引 智能社 - 精通JavaScript开发 重新介绍 JavaScript(JS 教程) 麻省理工学院公开课:计算机科学及编程导论 JavaScript中的this陷阱的最全收集--没有之一 JS函数式编程指南 JavaScript Promise迷你书(中

前端知识体系2

Raw Blame History 1226 lines (983 sloc) 67.4 KB QQ联盟群交流(492107297)群规 GITHUB在线地址 http://t.cn/RL2NtqX 看云在线地址 http://t.cn/RUdaGHn 这是我们联盟群的组织结构,加入等级参考JS高级前端开发群加群说明. 这本来是我QQ群内部的一份公共约定的日常交流规则,后来得到大伙的一致认可,并用实际行动来捍卫它,使我倍受感动. 后来想:传播使爱更有力量,阅读使内心更为坚强,沉淀使生活更为醇香,

前端资料QQ群交流

转:https://github.com/jsfront/src/blob/master/qq.md 这本来是我QQ群内部的一份公共约定的日常交流规则,后来得到大伙的一致认可,并用实际行动来捍卫它,使我倍受感动. 后来想:传播使爱更有力量,阅读使内心更为坚强,沉淀使生活更为醇香,分享使人更为谦卑或快乐.因为快乐,所以分享. 知识资源来源于互联网,应该返回给互联网,使看到的每一个人受益,也可以供其它各个行业的群主参考. 规则会不断的修改调整,你不在是一个受益者,更是一个项目参与者内容规则的创造者,

最全的资源教程-前端涉及的所有知识体系

https://github.com/AutumnsWind/Front-end-tutorial 资源教程: 综合类 前端知识体系 前端知识结构 Web前端开发大系概览 Web前端开发大系概览-中文版 Web Front-end Stack v2.2 免费的编程中文书籍索引 前端书籍 前端免费书籍大全 前端知识体系 免费的编程中文书籍索引 智能社 - 精通JavaScript开发 重新介绍 JavaScript(JS 教程) 麻省理工学院公开课:计算机科学及编程导论 JavaScript中的t

前端资源教程

资源教程 综合类 前端知识体系 前端知识结构 Web前端开发大系概览 Web前端开发大系概览-中文版 Web Front-end Stack v2.2 免费的编程中文书籍索引 前端书籍 前端免费书籍大全 前端知识体系 免费的编程中文书籍索引 智能社 - 精通JavaScript开发 重新介绍 JavaScript(JS 教程) 麻省理工学院公开课:计算机科学及编程导论 JavaScript中的this陷阱的最全收集–没有之一 JS函数式编程指南 JavaScript Promise迷你书(中文版

Web前端，HTML5开发，前端资源，前端网址，前端博客，前端框架整理 - 转

Web前端/H5开发,前端资源,前端网址,前端博客,前端框架整理 - 转 综合类 前端知识体系 前端知识结构 Web前端开发大系概览 Web前端开发大系概览-中文版 Web Front-end Stack v2.2 免费的编程中文书籍索引 前端书籍 前端免费书籍大全 前端知识体系 免费的编程中文书籍索引 智能社 - 精通JavaScript开发 重新介绍 JavaScript(JS 教程) 麻省理工学院公开课:计算机科学及编程导论 JavaScript中的this陷阱的最全收集--没有之一 JS

大厂面试题

1.大厂前端开发高频面试题库 http://www.imooc.com/article/290715?block_id=tuijian_wz 2.大厂前端经典面试问题精选(头条) https://www.php.cn/toutiao-415514.html 3.web前端大厂10道经典面试题汇总(含答案详解) https://zhuanlan.zhihu.com/p/57200821 4.大厂前端面试题 https://www.cnblogs.com/haishen/p/11697430.htm

前端是什么？如何系统地学习前端开发？

前端是什么? 工作流程为从UI处得到原型图或者效果图,在项目(网站.微信公众号.小程序.WEBAPP)中还原图片效果,然后与后台进行各种数据交互. 目前的前端市场整体还是处于迅速发展期,市场对于前端的需求也一直比较大.市场对于中高级的前端工程师需求更加迫切,所以就算入了前端的门,也需要不断的提升自己,无论你是学院派,还是培训派,还是自学派,都应该具有强烈的学习意识. 目前入门前端的人群分类 1.计算机相关专业出身系统走过计算机的理论基础,比如计算机组成原理.操作系统原理.计算机网络.算法数据结构