Web前端最全Vue3-2-setup概述，web前端无经验怎么面试

算法

1. 冒泡排序

2. 选择排序

3. 快速排序

4. 二叉树查找: 最大值、最小值、固定值

5. 二叉树遍历

6. 二叉树的最大深度

7. 给予链表中的任一节点，把它删除掉

8. 链表倒叙

9. 如何判断一个单链表有环

   

由于篇幅限制小编，pdf文档的详解资料太全面，细节内容实在太多啦，所以只把部分知识点截图出来粗略的介绍，每个小节点里面都有更细化的内容！

如果你觉得对你有帮助，可以戳这里获取：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

1. 一般都返回一个对象: 为模板提供数据, 也就是模板中可以直接使用此对象中的所有属性/方法

2. 返回对象中的属性会与data函数返回对象的属性合并成为组件对象的属性

3. 返回对象中的方法会与methods中的方法合并成为组件对象的方法

4. 如果有重名, setup优先

注意:

1. 一般不要混合使用: methods中可以访问setup提供的属性和方法, 但在setup方法中不能访问data和methods，因为this还没创建出来

2. setup不能是一个async函数: 因为返回值不再是return的对象, 而是promise, 模板看不到return对象中的属性数据

• 父组件

测试文件

{{msg}}

---

• 子组件

{{msg}}

子组件{{showMsg2}}

/*

• setup执行了 undefined // 先执行setup 因为还未初始化完，所以this未定义

• beforeCreate执行了 // 创建el完成后执行回调beforeCreate

• Proxy {showMsg2: ƒ, …} // 父子组件渲染完成后执行回调

*/

3. setup的参数

setup(props, context) / setup(props, {attrs, slots, emit})

• props: 包含props配置声明且传入了的所有属性的对象

• attrs: 包含没有在props配置中声明的属性的对象, 相当于 this.$attrs

• slots: 包含所有传入的插槽内容的对象, 相当于 this.$slots

• emit: 用来分发自定义事件的函数, 相当于 this.$emit

• App.vue

测试文件

{{msg}}

---

<Child :msg=“msg” msg2=“context.attrs中测试文字” @X=“X”>

• Child.vue

{{msg}}

ref

---

1. 作用: 定义一个响应式的数据

2. 语法: const xxx = ref(initValue)

3. 返回的是一个ref对象，对象中value属性，如果需要对数据操作，通过ref对象调用value属性方式进行操作

4. 操作数据: xxx.value

5. HTML模板中操作数据: 不需要.value

6. 一般用来定义一个基本类型的响应式数据

{{str}}

{{count}}

reactive

---

1. 作用: 定义多个数据的响应式

2. const proxy = reactive(obj): 接收一个普通对象然后返回该普通对象的响应式代理器对象

3. 响应式转换是“深层的”：会影响对象内部所有嵌套的属性

4. 内部基于 ES6 的 Proxy 实现，通过代理对象操作源对象内部数据都是响应式的

{{user}}