只是我自己刷的哦!不是真的面试问到的,是在为面试做准备!
箭头函数和普通函数有什么区别?
箭头函数是匿名函数,不能作为构造函数,不能使用new。 箭头函数不绑定arguments,取而代之用rest参数解决。 箭头函数不绑定this,会捕获其所在的上下文的this值,作为自己的this值。 箭头函数通过call()或apply()方法调用一个函数时,只传入了一个参数,对this没有影响。 箭头函数没有原型属性。 箭头函数不能当做Generator函数,不使用yield关键字。
new操作具体做了什么?
创建一个空的对象 将this指向这个对象 通过this,为这个对象添加属性 通过this,将__proto__ 属性指向构造函数的原型对象
call、apply、bind区别?
call()、apply()和bind()都是用来改变函数执行时的上下文的,可以借助他们实现继承。 call()和apply()唯一的区别就是参数不一样,call()是apply()的语法糖。 bind()是返回一个新的函数,供以后调用,而apply()和call()是立即调用。
JS判断变量是不是数组的方法?
1、instanceof
var arr=[];
arr instanceof Array
2、原型prototype+toString+call()
var arr=[];
Object.prototype.toString.call(arr)
3、原型protitype+isPrototypeOf()
var arr=[];
Array.prototypr.isPrototypeOf(arr)
4、构造函数constructor
var arr=[];
console.log(arr.constructor.toString())
5、数组方法isArry()
var arr=[];
Array.isArray(arr)
Vue双向绑定
数据劫持:vue.js是采用数据劫持结合发布者-订阅者模式,通过Object.definePrototy()来劫持各个属性的setter、getter,在数据变动时发布消息给订阅者,触发相应的监听回调。
MVVM
MVVM为: Model、View、ViewModel Model代表数据模型,例View返回的data对象 View代表UI组件 VM是View和Model的桥梁,主要负责:数据绑定和视图监听
所理解的MVVM响应式原理 MVVM作为绑定的入口,整合Observer、Compile和Watcher三者,通过Observer来监听model数据变化,通过Compile来解析编译模板指令,最终利用Watcher搭建起Observer、Compile之间的通信桥梁,达到数据变化->视图更新;视图交互变化->数据model变更的双向绑定效果。
Vue生命周期(2.x)
beforeCreate:创建之前,还没有data数据和Method方法 Created:创建完成,data和Method可以使用了 beforeMount:渲染之前 mounted:页面渲染已经完成,可以操作DOM了 beforeUpdate:data改变之前,对应的组件重新渲染之前 updated:data改变之后,对应的组件重新渲染完成 beforeDestory:在实例销毁之前,此时实例还可以使用 destroyed:实例销毁后
第一次进入组件或者页面,会执行哪些生命周期?
beforeCreate Created beforeMount mounted
- 如果使用了keep-alive组件会多执行一个activated
- 但是第二次进入就之后执行activated,因为组件被缓存了。
keep-alive组件作用
vue性能优化 一般结合路由使用,如果没有变化,可以做一个缓存,不用重新加载。 activated和deactivated两个生命周期钩子函数。 用keep-alive包裹的组件在切换的时候不会进行销毁,而是缓存到内存中,并执行deactivated函数,命中缓存渲染结束后会执行activated钩子函数。
Vue优化方式
v-if和v-show 图片懒加载 路由懒加载 减少重新渲染和创建dom结点的时间,采用虚拟dom 使用Object.freeze() 方式冻结data中的属性,从而阻止数据劫持
v-if和v-show
1、v-if是动态向dom树内添加或者删除dom元素 v-show是通过设置dom元素的display样式控制显示与隐藏 2、编译过程:v-if切换有一个局部编译/卸载的过程,切换过程中合适的销毁和重建内部的事件监听和子组件 v-show只是简单的css切换 3、编译条件:v-if是惰性的,如果初始条件为假,则什么也不做;只有在第一次条件变化时才开始局部编译 v-show是在任何条件都被编译,然后被缓存,dom元素保留 4、v-if性能切换消耗更高 v-show初始渲染消耗更高 5、v-if适合运营条件不太变化 v-show适合频繁切花
虚拟dom
虚拟dom是相对于浏览器所渲染出来的真实dom,在react、vue等技术出来之前,想要改变页面展示内容只能通过遍历查询dom数找到需要修改的dom节点,然后进行修改来达到更新ui的目的。 这种方式相当损耗计算资源,因为每次查询都要遍历整颗dom树,如果建立一个和dom树虚拟的dom对象(js对象),以对象嵌套的方式来表示dom树,那么每次dom的更改就变成了js对象属性的更改,这样查找js对象的属性变化比查询dom树性能开销小。
dom树优缺点 缺点:首次大量渲染dom时,由于多了一层虚拟dom的计算,会比插入innerHTML慢 优点:减少了dom操作,减少了回流与重绘。 保证性能的下限,性能虽然不是最好但是具备局部更新的能力,大部分时候会比正常dom性能高。
回流与重绘
回流 render树中一部分或全部元素需要改变尺寸、布局、或着需要隐藏而需要重新构建,这个过程叫做回流 回流必将引起重绘 重绘 render树中一部分元素改变,而不影响布局的,只影响外观的,比如颜色。 页面至少经历一次回流和重绘(第一次加载的时候)。 区别 回流必将引起重绘,但是重绘不一定会引起回流。 比如只有颜色改变的时候只会发生重绘不会发生回流。 页面布局和几何属性改变时就需要回流。 添加或者删除可见的DOM元素,元素位置改变,元素尺寸改变、内容改变、页面渲染初始化、浏览器窗口改变等 优化 使用DocumentFragment进行缓存操作,引发一次回流和重绘; 使用display:none技术,只引发两次回流和重绘; 使用cloneNode(true or false)和replaceChild技术,引发一次回流和重绘; 不要经常访问会引起浏览器flush队列的属性,如果确实要访问,就利用缓存; 让元素脱离动画流,减少回流的Render tree的规模;
位于<head> 间的代码片段是做什么用的?
-
<meta name="viewport" content="width=device-width, initial-scale=1"> 表示支持响应式 -
<meta name="apple-mobile-web-app-capable" content="yes" /> iPhone私有标签,它表示:允许全屏模式浏览 -
<meta name="apple-mobile-web-app-status-bar-style" content="black" /> iPhone私有标签,它指定的iPhone中safari顶端的状态条的样式 -
<meta name="format-detection" content="telephone=no; email=no" /> 不识别邮件和不把数字识别为电话号码 -
initial-scale :初始的缩放比 -
minimum-scale:允许用户缩放到最小比例 -
maximum-scale:允许用户缩放到最大比例 -
user-scalable:用户是否可以手动缩放
网关协议
BGP:边界网关协议 ICMP:控制报文协议 PPP:点对点协议 RIP:内部网关协议(IGP) BGP:外部网关协议
|