前端面试题

未分类

css部分
实现一个正方形
position的属性值
垂直水平居中
BFC
Margin重叠问题 浮动元素、inline-block、绝对定位的元素margin垂直方向上不会重叠
这几个解决方案都可以触发BFC同时解决margin重叠问题，并不是具有BFC特性就可以解决垂直margin重叠的问题
Box-sizing: contentx-box 标准盒模型
Border-box IE盒模型 块级元素的宽高都包含了border和padding
实现一个三角形 width和height都置为0，border-bottom有颜色，其他三个边框无颜色

Js部分

缓存机制 cookie storage
http协议 状态码
Tcp三次握手
Csrf和xss的原理及预防
跨域 问题产生原因及解决方案
Js的new操作符具体做了什么
事件循环机制
函数防抖和节流
输入url发生了什么
页面重排和重绘
闭包
深拷贝
实现bind方法

const first = () => (new Promise((resovle,reject)=>{
console.log(1);
let p = new Promise((resovle, reject)=>{
console.log(2);
setTimeout(()=>{
console.log(3);
},0)
resovle(4);
});
resovle(5);
p.then((arg)=>{
console.log(arg);
});
}));
first().then((arg)=>{
console.log(arg);
});
console.log(6);

1 2 6 4 5 3

算法题
柯里化
实现如下函数，使执行结果都等于9
1. add(2,3,4)=9
2. add(2)(3,4)=9
3. add(2)(3)(4)=9
4. add(2,3)(4)=9

对象扁平化

框架相关
Vue的双向数据绑定如何实现
Vue的diff算法
vue router的两种模式
vue的生命周期

function getNumber() {
    let n = 0
    return () => {
        n++
        return n
    }
}
const func1 = getNumber()
const func2 = getNumber()
func1() // 结果是？
func2() // 结果是？
func1() // 结果是？
func2() // 结果是？