1、画一条0.5px的直线，请用CSS样式实现
width: 100px;
height: 1px;
transform:scaleY(0.5);
background-color: black;
2、根据以下CSS属性判断div宽度为_100___px？
box-sizing: border-box;
width: 100px;
padding: 10px 20px;
margin: 10px 0 20px 30px;
border: 1px solid #fff;
3、根据以下代码判断两个div上下之间的距离为_ 30___px？（填写数字）
.a{ margin-bottom: 30px; } .b{ margin-top: 20px; }
4、body里声明font-size:62.5%时，1em等于__10__px？
16*62.5% = 10
5、请写出让元素垂直居中的多种布局方法
1、flex
2、absolute + margin:auto
3、absolute + calc
4、absolute + top + margin
5、absolute + transform
详细请参考：juejin.cn/post/698686…
6、请简述cookie，localStorage，sessionStorage的区别
共同点：都是保存在浏览器端、且同源的 区别：
1、cookie数据始终在同源的http请求中携带（即使不需要），即cookie在浏览器和服务器间来回传递，而sessionStorage和localStorage不会自动把数据发送给服务器，仅在本地保存。cookie数据还有路径（path）的概念，可以限制cookie只属于某个路径下
2、存储大小限制也不同，cookie数据不能超过4K，同时因为每次http请求都会携带cookie、所以cookie只适合保存很小的数据，如会话标识。sessionStorage和localStorage虽然也有存储大小的限制，但比cookie大得多，可以达到5M或更大
3、数据有效期不同，sessionStorage：仅在当前浏览器窗口关闭之前有效；localStorage：始终有效，窗口或浏览器关闭也一直保存，因此用作持久数据；cookie：只在设置的cookie过期时间之前有效，即使窗口关闭或浏览器关闭
4、作用域不同，sessionStorage不在不同的浏览器窗口中共享，即使是同一个页面；localstorage在所有同源窗口中都是共享的；cookie也是在所有同源窗口中都是共享的
5、web Storage支持事件通知机制，可以将数据更新的通知发送给监听者
6、web Storage的api接口使用更方便
7、写出以下HTTP状态对应的状态码
Not Found，用状态码__404__来表示。
Internal Server Error，用状态码_500___来表示。
OK 正常返回信息，用状态码_200___来表示。
8、以下内容打印的内容为___ a+b=1020 ___?
let a = 10;
let b = 20;
console.log('a+b=' + a + b)
9、如何阻止事件冒泡？
event.preventDefault()
10、（必答）用递归的方法实现1到100求和，请写出以上代码
function sum(num){
if(num===1) return num
return sum(num-1)+num
}
11、（必答）请用多种方法实现数组去重
12、（必答）实现千分位表示金额，例如1002342.23 表示成1,002,342.23
function change(num){
return num.toLocaleString()
}
13、（必答）什么是防抖和节流？有什么区别？如何实现？
1.防抖：
高频率触发的事件,在指定的单位时间内，只响应最后一次，如果在指定的时间在触发，则重新计算时间(后面触发的事件执行，替代了前面的事件)
2.节流：
高频率触发的事件,在指定的单位时间内，只响应第一次(前面触发的执行前，忽略后面的事件)
3.防抖和节流的使用场景
防抖（debounce）
1.search搜索联想，用户在不断输入值时，用防抖来节约请求资源。
2.window触发resize的时候，不断的调整浏览器窗口大小会不断的触发这个事件，用防抖来让其只触发一次
function debounce(fn, time) {
// 创建一个标记用来存放定时器的返回值
let timeout = null;
return function () {
// 每当用户输入的时候把前一个 setTimeout clear 掉
clearTimeout(timeout);
// 然后又创建一个新的 setTimeout, 这样就能保证输入字符后的 interval 间隔内如果还有字符输入的话，就不会执行 fn 函数
timeout = setTimeout(() => {
//arguments是传入的参数
fn.apply(this, arguments);
}, time);
};
}
节流（throttle）
1.鼠标不断点击触发，mousedown(单位时间内只触发一次)
2.监听滚动事件，比如是否滑到底部自动加载更多，用throttle来判断
function throttle(fn, time) {
let canRun = true; // 通过闭包保存一个标记
return function () {
if (!canRun) return; // 在函数开头判断标记是否为true，不为true则return
canRun = false; // 立即设置为false
setTimeout(() => { // 将外部传入的函数的执行放在setTimeout中
fn.apply(this, arguments);
// 最后在setTimeout执行完毕后再把标记设置为true(关键)表示可以执行下一次循环了。当定时器没有执行的时候标记永远是false，在开头被return掉
canRun = true;
}, time);
};
}
14、（vue）请写出获取以下路由中的id的方法？并简述route的区别
$router
router是VueRouter的实例，包含了一些路由的跳转方法，钩子函数等
$route
route是路由信息对象，里面主要包含路由的一些基本信息，包括name、meta、path、hash、query、params、fullPath、matched、redirectedFrom
this.$route.params.id
path: '/user/:id'
15、（vue）DOM渲染在_Mounted___生命周期中完成，初始化数据在 __ Created__生命周期中完成?
16、（vue）VUE有哪些常用指令？如何自定义指令？
-
v-model
-
v-on
-
v-bind
-
v-show
-
v-for
-
v-if
-
v-else
-
v-text
-
v-html
-
v-once
自定义指令：
// 注册一个全局自定义指令 `v-focus`
Vue.directive('focus', {
// 当被绑定的元素插入到 DOM 中时……
inserted: function (el) {
// 聚焦元素
el.focus()
}
})
