百度

面试

1）行内元素是盒模型吗
2）margin重合产生的原因及解决的方法
3）es6的块级作用域是如何产生的
4）es6的promise then里第二个function和catch的优先级

new Promise().then(
    () => {},
    (error) => {
        console.log('then')
    }
).catch({
    console.log('error')
}) // then
let promise = new Promise(function(resolve,reject){resolve('');console.log(0)}).then(()=>{reject('')}).then(()=>{console.log(1)},()=>{console.log(2)}).catch(()=>{console.log(3)})

5）

    new Promise().then(function(str){}).then(function(str){console.log(str)})  // undefined

6）路由是如何设置的
onhashchange history的API popstate pushstate
7）1px是如何产生的，如何解决
8）垂直水平居中的几种方法，（margin-left 百分比以父元素的宽度为基准）
9）flex为什么能够形成弹性盒子
10）如何清除浮动
11）浮动产生的原理及容易导致的问题，以及如何解决
12）箭头函数的优缺点及原因
13）在箭头函数中是否可以使用bind(this)，为什么？
14）vue这种mvvm框架，是如何实现数据的双向绑定的
15）跨域的原因、解决方案
16）http2.0相比于1.0或者1.1有哪些改进
17）url输入到渲染的过程
18）前端资源下载和渲染过程中可优化的点
19）移动端和pc端要注意的不同点，不仅仅是兼容方面的不同
20）函数节流

答案：

1）是。盒子模型，意思是具备内容、填充、边框和边界这些属性，虽然行内元素无法设置宽高这些属性，但它是盒子模型；能够设置宽高的那些叫做文档流

扩展：常见的行内元素有span img input select textarea等，行内元素不能设置的属性有宽度、高度、竖直方向的margin和padding，水平方向的margin padding是生效的
2）解决方案：1.增加透明的border边框；2.绝对定位；3.外层div overflow:hidden 4.内层div增加float:left 或者display:inline
扩展：触发BFC的方法：1.float 2.overflow 3.display(table-cell/inline-block) 4.position(static和relative除外)
创建BFC的初衷是：让元素能够方便计算它自身及其子元素的宽高

3）es6的块级作用域是通过let和const来体现的，let和const的特性在于：let声明的变量只在所处的块级有效；let没有变量提升的特性，而是‘暂时性死区’的特性；不能重复声明

7）1px的产生是由于苹果的retina屏幕是高清屏幕，普通屏幕的1个像素点就是1个物理像素点，而高清屏幕的1个像素点是4个物理像素点，所以宽高各对应2个物理像素点，即css 1px的边框在dpr=2的苹果手机上，会显示成2px

9）flex能够改变其子元素的排列方式和宽高
https://www.jianshu.com/p/ce5d23ec13aa

10）1.父元素定义height 2.结尾处加clear:both 3.伪类 4.父级定义overflow：hidden 5.

11）https://blog.csdn.net/fishsoul/article/details/1792776

13）箭头函数中可以使用call(this, arg)，但是this是不会生效的

16）http2.0更新的点：1.多路复用 2.头部压缩 3.server push 建议细看

20）函数节流 throttle函数和debounce函数，主要是针对scroll resize mousemove等不断触发的事件
其思想是：设置定时器，每次调用函数时首先清除之前定时器，重新计时，这样就可以保证只触发最后一次的scroll事件，因为之前的事件都在不断触发过程中被清掉了

参考链接：https://www.jianshu.com/p/4f3e2c8f5e95