自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(54)
  • 收藏
  • 关注

原创 vue3 知识点 捋一遍。

异步组件会被打包工具(Webpack/Vite)自动分割为独立文件import() 会触发更彻底的 Tree Shaking, 且只在需要时加载组件代码(如路由切换时)// 方式1:直接传入加载函数// 方式2:配置对象形式delay: 200, // 延迟显示 loadingtimeout: 3000, // 超时时间(毫秒)suspensible: false // 是否由 Suspense 控制})

2025-04-27 11:20:57 1020

原创 微前端随笔

js-entry通过es-module 或 umd 动态插入 js 脚本 ,在主应用中发送请求,来获取子应用的包,该子应用的包主应用直接执行该脚本,拿到子应用包。该包中暴露了主应用规定的那几个生命周期函数,

2025-04-06 23:12:06 649

原创 浏览器 路由详解

后hashchange。

2025-04-06 22:11:25 309

原创 vue2 vue3 响应式差异

总结: object.defineproperty()是对属性的劫持,对属性劫持有两大缺陷。2. 后添加的属性,无法获得响应式,因为劫持是初始化时完成的。1. 需要遍历对象的所有属性,深层属性需递归,存在效率问题。vue3最主要的区别就是在这,其他思想和vue2 一样。

2025-04-06 20:56:23 267

原创 Set,Map,WakeSet,WakeMap

Set、Map、WeakMap 和 WeakSet 是 ES6 引入的高级数据结构,它们的底层实现和特性与传统的对象和数组有显著差异强弱引用了解: link

2025-03-30 16:51:24 267

原创 js 强引用 ​弱引用

在 JavaScript 中,​​和​是两种不同的对象引用机制,它们直接影响垃圾回收(Garbage Collection)的行为。

2025-03-30 16:15:26 415

原创 webpack5 小记

webpack 于2012年发布es6 2015年发布webpack 初期主要目的解析和打包 ​CommonJS​ 和 ​AMD​ 模块,将它们转换为浏览器可用的代码 ,es6 的出现淡化了这一功能。模块隔离,将每个模块封装在一个函数作用域中,避免模块内的变量泄露到全局。支持非 JavaScript 资源。

2025-03-27 18:05:27 487

原创 JS 装饰器

JavaScript 装饰器是一种声明式元编程工具,通过高阶函数和属性描述符操作,允许开发者以非侵入方式动态修改类或方法的行为,平衡了代码简洁性与灵活性。声明式:用 @ 语法修饰类或方法,直接声明其增强行为,而不需要手动修改被装饰目标的内部逻辑。@log // 声明式地添加日志功能元编程:指编写能够操作其他程序(或自身)的程序TypeScript/Babel 等工具在编译阶段处理 @装饰器逻辑,转换为高阶函数调用原始代码:@decorator转换后。

2025-03-27 17:02:30 876

原创 redux ,react-redux,redux-toolkit 简单总结

Redux、React-Redux 和 Redux Toolkit 是协同工作的三个库,各自承担不同角色,相互协同。​React-Redux:连接 React 组件与 Redux Store。Redux Toolkit:效率工具,对上面二者封装了最佳实践。Redux:基础底座。

2025-03-26 18:07:25 257

原创 redux-tooltik

redux-tooltik 是官方效率工具,通过封装最佳实践(如自动生成 Action/Reducer、内置 Immer 和异步处理)简化 Redux 使用。Immer库 简介:Immer 使修改看似是“直接赋值”,但 Immer 会返回一个全新的不可变对象,原始状态保持不变。

2025-03-26 17:22:29 277

原创 rudux中间件

通过 Redux-Thunk,Redux 的 Action可以是一个函数,异步逻辑封装函数中,函数最后返回拿到结果的action对象,给reducer 的switch 用。它位于 Action 到达 Reducer 之前,可以拦截、处理或增强 Action。在没有 Redux-Thunk 的情况下,Redux 的 Action。不用 Redux-Thunk ,如何处理异步事件。1:直接在组件中处理异步(适用于简单场景)缺点:业务逻辑耦合在组件中,难以复用和测试。❓ 为什么需要 Redux-Thunk?

2025-03-26 16:34:13 493

原创 es6 fetch

​问题:调用 response.json() 或 response.text() 后,响应体会被标记为已使用,再次读取会报错。问题:fetch 仅在网络故障(如无法连接)时 reject,但 HTTP 错误(如 404、500)会正常返回响应。​问题:发送 JSON 数据时需手动调用 JSON.stringify(),而 axios 等库会自动处理。告知接收方(如服务器或浏览器)​传输的数据是什么类型,例如:JSON、HTML、表单、图片等。​问题:跨域请求默认不发送 Cookie,可能导致身份验证失败。

2025-03-25 23:08:48 445

原创 Redux,React-redux。基础

状态管理库,集中式存储状态,管理状态。

2025-03-24 13:55:30 349

原创 简单实现 react-redux

【代码】简单实现 react-redux。

2025-03-24 01:23:13 65

