以下面试题都是我最近遇到的,答案可能不详细,可以自行去搜索理解,我只写出了大概
一.vue项目中父子组件怎么传值?
1、路由配置:使用children属性实现路由嵌套,嵌套的组件关系就是父子组件关系
2、组件传值-父组件向子组件传值
3、组件传值-父组件把方法传递给子组件
4、组件传值-子组件通过事件调用向父组件传值
5、父子组件之间相互传值
二.active-class 是哪个组件的属性?
active-class是vue-router模块的router-link组件中的属性,用来做选中样式的切换
三.怎么定义 vue-router 的动态路由? 怎么获取传过来的值?
在router目录下的index.js文件中,对path属性加上/:id。
使用router对象的params.id。($route.params.id)
四.vue-router 有哪几种导航钩子(导航守卫)?
1、全局守卫: router.beforeEach
2、全局解析守卫: router.beforeResolve
3、全局后置钩子: router.afterEach
4、路由独享的守卫: beforeEnter
5、组件内的守卫: beforeRouteEnter、beforeRouteUpdate (2.2 新增)、beforeRouteLeave
五.javascript的内置类型有哪些?
空值(null)、未定义(undefined)、布尔值(Boolean)、数字(number)、字符串(string)、对象(object)、符号(symbol,ES6新增)
六.JavaScript的相等运算符==与===之间的区别是什么?
在JS中,"==="叫做严格运算符,"=="叫做相等运算符。它们的区别是相等运算符(==)比较两个值是否相等,严格相等运算符(===)比较它们是否为“同一个值”。如果两个值不是同一类型,严格相等运算符(===)直接返回false,而相等运算符(==)会将它们转化成同一个类型,再用严格相等运算符进行比较。
七.简述用var,let和const声明变量之间的区别?
1,let 是块级作用域,函数内部使用let 定义后,对函数外部无影响,如果不初始化输出的话,会报语法错误
2,const 是全局作用域,const 声明的变量,不可以直接修改,必须初始化,const 一般用在数组的定义和修改中
3,var 全局变量,声明的变量可以修改,如果不初始化输出的话,会报undefined,但不会报错
八.描述vue组件生命周期的每个阶段(不用考虑包含子组件的情况)
1、 创建前(beforeCreate):对应钩子函数是 beforeCreate, 组件实例被创建之初,组件的属性⽣效之前。实例初始化阶段,数据观察和事件机制都还没有形成,不能获取到DOM 节点
2、 创建后 (created): 对应钩子函数是Created, 组件实例已经完全创建,属性也绑定,但真实 dom 还没有⽣成,$el 还不可⽤。(vue 实例已创建,但是还是不能获取 DOM 节点)
3、 载入前 (beforeMount): 对应钩子函数 beforeMount, 在挂载开始之前被调⽤:相关的 render 函数⾸次被调⽤。仍然不能获取 DOM 元素,此时 vue 的根元素已经创建,下面 vue 对 DOM 的操作将围绕这个根节点展开。beforeMount 是过渡性阶段,一个项目一般只能用一次
4、 载入后 (mounted): 对应钩子函数 mounted,el 被新创建的 vm.$el 替换,并挂载到实例上去之后调⽤该钩⼦。 使用得最多的钩子函数, 一般的异步请求都写在这里,此时的vue 和 DOM 都已经渲染出来了
5、 更新前 (beforeUpdate): 对应钩子函数 beforeUpdate, 组件数据更新之前调⽤,发⽣在虚拟 DOM 打补丁之前。VUE 遵循数据驱动 DOM 的原则, beforeUpdate 函数在数据更新后虽然没有立即更新数据,但是 DOM 的数据会改变,这是 VUE 双向数据绑定的作用
6、 更新后 (updated): 对应钩子函数 updated,组件数据更新之后。DOM 会同步更改过的内容
7、销毁前 (beforeDestroy): 对应钩子函数 beforeDestroy, 组件销毁前调⽤。在上一阶段 VUE 已经成功通过 数据驱动DOM 更新,当我们不再需要 VUE 操纵 DOM, 就需要销毁,也就是清除 VUE 与 DOM 的关联,调用 destroy方法 可以销毁当前组件,在销毁前,会调用 beforeDestroy 钩子函数
8、 销毁后 (destroyed): 对应钩子函数 destroy, 组件销毁后调⽤。销毁后,会调用 destroyed 钩子函数
九.数组去重有几种方法
1.利用ES6中的 Set 方法去重
2.使用双重for循环,再利用数组的splice方法去重(ES5常用)
3.利用数组的indexOf方法去重
4.利用数组的sort方法去重(相邻元素对比法)
5.利用对象的属性不能相同的特点去重(不建议用,有缺陷)
6.利用数组的includes去重
7.利用数组的filter方法去重
8.利用函数递归去重
9.利用ES6中的Map方法去重
十.前端如何优化网站性能
1、减少 HTTP 请求数量
2、控制资源文件加载优先级
3、利用浏览器缓存
4、减少重排(Reflow)
5、减少 DOM 操作
6、图标使用 IconFont 替换