一、JS相关
1、在什么情况下需要使用setTimeout(fun,0)？
ans：当需要执行的语句跟上下文语句存在依赖关系，但是无法判断先后顺序时，需要放到运行队列的队尾执行，这时就要用到setTimeout(fun,0)。
2、DOM文档加载的步骤（即浏览器与服务器建立连接到页面加载完毕发生的事情）
解析HTML结构。
加载外部脚本和样式表文件。
解析并执行脚本代码。
DOM树构建完成。
// window.addEventListener("DOMContentLoaded", function(){}, false)
// $(document).ready(function(){})
加载图片等外部文件。
页面加载完毕。
// window.addEventListener("load", function(){}, false)
// window.onload() = function(){}
// $(document).load(function(){})
PS. addEventListener的第三个参数？如何阻止冒泡？
3.检查是不是字符串？如果要求区分数组、对象、正则表达式和字符串呢？
Object.prototype.toString.call()
为什么要使用Object.prototype上的toString方法？因为第三方库或你自己的代码可能重写实例的toString方法。通过Object.prototype，我们可以强制实现实例原来的toString行为。
二、CSS相关
1、BFC折叠
画出以下代码呈现出的效果（标注高度和背景色）。
如何把a的高度撑起来？
.a{background: red;}
.b{background: yellow; height: 100px;}
.c{background: blue; height: 100px; margin-bottom: 20px;}
<div class="a"><div class="c"></div></div>
<div class="b"></div>
ans1：.a{overflow: hidden;}
ans2：.a::after{content: ''; display: table;}
ans3：.a::after{content:''; display: block; height: 1px; margin-top: -1px; opacity: 0;}
2、居中方法
ans1: transform: translate(-50%, -50%);
ans2: .wrap::after{content: ''; display: inline-block; height: 100%; vertical-align: middle;} .inner{vertical-align: middle;}
ans3: .wrap{display: table-cell; vertical-align:middle; height:font-size ≈ 1:0.893} .inner{vertical-align: middle;}
3、border-radius(较冷门）
border-radius: 1-4 length|%/1-4 length|%;
4、闭包
var li = document.getElementsByTagName('li');
for(var i = 0; i < li.length; i++){
li[i].addEventListener('click',function(e){
console.log(i);
})
}
三、Vue
1、描述你知道的/用过的生命周期？
beforeCreate-created-beforeMont-Monted
2、如何监听一个实例中某个data的变化？
watch
PS. deep: true 有什么作用？
网友评论