Mr.slash-优快云博客

原创 Promise-04-async和await

摘要：async/await是处理异步操作的语法糖。async函数总返回Promise：直接返回值会被包装为已解决的Promise；返回Promise则保持原状态；抛出错误则为拒绝状态。await必须用在async函数中，用于等待Promise解决，获取其值。若Promise被拒绝，需用try-catch捕获。await也可用于非Promise值，会被自动包装为已解决的Promise。这种写法使异步代码更接近同步形式，提升可读性。

2025-06-21 17:07:50 108

原创 Promise-03-静态方法

Promise静态方法包括： resolve(data) - 返回完成状态的Promise reject(reason) - 返回拒绝状态的Promise all(任务数组) - 全部成功则成功，任一失败则失败 any(任务数组) - 任一成功则成功，全部失败才失败 allSettled(任务数组) - 全部完成则成功（永不失败） race(任务数组) - 首个完成的任务决定状态这些方法用于处理多个异步操作的不同场景需求。

2025-06-21 16:11:23 118

原创 Promise-02-链式调用

Promise链式调用的核心机制：then方法返回新Promise，其状态取决于后续处理。若无处理则继承前任务状态；若处理未执行则挂起；若执行则根据结果决定新任务状态（成功返回值为数据，失败返回异常对象，若返回任务对象则同步状态）。常见链式调用形式包括：pro.then().catch()用于成功/失败分支处理，pro.then().then()实现顺序执行，pro.then().then().catch()进行全流程错误捕获。这种机制实现了异步任务的顺序执行和异常处理。

2025-06-21 14:34:26 213

原创 Promise-01-基础

摘要：Promise解决了异步编程中的回调地狱问题，提供了一种更清晰的异步处理方式。根据PromiseA+规范，Promise对象具有未决和已决两个阶段，以及挂起、完成和失败三种状态。任务完成时会调用resolve，失败则调用reject。ES6的Promise API通过new Promise创建任务对象，并通过then方法处理完成和失败状态。示例代码展示了如何随机生成成功或失败的异步任务，并分别处理这两种结果。这种机制使异步代码更易读和维护。

2025-06-21 10:18:11 285

原创 07-vue2实例生命周期

1、created：加载从后端请求来的数据。2、mounted：直接操作dom的时候。3、destroyed：清除计时器时用到。

2025-06-16 08:59:01 353

原创 06-vue2路由

Vue路由使用指南：介绍了Vue路由的基本概念和使用方法，包括路由安装、基础配置、路由模式选择（hash/history）、导航组件RouterLink的使用及其激活状态控制，以及命名路由的实现。通过配置路由规则，将不同路径映射到相应组件，并使用<router-view>渲染组件。还详细说明了路由匹配规则和导航链接的类名控制，帮助开发者实现页面无刷新切换。

2025-06-13 22:08:42 886

原创 05-vue2插槽

插槽是Vue组件中用于内容分发的重要机制，分为默认插槽和具名插槽两种形式。默认插槽通过<slot>标签在子组件中预留位置，父组件传入的内容会直接替换该占位符。当需要多区域内容分发时，使用具名插槽，通过name属性区分不同位置，父组件用v-slot:name（可简写为#name）定向填充对应插槽。默认插槽名为"default"，其模板标签可省略。这种机制实现了组件模板的灵活定制，使父组件能够精确控制子组件中各部分内容的显示。

2025-06-08 18:09:21 382

原创 03-vue2计算属性

Vue计算属性是具有缓存的响应式方法，包含getter/setter。getter用于返回计算结果并自动跟踪依赖，setter用于处理赋值。通常使用简写形式，只需定义getter。与方法的区别在于：计算属性是数据（可读可写），通过缓存优化性能；方法则是操作（无缓存），参数更灵活。计算属性适合根据已有数据派生新数据，但不建议包含异步或非确定性操作。选择使用时主要考虑语义差异：需要数据时用计算属性，需要操作时用方法。

2025-06-06 17:06:54 169

原创 02-vue2组件

组件的出现是为了解决两个问题：1、降低整体复杂度，提升代码的可读性和可维护性2、提升局部代码的可维护性绝大部分情况下，一个组件就是页面中某个区域，组件包含该区域的：功能（js代码）内容（模板代码）样式（css）

2025-06-05 23:54:58 472

原创 01-vue2核心概念

Vue通过虚拟DOM技术优化渲染流程，将模板编译为虚拟节点树(vnode)，再转换为真实DOM。核心流程包括：实例创建、数据注入、模板编译、虚拟DOM生成、挂载到页面。当数据变化时，Vue会对比新旧虚拟DOM树，仅更新差异部分。主要配置项包括：data存储界面数据，computed处理计算属性，methods定义方法，template/render生成虚拟DOM，el指定挂载目标。常用指令如v-bind绑定属性，v-for循环渲染，v-on绑定事件，通过响应式机制实现数据驱动视图更新，提升渲染效率。

2025-06-03 23:02:58 463

原创浏览器渲染原理

浏览器渲染流程包括：解析HTML/CSS生成DOM/CSS树，样式计算确定节点最终样式，布局生成几何信息，分层优化处理，绘制生成指令集，分块和光栅化处理图像，最后由合成线程完成屏幕成像。reflow是重新计算布局树，repaint是重新生成绘制指令。transform效率高因其仅影响合成线程的最终绘制阶段，不干扰主线程。整个过程涉及多线程协作，通过分层和异步处理优化性能。

2025-05-24 16:29:13 318

原创浏览器的事件循环

浏览器的进程模型涉及多个进程和线程的协同工作。每个程序运行需要专属的内存空间，称为进程，进程间相互独立。线程是运行代码的执行者，一个进程至少有一个主线程，可以创建更多线程以执行多任务。浏览器作为多进程、多线程应用，启动时会自动创建多个进程，如浏览器进程、网络进程和渲染进程，每个进程内部又有多个线程处理不同任务。渲染主线程负责执行HTML、CSS、JS代码等，通过消息队列调度任务，采用异步处理避免阻塞，确保浏览器流畅运行。

2025-05-21 22:41:34 670