最近考虑跳槽,但是出去面试了几次,发现有好多东西不常用还是会忘记很多,当然也和自己不够努力有一定关系,想总结下遇到的几个印象深的问题!
1、URL页面解析及加载过程
①浏览器输入url并回车
②浏览器查找当前url是否存在缓存,并比较缓存是否过期
③DNS解析url对应ip
④根据ip建立TCP(三次握手)
⑤HTTP发起请求
⑥服务器处理,浏览器接收HTTP
⑦渲染页面,构建DOM树
⑧关闭TCP(四次挥手)
(以上内容在此就不展开细说啦)
2、页面渲染
①将HTML构建成一个DOM树(DOM文档模型)DOM树的构建过程就是一个深度遍历的过程:当前节点的所有子节点都构建好后,才去构建下一个兄弟节点。
②将css解析成CSSOM去构建CSSOM树(cssom = css object model css对象模型)
③根据DOM和CSSOM去构造Rendering tree 。注意:display: none的dom节点不会渲染,所以不等同于dom树。
④通过rendering tree 浏览器知道了页面有哪些节点,它们的样式,以及从属关系。
⑤这步称之为Layout,顾名思义就是计算出每个节点在页面的位置,layout render tree。
⑥绘制,遍历render树。(注:reflow&repaint问题也会随之被提及)
3、ES6之 set&map
Set:提供了新的数据结构set,类似于数组,但是值都是唯一的,没有重复值。
Map: map结构提供了值-值的对应,是一种更完善的hash结构实现,如果是键值对数据结构,map比object更合适,类似于对象,也是键值对的集合。
详细请参考 http://es6.ruanyifeng.com/#docs/set-map
4、call&apply&bind
①call接受三个参数,第一个this指向,2/3传递给函数的实参,可以是数字,字符串,数组类型。
fn.call(undefined)严格模式:this: undefined, 非严格模式下: this: null
②apply和call使用方法基本相同,区别是apply传参要求是数组类型,数组内可以是任意形式的数据。
③bind传参与call类似,将this指向obj,将参数预先传给fn,只有fn执行,this指向和传参才有作用。
5、箭头函数与普通函数的区别
①箭头函数是匿名函数,不能作为构造函数,不能使用new
②箭头函数不绑定arguments,取而代之用rest参数解决。
③箭头函数绑定this,会捕获其上下文的值,做为自己的值。
④箭头函数通过call或apply调用一个函数,只传入一个参数,对this并没有影响。
⑤箭头函数没有原型属性,箭头函数不能当做generator函数,不讷讷噶使用yield关键字
css方面:
6、左中右布局占满屏,左右固定200*200中间自适应
HTML:
<div class="left">左边的盒子</div> <div class="right">右边的盒子</div> <div class="center">中间的盒子</div>
css:
html,body{margin: 0px; 100%} .left, .right{200px; height:200px; position:absolute; background-color:#ccc} .left{left:0px} .right{right:0px} .center{height:200px; background: #eee;}
7、清楚浮动的几种方式
①父级div定义height
②父级div定义overflow
③结尾处加空标签div,并加clear:both
除此之外还有关于Promise,Es6,vue,继承等一些问题,感觉找个满意的工作太辛苦啦,尤其是现在的大环境不好啊,如果哪个大神觉得我是可塑之才求带走,哈哈,自拍免费赠送……