原创 简单实现redux

【代码】简单实现redux。

2025-03-24 01:22:23 104

原创 react 杂记2 优化hook

useRef 是一个多功能的 Hook,主要用于在函数组件中​​保存可变值​​,且​重新渲染​​。

2025-03-23 23:28:58 968 1

原创 css-in-js

开发者编写 CSS-in-JS → Webpack + Babel 编译 → 生成 JS/CSS 文件 → 浏览器加载 JS → 运行时注入样式 → 组件渲染。

2025-03-21 17:46:39 424

原创 react18 核心知识点杂记1

render 的 React.createElement 返回如下 轻量级虚拟 DOM 对象 (或称:React 元素对象)

2025-03-17 16:43:34 888

原创 js核心运行逻辑

var 会将变量提升到循环外部,每个循环体访问的都是同一变量。来存储变量,访问的都是独有的变量。let会在词法作用域。

2025-03-15 23:20:48 93

原创 vue2 全局指令调用组件

文件内的展示隐藏方法。

2024-11-20 17:37:20 364 1

原创 前端 移动端 手机调试 (超简单,超有效 !)

移动端调试

2024-06-09 18:30:23 392

原创 vue2 响应式原理(超简洁版)

网络上的相关文章又干又长,大多数时候只想知道vue2响应式的运转框架,不关注太多细节的东西,所以自己总结了这篇。

2024-04-19 19:50:52 386 1

原创 createApp 流程 (创建渲染器,调用mount)

createApp 干了什么?

2023-12-13 18:08:03 2464

原创 路由的 base 和webpack的publicPath(vite的base)区别

打包文件放置在dist目录下, _dirname 为当前文件在电脑中的绝对路径名,/a/b/dist, /a/b/就是 _dirname,path.resolve()通过这两个参数就能指定打包后dist文件放在项目的哪个位置。如果规定路径为“/my-app”,则从nginx/html/my-app/的目录下开始解析。所以通过上面的链接,能在服务器的 webApp 文件夹下拿到 子应用的所有js文件,这样vue 就能被加载出来,处理前端路由等工作。开头的路径,且服务器没有该资源时,重定向到。

2023-08-30 17:41:37 3159

原创 Echarts 数据更新 带动画

Echarts 数据更新 带动画

2023-06-14 14:00:21 721

原创 vue3 vite ts :eslint & prettierrc 配置

文件,如果不是js后缀,改成cjs,将以下文件替换进去。安装 eslint & prettierrc。package.json中,新增全局校验命令。

2023-05-31 16:04:29 728

原创 vue3 通信方式

/ 父组件 < child @事件 A = 'lb1' > < / child > lb1 =('回传参数1' , '回传参数2') => {// 子组件 // defineEmit 无需引入 let $emit = defineEmit([ '事件A' ]) // 创建emit实例 const fn2 =() = {$emit('事件A' , '参数1' , '参数...') }

2023-05-23 14:37:39 135

原创 动态引入图片为什么要加require?

答:因为动态添加src被当做静态资源处理了,而静态资源是会webpack编译的,不加require的src是不会编译src里的地址,而assets里的图片经过wabpack编译为dist后,地址已经变了,所以引入地址,资源地址在编译后对不上了。

2023-05-19 18:18:38 1644

原创 window.history对象

如果当前活动的历史记录项是被 pushState 创建的,或者是由 replaceState 改变的,那么 popstate 事件的状态属性 state 会包含一个当前历史记录状态对象的拷贝。每个标签都有一个独立的历史记录,里面维护着一条或多条记录。每条记录保存了对应 URL 的一些状态,仅能在当前页面的 window.history 对象读取到。

2023-05-12 14:27:28 1578

原创 grid布局

写在父元素grid-template-columns :定义列宽,给定几个参数,就把块分为几列。grid-template-rows :定义行高,给定几个参数,就定义这几行的行高,剩下的行为原始值。

2023-03-15 22:24:56 146

原创 页面渲染流程

页面渲染流程

2022-12-19 16:42:12 1037

原创 从输入URL到页面展示

从输入URL到页面展示

2022-12-19 14:53:35 73

原创 TCP协议:保证页面文件被完整送达浏览器

TCP协议:保证页面文件被完整送达浏览器

2022-12-19 11:29:45 135

原创 进程,线程,Chrome

进程,线程,Chrome

2022-12-16 16:28:17 100

原创 js垃圾回收

js垃圾回收

2022-12-16 15:02:05 401

原创 栈空间和堆空间:数据是如何存储的?

栈空间和堆空间:数据是如何存储的?

2022-12-14 14:15:24 295

原创 this指向

this指向

2022-12-13 17:31:27 77

原创 作用域链和闭包

变量查找的作用域链和闭包

2022-12-12 17:23:15 130

原创 post传参 params与body的区别(RequestParam 和 RequestBody的区别)

post传参 params与body的区别

2022-12-12 11:16:38 3143

原创 var const let

var const let

2022-12-01 18:19:54 94

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除