2023面试vue项目
vue生命周期
vue2
beforeCreate
created
beforeMount
mounted
beforeUpdate
updated
beforeDestory
destoryed
vue3 缺少了初始化阶段,生命周期钩子+on,支持多个根节点
组合式API 逻辑和内容写到一起，增加代码的可读性，内聚性，还提供了比较完美的逻辑复用方案
onBeforeMount
onMounted
onBeforeUpdate
onUpdated
onBeforeUnmount
onUnmounted
一进来发送请求，应该在哪个阶段？
在vue2中可以在created阶段发请求，但是实际应用都需要页面加载完成后发请求都在mounted挂载阶段发请求
created阶段视图中html并没有渲染出来，直接操作dom肯定找不到相关元素
vue3在哪发
vuex
五大属性
state
如何监听state的状态
mutations 同步操作，将数据信息写在全局数据状态中进行缓存
如何在mutitions更改state的值
actions 可以直接更改状态吗？ 进行异步操作用于提交接收后台数据
getters
modules
闭包
闭包就是一种引用关系，内部函数调用外部函数变量
作用：让函数外部能操作内部的局部变量
延长变量生命周期
缺点：造成内存泄漏，导致爆栈
释放闭包，给该变量一个null
爆栈存在哪里
闭包应用场景
1setTimeout 定时器
防抖 节流
2回调
定义一个行为，把他关联到某个用户事件上
存储哪些东西，如何访问闭包 vue3哪些官方的api使用到闭包
var const let作用域
var存在预解析 全局作用域和局部作用域
let/const 块级作于域
什么是块级作用域
if小括号 大括号是什么作用域 {}块级作用域
margin塌陷什么情况下会出现
1.同级元素塌陷
垂直布局，盒子上 margin-bottom 和盒子下margin-top 折叠，按最大值来计算
解决：不让这两个边距同时出现
2.父子元素塌陷
子元素设置margin-top，父子粘在一起
解决：给父元素设置overflow:hidden
实际为BFC触发即可 - overflow: hidden
- display: inline-block
- position: absolute
- position: fixed
- display: table-cell
- display: flex
浮动的塌陷margin还有效果
效果：竖着的元素横着
浮动会使父元素高度塌陷
万能解法
.name:after{
content:"";
display:block;
width:0;
height:0;
clear:both/left/right;
overflow:hidden;
visibility:hidden;
}
应用场景：文字环绕
盒模型border-box 和content-box的区别及应用
box-sizing的两个值，两种不同的盒模型
content-box 元素的宽高就是width 和height 一般的div默认的box-sizing都是这个属性
border-box 元素的宽度=width-padding左右-boredr左右 适合水平布局，多个div各占50%，
无论怎么样设 置border和padding横向布局都不会被挤到下一行
原型链
实例对象和原型对象之间的链接，每个函数对象都有以一个prototype属性，即原型对象，
通过new构造函数创建实例对象，这个实力对象会有一个指针（__proto__）指向它的构造函数的的原型对象
作用：实现继承，简化代码，提高代码复用。只要是这个链条上的内容，都可以被访问和使用
原型应用场景
1.在[vue项目]中，我们通常会将对象公共属性放在vue原型上；
或者使用插件，将其挂载到vue原型上；这都是利用原型来实现的。
2判断数据类型 Object.prototype.toString.call()方法
instanceof 是用来 判断数据是否是某个对象的实例，返回一个布尔值
ts有几种类型
布尔值
字符串
let name: string = `Gene`;
let age: number = 37;
let sentence: string = `Hello, my name is ${ name }.I'll be ${ age + 1 } years old next month.`;
数组
let list:Array<number> = [1,2,3]
let list:number[]=[1,2,3]
对象
元组
枚举
any 为在编程阶段不确定变量类型时使用
null
void 没有类型，函数没有返回值时使用
undefined
never never类型表示的是那些永不存在的值的类型
never类型是任何类型的子类型，也可以赋值给任何类型；
然而，没有类型是never的子类型或可以赋值给never类型（除了never本身之外）。
即使 any也不可以赋值给never
object 只是允许你给它赋任意值 - 但是却不能够在它上面调用任意的方法，即便它真的有这些方法
TypeScript声明全局类型
- 创建一个
global.d.ts文件并在全局命名空间中声明类型。 - 添加需要全局访问的类型或接口。
- 使用
export {}使文件成为模块。
在项目的 src 目录中，创建一个包含以下 global.d.ts 文件的 types 目录。
export {};
declare global {
/** * 现在声明进入全局命名空间的类型，或者增加全局命名空间中的现有声明。 */
interface Employee { id: number; name: string; salary: number; }
type Person = { name: string; age: number; };
}
