setTimeout、Promise、Async/Await 的区别
setTimeout、Promise和Async/Await是 JavaScript 中用于处理异步操作的三种不同方式。
setTimeout:
setTimeout是一个定时器函数，用于在指定的时间后执行回调函数。setTimeout是基于回调函数的方式来处理异步操作。- 它是一种比较传统的方式，使用起来相对简单，但可能存在回调地狱问题。
Promise:
Promise是一种提供更好的异步编程解决方案的对象。Promise可以代表一个异步操作的最终完成或失败，并返回结果值。- 它可以通过链式调用的方式，避免了回调地狱，代码更加清晰易读。
Promise可以使用resolve方法来处理异步操作成功的情况，使用reject方法来处理异常或失败的情况。
Async/Await:
Async/Await是基于Promise的语法糖，提供了一种更简洁、更易读的方式来处理异步操作。- 通过
async关键字定义的函数内部可以使用await关键字来等待一个Promise对象的状态变更，以便获取其结果。 Async函数会自动将其内部的操作封装成一个Promise对象，可以通过.then()和.catch()来处理结果或错误。
区别：
setTimeout是一种基于回调函数的异步方式，而Promise是一种基于Promise对象的异步方式，Async/Await是Promise的语法糖。setTimeout只能处理简单的异步操作，而Promise和Async/Await更适用于处理复杂的异步操作，例如多个异步任务的串行或并行执行。- 使用
setTimeout时，可能需要通过回调函数嵌套来处理多个异步操作，导致代码可读性较差，而Promise和Async/Await可以避免回调地狱问题，代码更加清晰易读。 - Promise和Async/Await提供了更好的错误处理机制，通过.catch()可以捕获异步操作中的异常情况，而setTimeout只能通过try-catch来捕获异常。
- Async/Await相对于Promise来说，语法更加简洁明了，使得异步操作的代码结构更加类似于同步操作的写法，易于理解和维护。
总的来说，setTimeout是一种简单的延时执行方式，Promise提供了更好的异步编程解决方案，而Async/Await则是Promise的一种更加简洁易读的写法。选择哪种方式取决于具体的使用场景和个人偏好。
计算属性 computed 和事件 methods 有什么区别
在Vue.js中，computed和methods都是用于定义Vue实例中的方法，但它们有一些区别。
- 计算属性 (computed)：
computed是Vue实例中的属性，用于计算和返回一个新的响应式属性。- 计算属性会根据依赖的响应式数据进行缓存，只有当依赖的数据发生改变时，计算属性才会重新计算。
- 计算属性可以像普通属性一样直接访问，不需要在模板中添加函数调用。
- 计算属性适用于基于已有的响应式数据进行复杂计算的场景，可以提高代码的可读性和性能。
- 事件方法 (methods)：
methods是Vue实例中的方法，用于定义处理用户交互事件的逻辑。- 方法可以在模板中通过指令或者事件绑定来调用。
- 每次调用方法时，都会执行其中的逻辑，无论是否依赖响应式数据的变化。
- 事件方法适用于处理用户交互、触发操作或者执行其他具有副作用的操作。
区别：
- 计算属性是基于依赖的响应式数据进行缓存并返回新的响应式属性，而事件方法是每次被调用时执行其中的逻辑。
- 计算属性可以像普通属性一样直接访问，而事件方法需要在模板中通过指令或者事件绑定来调用。
- 计算属性适用于对已有的响应式数据进行复杂计算的场景，而事件方法适用于处理用户交互、触发操作或者执行其他具有副作用的操作。
在实际使用中，如果需要根据已有的响应式数据进行复杂计算并返回一个新的属性，可以使用计算属性。如果需要处理用户交互、触发操作或者执行其他具有副作用的操作，可以使用事件方法。根据具体的业务需求和场景选择合适的方式来定义方法。
作用域相关知识点
作用域是指在程序中定义变量时，这个变量所存在的有效范围。
作用域相关的知识点包括以下几个方面：
1. 全局作用域 (Global Scope)
- 全局作用域是在整个程序中都可访问的作用域。
- 在全局作用域中声明的变量，可以在程序的任何地方被访问和使用。
2. 函数作用域 (Function Scope)
- 函数作用域是指在函数内部定义的变量所存在的有效范围。
- 在函数内部声明的变量，只能在函数内部被访问和使用。
- 函数作用域可以防止变量冲突和命名空间污染问题。
3. 块级作用域 (Block Scope)
- 块级作用域是指由一对
花括号（{}）包裹的代码块中定义的变量的有效范围。 - 块级作用域主要通过
let和const关键字来声明变量。 - 在块级作用域中声明的变量，只能在当前代码块内部被访问和使用。
4. 词法作用域 (Lexical Scope)
- 词法作用域是指变量的作用域是在代码写的时候就确定的，而不是在运行时确定的。
- 词法作用域通过函数的嵌套关系来确定变量的访问权限。
5. 作用域链 (Scope Chain)
- 作用域链是指内部函数可以访问外部函数中定义的变量。
- 当访问一个变量时，JavaScript引擎会首先在当前作用域中查找，如果找不到就会沿着作用域链向上查找，直到找到该变量或者到达全局作用域为止。
正确理解和使用作用域对于编写高质量的代码非常重要。合理划分作用域能够提高代码的可读性、可维护性和安全性，避免变量冲突和命名空间污染问题。
vue SSR实现过程
Vue SSR (服务器端渲染) 是一种将 Vue 组件在服务器上预渲染成 HTML 字符串，然后将其发送到客户端的技术。下面是 Vue SSR 的实现过程：
1. 创建一个 Vue 服务端实例
- 在服务器端创建一个新的 Vue 实例，并将要渲染的组件作为根组件传入。
- 可以使用
createApp方法创建 Vue 实例，并在其中注册组件、路由等。
2. 处理路由和数据
- 在服务器端接收客户端的请求，并根据请求的 URL 进行相应的路由处理。
- 如果有异步数据获取的需求，可以在路由处理前获取组件所需要的数据，可以使用
asyncData方法来处理预取数据。
3. 渲染组件
- 使用
renderToString方法将 Vue 实例渲染成 HTML 字符串。 - 在渲染过程中，Vue 会自动调用组件的
beforeCreate和created钩子函数，但不会触发组件的生命周期钩子函数。
4. 注入渲染结果
- 将渲染得到的 HTML 字符串注入到模板中，创建最终的 HTML 页面。
- 可以使用模板引擎或直接拼接字符串的方式将渲染结果注入到模板中。
5. 返回结果给客户端
- 将最终生成的 HTML 页面返回给客户端。
- 客户端接收到 HTML 页面后，会对其中的 Vue 实例进行激活，使页面具有交互功能。
需要注意的是，在 Vue SSR 的实现过程中，除了上述的基本步骤，还涉及到一些其他的内容，如处理样式、异步数据、路由管理等。此外，还可以使用中间件来优化 SSR 的性能和扩展性。
总体而言，Vue SSR 通过在服务器端预渲染组件，提供了更好的 SEO（搜索引擎优化）和首屏加载性能。
