js基础
1)对js的理解？ 2)请说出以下代码输出的值？ 3)把以下代码，改写成依次输出0-9 4)如何区分数组对象，普通对象，函数对象 5)面向对象、面向过程 6)面向对象的三大基本特性 7)XML和JSON的区别？ 8)Web Worker 和webSocket？ 9)Javascript垃圾回收方法？ 10)new操作符具体干了什么呢？ 11)js延迟加载的方式有哪些？ 12)WEB应用从服务器主动推送Data到客户端有那些方式？
<router-link :to="{
//你要去到哪个组件
path:'/home/message/detail' ,
query:{
id:m.id,
title:m.title
}
}">
{{m.title}}
2.接收参数
$route.query.id
$route.query.title
6.给路由命名
当多级路由时给上name名可以简化跳转，一级路由给不给name没有多大影响
routes:[
{
//给路由命名 跳转时直接用name:命名 不用path
name:'nameabout',
path:'/about',
component:About
},
{
path:'/home',
component:Home,
// 二级路由
children:[
{
//这里不用加斜
path:'news',
component:News,
},
{
//这里不用加斜
path:'message',
component:Message,
children:[
{
//多级路由给name 可以简化跳转
name:'namedetail',
path:'detail',
component:Detail
}
]
}
]
}
]
2.简化跳转
<router-link :to="{
//你要去到哪个组件
//直接使用name 不用path路径
name:'namedetail' ,
query:{
id:m.id,
title:m.title
}
}">
{{m.title}}
6.路由的params参数
1.配置路由,声明接收params参数
routes:[
{
name:'nameabout',
path:'/about',
component:About
},
{
path:'/home',
component:Home,
// 二级路由
children:[
{
//这里不用加斜
path:'news',
component:News,
},
{
//这里不用加斜
path:'message',
component:Message,
children:[
{
name:'namedetail',
path:'detail/:id/:title', //使用占位符声明接收params参数
component:Detail
}
]
}
]
}
]
2.传递参数
{{m.title}}
<router-link :to="{
//你要去到哪个组件
name:'namedetail' ,
params:{
id:m.id,
title:m.title
}
}">
{{m.title}}
特别注意：路由携带params参数时，若使用to的对象写法，则不能使用path配置项，必须使用name配置！
3.接收参数
$route.params.id
$route.params.title
7.路由的props配置
作用：让路由组件更方便的收到参数
{
name:'namedetail',
path:'detail/:id/:title', //使用占位符声明接收params参数
component:Detail,
// props的第一种写法 ，该对象中的所有key-value都会以props的形式传给Detail组件
props:{
a:1,
b:'helloworld'
}
// props的第二种写法：值为布尔值 Boolen 若布尔值为真，就会把该路由组件收到的所有params参数，以props的形式传给Detail组件
props:true
// props的第三种写法：值为函数
props($route){
return {
id:$route.query.id,
title:$route.query.title
}
}
}
6.缓存路由组件
1.作用：让不展示的路由保持挂载，不被销毁
2.具体编码：
7.两个新的生命周期钩子
1.作用：路由组件所独有的两个钩子，用于捕获路由组件的激活状态
2.具体名字：
1.activated 路由组件激活时触发
2.deactivated 路由组件失活时触发
7.路由守卫
全局前置路由守卫
// 前置路由守卫
router.beforeEach((to,from,next)=>{
// console.log(to)
// console.log(from)
next()
if(to.meta.isAuth){
if(localStorage.getItem('school')=== 'aiguigu'){
next()
}else{
alert("请登录")
}
}
})
全局后置路由守卫
// 后置路由守卫
router.afterEach((to,from) =>{
console.log(to,from)
})
独享路由守卫
{
//这里不用加斜
name:'xinwen',
path:'news',
component:News,
meta:{isAuth:true},
// 独享路由守卫
beforeEnter:(to,from,next)=>{
if(to.meta.isAuth){
if(localStorage.getItem('school')=== 'aiguigu'){
next()
}else{
alert("请登录")
}
}
}
},
8.组件内守卫
// 组件路由
// 通过路由规则,进入该组件时被调用
beforeRouteEnter(to,from,next){
console.log('我进来了',to)
},
// 通过路由规则,离开该组件时被调用
beforeRouteLeave(to,from,next){
}
9.路由器的两种工作模式
1.对于一个url来说，什么是hash值？ ——#及后面的内容就是hash值
最后
面试一面会问很多基础问题，而这些基础问题基本上在网上搜索，面试题都会很多很多。最好把准备一下常见的面试问题，毕竟面试也相当与一次考试，所以找工作面试的准备千万别偷懒。面试就跟考试一样的，时间长了不复习，现场表现肯定不会太好。表现的不好面试官不可能说，我猜他没发挥好，我录用他吧。
开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】
96道前端面试题：
常用算法面试题：
前端基础面试题： 内容主要包括HTML，CSS，JavaScript，浏览器，性能优化
