JS面试题

H5、CSS、JS 面试题

1.三栏布局的实现和优缺点 #
2.文字单行/三行显示 #
3.回流和重绘 #
4.防抖和节流实现原理，使用场景#
5.HTML语义化
6.CSS新特性 #
7.ES6新特性 #
8.盒模型 #
9.经典布局方案 #
10.定位 ##
11.盒子垂直水平居中 ##
12.内容垂直水平居中
13.BFC块级格式化上下文（Block Formatting Context）定义/左右/触发条件，#
14.display属性position,flex,(inline/block),...
15.JS中this闭包、作用域 #
16.call、apply、bind区别和使用场景？#
17.JS原型和原型链，prototype 、_proto_、constructor#
18.promise
19.async / await
95.异步加载Js的方式有哪些
19.选择器优先级
20.你对CSS3动画属性了解多少
21.session和cookie区别、SessionStorage，localStorage
22.查看代码输出什么是宏任务和微任务，都包括哪些
23.常用数组方法
24.常用字符串方法
25.常用js内置函数
26.跨域，列举几种解决跨域问题的方式，且说明原理#
27.ES6中新增class类
28.document.write和innerHRTML区别innerText
29.requireJS
30.谈谈你对JSON的了解
31.var、let、const，变量提升，能否重复赋值，重复声明
32.target和currentTarget区别
33.如何自定义事件，createEvent、initEvent、dispatchEvent
34.事件模型
35.事件循环
36.JS事件绑定3种方式
37.简述readonly和disabled的区别
38.列举BOM常用对象，window对象，window对象常用方法
40.JS中callee和caller的作用
41.异步加载JS的方法
42.事件代理
43.事件委托是什么，jQuery的事件委托方法bind 、live、delegate、on之间有什么区别？
44.获取各种高度scrollWidth/scrollHeight、clientWidth/clientHeight、offsetWidth/offsetHeight区别
45.谈谈你对AMD和CMD的理解
46.说几条写JS的基本规范（参考雅虎军规）
47.JS数据类型(null,undefined,boolan,number,string,object(function,Array),symbol)
48.eval是什么
49.JS延迟加载的方式有哪些
50.attribute和property
51.谈谈面向对象和面向过程编程的优缺点，异同
52.JS动画和CSS动画的区别及相应实现
53.快速的让一个数组乱序
54.定时器setInterval（fn，500），setInterval（fn（），500）区别
55.如何阻止事件冒泡和默认事件
56.instanceof判断一个对象是否属于某个类
57.移动端最小触控区域44pt x 44px等移动端标准相关
58.作用域分类（快作用域、词法作用域、动态作用域），js属于哪种作用域（词法作用域）
59.自执行函数，应用场景，好处
60.JS多页面直接如何进行通信（cookie、web worker、localeStorage和sessionStorage）
61.如何修改url参数页面不刷新
62.JS本地对象、内置对象、和宿主对象
63.JS的同源策略，为什么要同源限制
64.复杂数据类型如何转变为字符串
65.JS中this指向问题 ###
66.ES6箭头函数和普通函数区别###
67.document load和document ready的区别
67.JS如何检测一个变量是String类型
68.JS去除字符串空格
69.=、==和===区别
70.JS中dom节点操作，增删移动复制创建查查找节点
71.require与import区别
72.typeof返回数据类型
73.列举3种强制类型转换，和2种隐式类型转换，说一下JS中类型转换的规则？
74.如何判断NaN
75.如何判断JS变量的类型（typeof、instanceof、Object.prototype.toString.call()、Array.isArray() ）
75.严格模式和混杂模式
76.null和undefined区别#
77.jsonp优缺点，json和jsonp的区别?xml和 json的区别
78.ajax请求时，如何解释json数据
79.清除浮动
80.谈谈JS的垃圾回收机制，谈谈垃圾回收机制的方式及内存管理
81.你对前端性能优化有什么了解？一般都是通过哪几个方面去优化
83.浏览器缓存机制
84.什么是虚拟DOM，好处
85.实现一个函数clone 可以对Javascript中的五种主要数据类型（Number、string、Object、Array、Boolean）进行复制
86.js实现继承的方法有哪些，手写一个类的继承
87.判断一个变量是否是数组，有哪些办法? ##
88.XMLHttpRequest：XMLHttpRequest.readyState;状态码的意思
89.如何实现对一个div的拖拽，拖拽会用到哪些事件
90.如何用原生js给一个按钮绑定两个onclick事件？
91.console.log(1+'2')和console.log(1-'2')的打印结果 //12 -1
92.new操作符具体干了什么
93.Ajax原理
94.模块化开发怎么做
96.用过哪些设计模式
97.eval是做什么的？
98.[“1”, “2”, “3”].map(parseInt) 答案是多少？ ##
99.typeof()和instanceof()的用法区别#
100.new操作符具体干了什么
101.javascript语言特性中，有很多方面和我们接触的其他编程语言不太一样,请举例
102.form中的input可以设置为readonly和disable，请问2者有什么区别？
103.js中的3种弹出式消息提醒（警告窗口，确认窗口，信息输入窗口）的命令式什么？alert、confirm、prompt
104.节点的种类有几种，分别是什么？(1)元素节点：nodeType ===1;(2)文本节点：nodeType ===3;(3)属性节点：nodeType ===2;
105.外边距合并，外边距合并指的是，当两个垂直外边距相遇时，它们将形成一个外边距。合并后的外边距的高度等于两个发生合并的外边距的高度中的较大者。
106.怎么判断两个对象相等
107.csrf，xss
108.为什么利用多个域名来存储网站资源会更有效？
67、请说出三种减低页面加载时间的方法

