一面
盒模型
- 标准盒模型
- IE盒模型
- box-sizing以及其属性
position：relative和absolute
position：absolute 是相对于static定位以外的第一个父元素进行定位。
实现水平垂直居中的方法
我回答了3种
- flex布局
display: flex;
align-items:center;
justify-content:center;
如何清除浮动
我回答了两种方法
rem和em
- 当使用 rem 单位，他们转化为像素大小取决于页根元素的字体大小，即 html 元素的字体大小。 根元素字体大小乘以你 rem 值。 例如，根元素的字体大小 16px，10rem 将等同于 160px，即 10 x 16 = 160。
- 当使用em单位时，像素值将是em值乘以使用em单位的元素的字体大小。 例如，如果一个 div 有 18px 字体大小，10em 将等同于 180px，即 10 × 18 = 180。
http://caibaojian.com/rem-vs-em.html
闭包
就问了一下概念，问我平时有没有用到过闭包（我说几乎没有）
执行上下文 this
箭头函数的this执行问题
var obj = {
say(){
console.log(this);
},
say2:()=>{
console.log(this);
}
}
var a = obj.say;
a(); //window
obj.say(); //obj
obj.say2(); //window
obj.say2.bind(obj); //window
箭头函数的 this
箭头函数的 this是不进行绑定的，即就是 通过call、apply、bind是不能改变其 this指向的
箭头函数的 this是由定义时外围最接近一层的非箭头函数的 this来决定的，也就是平常所说的箭头函数的this是从上层作用域中去找的，一直找不到的话即为window.
var name = 'window';
var person1 = {
name: 'person1',
foo1: function () {
console.log(this.name)
},
foo2: () => console.log(this.name),
foo3: function () {
return function () {
console.log(this.name)
}
},
foo4: function () {
return () => {
console.log(this.name)
}
}
}
var person2 = { name: 'person2' }
person1.foo1(); //1
person1.foo1.call(person2); //2
person1.foo2(); //window
person1.foo2.call(person2); //window
function test(){ console.log(this.name);}
test()
test.call()
person1.foo3() (); // window
person1.foo3.call(person2)(); // window
person1.foo3().call(person2); // 2
person1.foo4()(); //1
person1.foo4.call(person2) (); // 2
person1.foo4().call(person2); //1
手写原型链，实现在obj上找到protoName的方法
hasOwnProperty() 方法会返回一个布尔值，指示对象自身属性中是否具有指定的属性（也就是，是否有指定的键）。
function findProp(obj, propName) {
while (1) {
if (obj === null) {
return undefined;
}
if (obj.hasOwnProperty(propName)) {
return propName;
}
obj = obj.__proto__;
}
}
function Person() {}
Person.prototype.name = '111';
var person1 = new Person();
const result = findProp(person1, 'name');
手写promise.all()
Promise.property.all = function (iterators) {
const promises = Array.from(iterators);
const len = promises.length;
let count = 0;
let resultList = [];
return new Promise((resolve,reject)=>{
promises.forEach((p,index) =>{
Promise.resolve(p)
.then((result)=>{
count++;
resultList[index] = result;
if(count === len){
resolve(resultList);
}
})
.catch(e=>{
reject(e);
})
})
})
}
简单说一下你理解的react
react 是一个用于构建用户界面的 js 库，它的特点是声明式编程、组件化开发和多平台适配。
其中声明式编程就是我们只需要维护自己的状态，当状态发生改变时，react就会根据最新的状态去渲染UI 界面
有虚拟dome
虚拟dom其当于是在 js 和 真实dom之间的一个缓存。然后利用 diff算法避免没有必要的dom操作。具体来说就是在第一次渲染真实dom之前，react在内存中生成一个与真实 dom一样的虚拟dom；当state或props发生变化时，会再次生成一个新的虚拟dom树，然后通过对比找出新旧虚拟dom树的差异，然后对这些差异做一次批处理，也就是将差异更新到真实的dom上。
这样做的好处就是提高了渲染速度，因为每次更新的话，是只更新有差异的部分，而不是全部更新。但是这样也会导致一个问题就是初次加载页面会很慢，因为会多一次虚拟dom的计算
这时候，面试官就说其实这个初次加载页面时间还是在s内的，可以忽略不计，但是真正影响初次加载react项目时间很长的原因是什么呢？
react首屏页面加载性能优化记录
