1、vue生命周期（钩子函数）和父子组件的生命周期加载顺序childdestroy-parent-beforeMounted-parentmounted-...如果有keep-alive，钩子函数又多了一个activated和deactivated。引入keep-alive时，页面第一次进入，钩子的触发顺序是create->mounted->activated，退出时Triggerdeactivated。重新进入（向前或向后）时，仅触发激活。https://www.cnblogs.com/lanwp...在哪个语句循环中不能调用方法？1.beforeCreated：这一步只是初始化了一些内部事件和声明周期，数据和方法还没有。2.Created：在这一步之前已经完成了数据注入和响应数据。这时候vue实例已经代理了数据，可以通过this.$data获取数据3.beforeMount：编译前-没有实际的，确保有编译元素，如果没有就不走down4.mounted：真正的dom被渲染，可以操作dom5,beforeUpdate时依赖的数据只有变化后才能更新，非依赖的更新不会响应，一般不用，最好用watch6、updated：更新后7、beforeDestory：在组件销毁前，移除监听器和事件监听器等，此时修改数据等待不会再次改变。您可以在此处清除计时器或事件绑定。8.destroyed：销毁后2.js中的事件循环和闭包？主线程从“任务队列”中读取事件，这个过程是连续不断的，所以整个运行机制也称为EventLoop（事件循环）。这是计算机系统的一种运行机制。JavaScript语言就是利用这种机制来解决单线程运行带来的一些问题。宏任务：script、setTimeout、setInterval微任务：promise、async/await、process.nextTick先执行宏任务。在宏任务中遇到微任务时，先执行微任务，执行完微任务后再执行宏任务。这个过程不断循环。3.大量if和switch优化使用数组下标匹配或对象键值属性匹配4.动态表单的实现a．模板b中的if和else循环判断。render中的if或switch循环判断渲染不同的组件c.1、针对不同的类型封装不同的组件。2.然后在某个js中统一导出默认别名。3.component标签的is属性用于加载不同的组件。详情：http://www.3qphp.com/web/javascript/4770.html5.父子组件、兄弟组件路由、props、$emit、vuex、storage、window、provide/inject兄弟组件可以传参with第三方组件的帮助。vue.prototype.bus=newBus();//变量$bus注册事件$on//传值$emit//销毁$offhttps://blog.csdn.net/weixin_...6、http和https的不同https数据加密7.JS将字符串转为函数（涉及webpack压缩打包后编译）a.newFunction()b.eval()例子：letfuncStr="functiontest(value){alert(value)}";lettest=eval("(false||"+funcStr+")");test("函数可以执行");8、babel的使用：babel-eslint语法转换9、原型链10、vue源码相关要点11、v-model双向绑定原理等价于：{constpage=Math.floor(index/3);if(!pages[page]){pages[page]=[]}pages[page].push(item)})returnpages}27.setTimeout定时器为0时的执行顺序是什么？console.log(1)setTimeout(()=>{console.log(2)},0)newPromise((resolve,reject)=>{console.log('newpromise')resolve()}).then(()=>{console.log('then')})console.log(3)打印顺序：1，newpromise，3，then，2setTimeout是单线程的，类似异步，但不是异步。28.冒泡排序29.性能优化1.CSS优化2.JS代码优化3.接口请求优化，（接口重复请求）防抖节流4.代码打包压缩优化5.使用this.$refs减少获取Domnode消耗30，sort排序31，数组去重，不使用doublefor循环newSet()filter，find，findIndex，includes32，判断数据类型typeofconstructor33，匿名槽，命名槽，作用域槽不设置名字，直接默认情况下将插槽设置??为匿名插槽，并将名称设置为命名插槽。普通槽渲染的位置是在它的父组件中，而不是在子组件中。作用域槽渲染在子组件作用域槽中：slot-scope34、递归与闭包，递归是否属于闭包？闭包和递归的区别：相似点：1）都是函数2）函数在函数内部调用区别：1）闭包函数调用的内部函数需要引用外部函数的变量和参数；递归函数自己调用Self，不需要引用变量和参数2）闭包函数调用一次结束调用，满足递归条件需要调用多次递归函数3）闭包函数会比其他函数占用更多内存https://www.cnblogs.com/mlw1814011067/p/11648290.html闭包是递归的35.websocket心跳监控：定时器setInterval每隔几秒监控websocket连接是否正常，如果断开连接，调用方法重新连接。36.大屏可视化如何适配不同尺寸？设置最大宽高、flex布局、百分比设置37、diff算法？38.什么是热更新？如何实现模块热更换？HMR的原理？如何设计热模块更换？跟前端路由器有什么区别？提示：locationhash和historyhash模式在地址栏中有一个#，而history没有。hash方式主要依赖onhashchange事件监听location.hash的变化。虽然hash存在于url中，但它不会包含在http请求中，因此更改hash不会使页面重新加载；history模式使用了html5中的pushstate和replacestate方法。pushstate方法可以在不发送请求的情况下改变url地址。replacestate方法可以读取历史栈，修改浏览器记录。39.路由的相关方法，如何实现动态路由？40.如何实现权限控制？按钮级权限？41、stringify序列化对象时，对象属性为function、null、undefined时结果如何？42.es6的新特性？展开运算符...可以浅克隆对象注意：const定义的常量数组对象中的数据仍然可以修改，因为这是一个引用对象，修改后的数据指针保持不变，但是数组和对象本身不能被改变。43、如果直接通过数组下标修改数组值，页面会更新渲染吗？答：可以修改值，但是不会更新页面dom。因为太耗性能，vue2没有实现这个功能。需要通过$setclickBtn(index){this.list[index].showFlag=!this.list[index].showFlag//添加下面这行代码this.$set(this.list,index,this.list[index])}44.div里面有img和text。如何设置让图片和文字水平居中45.路由的懒加载：在刚开始进入页面的时候，不需要一次性加载所有的资源，需要的时候再加载相应的资源。路由配置中的组件是惰性加载的，只有在需要的时候才会加载。我们通常会在路由中定义很多不同的页面。如果不应用延迟加载，很多页面会被打包到同一个js文件中，文件会异常的大，导致进入首页时加载的内容太多，时间过长，短-活浏览器可能会出现空白页面，从而降低用户体验，而使用路由的懒加载，就是将每个模块单独打包，在用户查看时加载对应的模块，减少加载时间。实现方式：路由懒加载的主要作用是将路由对应的组件一一打包成js代码块。只有访问路由时，才会加载对应组件的代码块。vue实现路由懒加载的三种方式：1.vue异步组件2.ES6import例如：importLoginfrom'@/components/Login'3.webpack的require.ensure()46、forEach和map的区别？47.清浮？Parent:clear:bothoverflow:hidden48,debounceandthrottle?throttling：n秒只运行一次，n秒内重复触发，只有一次生效，routerhook函数1、全局hook(2)1、beforeEach(to,from,next)2、afterEach(to,from)router.afterEach((to,from)=>{console.log(to);//到达路由console.log(from);//出发路由})2.单路由hook(2):只要因为是用来指定具体路由跳转时的逻辑，所以写在路由配置中beforeEnter()beforeLeave()3.组件内部hooks(3)beforeRouterEnter(to,from,next)//在对应路由之前调用thatrendersthecomponentisconfirmed//获取不到组件实例this，因为在钩子执行之前，组件实例还没有被创建。beforeRouterLeave()//示例：当页面中有需要保存的信息时，防止页面跳转，让用户先保存信息。beforeRouterUpdate()：下次更新前4.冒泡和捕获事件，如何防止冒泡5.小程序的生命周期，小程序从运行到页面加载要经历什么过程？使用生命周期（写在app.vue中）onLanuch()//小程序的第一次6.ts接口如何返回一个联合类型？7.flex:1代表什么？flex:1是flex:11auto;弹性增长：1；伸缩收缩：1；弹性基础：自动；flex:1其实就是三个属性的缩写：flex-grow:1;弹性收缩：1弹性基础：自动；flex-grow的作用是表示当前元素有多少份额。8、如何解决浮点数的精度问题？本质上，浮点数在计算机中仍然以二进制01的形式存储。在处理此类问题时，基本思路是将浮点数转化为整数进行计算，然后调整整数的小数点，返回正确的浮点数。结果。1.自定义转换处理函数Math.formatFloat=function(f,digit){varm=Math.pow(10,digit);returnMath.round(f*m,10)/m;}9.电话号码正则表达式？/^(0|86|17951)?(13[0-9]|15[012356789]|17[678]|18[0-9]|14[57])[0-9]{8}$/10.Vue指令全局自定义指令Vue.directive()组件自定义：directives:{}//指令是一个钩子，有一组生命周期：created//在绑定元素的属性或事件监听器应用之前调用beforeMount//在绑定元素的父组件挂载之前调用mounted//在绑定元素的父组件挂载时调用beforeUpdate//在更新包含组件的VNode之前调用更新//更新包含组件及其子组件的VNode在组件的VNode更新后调用beforeUnmount//在绑定元素的父组件卸载前调用unmounted//在绑定元素的父组件卸载时调用