• 压缩css、js文件
• 2、合并js、css文件，减少http请求
• 3、外部js、css文件放在最底下
• 4、减少dom操作，尽可能用变量替代不必要的dom操作

网络相关

1.http的缓存机制
2.http 2.0的特性
3.http状态码
4.http和https区别
5.GET和POST区别
6.

算法

1.手写斐波那契数列及其优化
2.JS数组、对象深浅拷贝，手写JavaScript深度克隆函数deepClone
3.手写数组、对象、字符串去重函数
4.你知道的排序算法，实现方式
5.输入2个以上数组求交、并、补集
6.求数组最大、小值
7.使用递归完成1到100的累加

ES6新增方法面试题

1.let const var比较
2.反引号（`）标识
3.函数默认参数
4.箭头函数
5.属性简写
6.方法简写
7.Object.keys()方法，获取对象的所有属性名或方法名
8.Object.assign ()原对象的属性和方法都合并到了目标对象
9.for...of 循环
10.import和export
11.Promise对象
12.解构赋值
13.set数据结构（可用于快速去重）
14.Spread Operator 展开运算符(...)
15.字符串新增方法

ES6数组面试题

1.forEach()
2.map()
3.filter()
4.reduce()
5.some()
6.every()
7.all()方法
forEach和map的区别

ES6编程题

1.使用解构，实现两个变量的值的交换
2.利用数组推导，计算出数组 [1,2,3,4] 每一个元素的平方并组成新的数组。
3.使用ES6改下面的模板
4.把以下代码使用两种方法，来依次输出0到9？

浏览器/html/css面试题

1.什么是盒模型

2.行内元素有哪些？块级元素有哪些？ 空(void)元素有那些？行内元素和块级元素有什么区别？

3.简述src和href的区别

4.什么是css Hack

5.什么叫优雅降级和渐进增强

6.px和em的区别

7.HTML5 为什么只写

8.Http的状态码有哪些

9.一次完整的HTTP事务是怎么一个过程

10.HTTPS是如何实现加密

11.浏览器是如何渲染页面的

12.浏览器的内核有哪些？分别有什么代表的浏览器

13.页面导入时，使用link和@import有什么区别

14.如何优化图像，图像格式的区别

15.列举你了解Html5. Css3 新特性

16.可以通过哪些方法优化css3 animation渲染

17.列举几个前端性能方面的优化

18.如何实现同一个浏览器多个标签页之间的通信

19.浏览器的存储技术有哪些

20.css定位方式

21.尽可能多的写出浏览器兼容性问题

22.垂直上下居中的方法

23.响应式布局原理

25.清除浮动的方法

26.http协议和tcp协议

27.刷新页面，js请求一般会有哪些地方有缓存处理

28.如何对网站的文件和资源进行优化

29.你对网页标准和W3C重要性的理解

30.Http和https的区别

31.data-属性的作用

32.如何让Chrome浏览器显示小于12px的文字

33.哪些操作会引起页面回流（Reflow）

34.CSS预处理器的比较less sass

35.如何实现页面每次打开时清除本页缓存

36.什么是Virtual DOM,为何要用Virtual DOM

37.伪元素和伪类的区别

38.http的几种请求方法和区别

39.前端需要注意哪些SEO

40.的title和alt有什么区别

41.从浏览器地址栏输入url到显示页面的步骤

42.如何进行网站性能优化

43.语义化的理解

44.HTML5的离线储存怎么使用，工作原理能不能解释一下？

45.浏览器是怎么对HTML5的离线储存资源进行管理和加载的呢

46.iframe有那些缺点？

47.WEB标准以及W3C标准是什么?

48.Doctype作用? 严格模式与混杂模式如何区分？它们有何意义?

49.HTML全局属性(global attribute)有哪些

50.Canvas和SVG有什么区别？

51.如何在页面上实现一个圆形的可点击区域？

52.网页验证码是干嘛的，是为了解决什么安全问题

53.请描述一下 cookies，sessionStorage 和 localStorage 的区别？

54.CSS选择器有哪些？哪些属性可以继承？

55.CSS优先级算法如何计算？

56.CSS3有哪些新特性？

57.请解释一下CSS3的flexbox（弹性盒布局模型）,以及适用场景？

58.用纯CSS创建一个三角形的原理是什么？

59.常见的兼容性问题？

60.为什么要初始化CSS样式

61.absolute的containing block计算方式跟正常流有什么不同？

62.CSS里的visibility属性有个collapse属性值？在不同浏览器下以后什么区别？

63.display:none 与 visibility：hidden的区别？

64.position跟display、overflow、float这些特性相互叠加后会怎么样？

65.对BFC规范(块级格式化上下文：block formatting context)的理解？

66.为什么会出现浮动和什么时候需要清除浮动？清除浮动的方式？

67.上下margin重合的问题

68.设置元素浮动后，该元素的display值是多少？

69.移动端的布局用过媒体查询吗？

70.CSS优化、提高性能的方法有哪些？

71.浏览器是怎样解析CSS选择器的？

72.在网页中的应该使用奇数还是偶数的字体？为什么呢？

73.margin和padding分别适合什么场景使用？

74.元素竖向的百分比设定是相对于容器的高度吗？

75.全屏滚动的原理是什么？用到了CSS的哪些属性？

76.什么是响应式设计？响应式设计的基本原理是什么？如何兼容低版本的IE？

77.视差滚动效果？

78.::before 和 :after中双冒号和单冒号有什么区别？解释一下这2个伪元素的作用

79.让页面里的字体变清晰，变细用CSS怎么做？

80.position:fixed;在android下无效怎么处理？

81.如果需要手动写动画，你认为最小时间间隔是多久，为什么？

82.li与li之间有看不见的空白间隔是什么原因引起的？有什么解决办法？

83.display:inline-block 什么时候会显示间隙？

84.有一个高度自适应的div，里面有两个div，一个高度100px，希望另一个填满剩下的高度

85.png、jpg、gif 这些图片格式解释一下，分别什么时候用。有没有了解过webp？

86.style标签写在body后与body前有什么区别？

87.CSS属性overflow属性定义溢出元素内容区的内容会如何处理?

88.阐述一下CSS Sprites