日常问题总结

1、vue响应式的原理，数据更新后怎么触发的dom的更新（详细原理）

首先数据的改变会触发setter的操作，

2、promise中tehn后面的第二个参数代表什么含义，all的含义用法

3、js严格模式与普通模式的区别，开启后有什么不同

4、箭头函数与普通函数有什么区别

5、bable版本

bable6
bable7

6、检验一个对象是否是空值

(1) object.keys(obj).length0
(2) for(let key in obj){
if(key){
return true
}
return false
}
(3) JSON.stringify(obj'{}'

7、判断一个对象obj是Array还是Object

    var arr = ['aa','bb','cc'];
    var obj = {
        a: 'aa',
        b: 'bb',
        c: 'cc'
    };

(1)obj.protoObject.prototype //如果是某个构造函数构造出来的那么 它的 _proto_是指向构造函数的 prototype属性
(2)Object.prototype.toString.call(obj) === '[object Array]'||'[object Object]'
(3)Array.isArray([]) //true 只能判断是否是数组
(4)obj.constructor=Array||Object
(5)使用instancof 数组也是对象的一种，使用instanceof都会返回true,因此不准确
console.log(arr instanceof Array); //true
console.log(arr instanceof Object); //true
console.log(obj instanceof Array); //false
console.log(obj instanceof Object); //true
Object.prototype.toString.call()，更加精准

8、flex连写的属性代表指什么

(1)flex-grow 一个数字，规定项目将相对于其他灵活的项目进行扩展的量。
(2)flex-shrink 一个数字，规定项目将相对于其他灵活的项目进行收缩的量。
(3)flex-basis项目的长度。合法值："auto"、"inherit" 或一个后跟 "%"、"px"、"em" 或任何其他长度单位的数字。

9、元素垂直水平居中的方法

(1)把元素变成定位元素,设置元素的定位位置，距离上、左都为50%,设置元素的左外边距、上外边距为宽高的负1/2
(2)把元素变成定位元素,设置元素的定位位置，距离上、左都为50%,设置元素的相对于自身的偏移度为负50%(也就是元素自身尺寸的一半)
(3)把元素变成定位元素,设置元素的定位位置，距离上、下、左、右都为0,设置元素的margin样式值为 auto
(4)flex布局,横轴，纵轴都居中

10、如果实现一个observer，有on emit remove方法

11、this.$nextTick之后做了什么

12、Array.from(of)作用

Array.from将一个类数组转换为一个真实数组
(1)该类数组对象必须具有length属性，用于指定数组的长度。如果没有length属性，那么转换后的数组是一个空数组。
(2)该类数组对象的属性名必须为数值型或字符串型的数字
(3)可以接收第二个参数，类似于map函数，对每个元素进行处理
如 console.log(Array.from(arrayLike, item => item + 1))
Array.of用于将一组值转换为数组，总是返回参数值组成的数组。如果没有参数，就返回一个空数组。
(1)Array.of基本上可以用来替代Array()或new Array()，并且不存在由于参数不同而导致的重载。它的行为非常统一。
这个方法的主要目的，是弥补数组构造函数Array()的不足。因为参数个数的不同，会导致Array()的行为有差异

13、const定义变量有何意义

(1)定义的基本类型变量存贮在内存栈中，是不能被更改的
(2)定义的引用类型同时占用栈内存和堆内存，是可以更改其属性的。也可以添加赋值，但是不能重新定义因为那样会改变在栈中的地址。
例如
const a={
name:'haha'
}
console.log(a.name) //haha
a.age'20'
console.log(a.age) //20
////////////
a={
name:'haha1',
age:20
}
console.log(a.name) //Uncaught SyntaxError: Identifier 'c' has already been declared

14、字符串倒序输出

function myReverse(str){
return str.split('').reverse().join('')
}

15、class中的super字段含义作用

(1)子类继承中 constructor 方法中必须有 super ，且必须出现在 this 之前。
(2)可以通过 super(..) 来实现相对多态，这样任何方法都可以引用原型链上层的同名方 法。

16、盒子模型的区别

(1)标准盒子模型中宽度是
width:margin2+border2+padding2+width;
height:margin2+border2+padding2+height;
(2)IE盒子模型中border
上面的两个宽度相加的属性是一样的。不过在ie中content的宽度包括padding和border这两个属性；
例如一个盒子模型如下：margin:20px,border:10px,padding:10px;width:200px;height:50px;

如果用w3c盒子模型解释，那么这个盒子模型占用的
宽度为：202+102+102+200=280px;
高度：202+102+202+50=130px;
盒子的实际宽度大小为:102+102+200=240px;
实际高度：102+102+50=90px;

用ie的盒子模型解释 ：盒子在网页中占据的大小为202+200=240px; 高：202+50=90px;
盒子的实际大小为：宽度:200px, 高度:50px;

17、事件委托

就是把一个元素响应的事件，委托到另一个元素上，通过该元素进行触发。通常绑定父元素上
利用的是事件冒泡的机制,当事件触发在父元素时，事件会先向下进入捕获阶段，我们通过判断target上的一些属性，可以精确匹配到某一个元素上。
优点：减少性能消耗，若果我们有一个列表，列表之中有大量的列表项，我们需要在点击列表项的时候响应一个事件；如果给每个列表项一一都绑定一个函数，那对于内存消耗是非常大的，效率上需要消耗很多性能； 比较好的方法就是把这个点击事件绑定到他的父层，也就是 ul 上，然后在执行事件的时候再去匹配判断目标元素；所以事件委托可以减少大量的内存消耗，节约效率。

https://vuetifyjs.com/en/
https://nutui.jd.com/#/backtop
http://mint.wkmblog.com/
https://vant-contrib.gitee.io/vant/#/zh-CN/popup#dai-ma-yan-shi