- 博客(42)
- 收藏
- 关注
RSS订阅原创 js的基本数据类型
JavaScript 的基本数据类型（Primitive Types）共有number用于表示整数和浮点数（如423.14NaN（非数字）、Infinity（无穷大）。string表示文本（如"hello"'world'模板字符串（）也属于字符串。booleantrue或false。undefined表示未定义的值（变量声明但未赋值时默认值）。null表示空值（需注意返回"object"是历史遗留 bug）。symbol（ES6 新增）表示唯一标识符（如bigint（ES2020 新增）
2025-05-11 16:06:35
191
原创 TypeScript 中 interface 与 type 的对比
两者都是 TypeScript 强大的类型系统组成部分。理解它们的区别有助于：编写更清晰的类型定义利用每种结构的优势避免潜在的限制在实际项目中，选择主要取决于团队偏好和特定场景需求，两者在大多数情况下可以互换使用。
2025-05-07 00:33:06
309
原创 Web常见攻击方式及防御措施
通过组合这些措施，可以显著提高Web应用的安全性，但需注意安全是一个持续过程而非一次性任务。：如Cloudflare、AWS Shield。：攻击者向网页注入恶意脚本，在用户浏览器执行。：前端JavaScript不安全地操作DOM。：通过输入数据插入或"注入"恶意SQL命令。：使用Sequelize、TypeORM等。：诱骗用户在已认证的网站上执行非预期操作。：恶意脚本存储在服务器（如评论区）：恶意脚本通过URL参数反射给用户。：所有服务使用最低必要权限运行。：诱使用户点击隐藏的恶意元素。
2025-04-24 23:43:01
1124
原创 JavaScript 中改变 this 指向的方法
在 JavaScript 中，this的指向是动态的，取决于函数的调用方式。以下是改变this。
2025-04-23 16:44:18
331
原创 js继承方式
继承方式优点缺点原型链继承简单、父类新增方法/属性子类可访问引用属性共享、无法传参、无法多继承构造函数继承可传参、可多继承、引用属性不共享方法不能复用、不能继承原型属性组合继承可传参、引用属性不共享、方法可复用父类构造函数被调用两次原型式继承不需要构造函数引用属性共享、无法复用寄生式继承可增强对象方法不能复用、效率低寄生组合式继承最优解、高效率、方法可复用实现较复杂在实际开发中，寄生组合式继承是最理想的继承方式，也是 ES6 的class继承的实现原理。
2025-04-23 11:20:37
288
原创 JavaScript 中的 bind、call、apply 方法
方法调用时机参数传递方式返回值call立即调用参数列表函数执行结果apply立即调用参数数组函数执行结果bind不立即调用参数列表(可部分)绑定this的新函数。
2025-04-21 01:09:50
232
原创 Vue2 nextTick
Vue 2 的 实现主要在 文件中。: 存储所有待执行的回调函数: 标记是否已经有回调队列正在等待执行: 执行所有回调并清空队列Vue 2 采用了降级策略来选择最佳的异步执行方式，优先级如下： 支持两种调用方式：回调函数形式：Promise 形式：错误处理：捕获回调执行中的错误并通过 Vue 的错误处理系统处理兼容性处理：Vue 2 有复杂的降级策略，Vue 3 只使用 Promise微任务控制：Vue 2 明确标记 来跟踪是否使用微任务实现复杂度：Vue 2 需要处理更多边界情况和浏览器怪癖P
2025-04-16 23:50:13
420
原创 前端防抖，节流
就像打游戏时的技能冷却时间，你疯狂按技能键（频繁触发事件），但技能。想象你在和一个人说话，如果他一直打断你（频繁触发事件），你就等他。后才回应（执行函数）。如果他在这 2 秒内又说话了，就重新计时。事件，每 500ms 检查一次是否到底）射击游戏开火冷却（防止玩家疯狂点击）搜索框输入（用户停止输入后再搜索）防止按钮重复提交（点击后延迟执行）（最后一次触发后执行）。等你消停了，我再干活。（按固定频率执行）。
2025-04-10 16:36:18
198
原创 前端中rem,vh,vw
在移动端，浏览器地址栏的显示/隐藏会动态改变视口高度，导致。适用于响应式布局（如替代百分比，避免嵌套元素计算问题）。动态设置（如通过媒体查询或 JS 根据视口调整），通过合理选择单位，可以轻松实现跨设备的响应式布局。计算复杂性，可使用 CSS 容器查询（可能包含地址栏高度，导致内容被遮挡。）或 Flex/Grid 布局。（结合媒体查询动态调整根。默认情况下，浏览器的根。使用 CSS 新单位。：在移动端浏览器中，
2025-04-02 23:53:28
1035
原创 vue将组件中template转为js
Vue 2 和 Vue 3 的转换机制有所不同，主要体现在编译时机、编译工具和输出结果上。：渲染函数更高效，支持静态节点提升（Static Hoisting）、补丁标志（Patch Flags）等优化。：无论 Vue 2 还是 Vue 3，都应通过构建工具（Webpack/Vite）预编译模板，避免运行时开销。：完整版 Vue（含编译器）支持运行时编译，但推荐预编译以优化性能。（模板编译器），编译过程更高效且支持更多优化。编译时优化更多，性能更好，包体积更小。，支持运行时编译（但推荐预编译）。
2025-04-02 17:53:47
489
原创 借助vite来优化前端性能
Vite 是一个现代化的前端构建工具，凭借其基于原生 ES 模块的开发服务器和高效的构建能力，可以显著优化前端性能。Vite 利用浏览器对 ES 模块的原生支持，在开发环境中无需打包，直接按需加载模块。Vite 基于 Rollup，默认支持 Tree Shaking，移除未使用的代码。Vite 默认支持代码分割，将代码拆分为多个小块，按需加载。修改代码后，仅更新修改的部分，而不是重新构建整个应用。）实现路由和组件的按需加载，减少初始加载时间。结合动态导入，进一步优化首屏加载性能。确保使用 ES 模块语法（
2025-03-19 18:33:47
420
原创 卫星绕行星
要在CSS中实现一个行星（中心）和一个围绕它旋转的卫星，你可以使用CSS的@keyframes和transform属性来创建旋转动画。行星是一个圆形的div，使用实现圆形效果。通过和将其居中。卫星也是一个圆形的div，比行星小。使用将其放置在行星的中心，然后通过动画使其围绕行星旋转。定义了一个名为orbit的动画。使用transform和使卫星围绕行星旋转。将卫星从行星中心向外移动，形成轨道半径。第二个是为了防止卫星自身旋转（保持卫星的朝向不变）。将orbit动画应用到卫星上，持续时间为4s，使用。
2025-03-17 11:38:31
340
原创 Three.js中BufferGeometry 和 BoxGeometry
是 Three.js 中所有几何体的基类。它是一个高度灵活的几何体类型，允许开发者通过自定义顶点数据、法线、UV 坐标等来创建复杂的几何形状。是 Three.js 提供的一个内置几何体类型，用于创建立方体（长方体）。的 API 来生成立方体的顶点、法线和 UV 坐标。Three.js 在内部使用。的子类，专门用于简化立方体的创建。
2025-03-12 17:27:58
318
原创 promise有哪些常用方法
都成功时返回一个包含所有结果的数组，若有一个失败则立即返回该失败。完成（无论成功或失败），返回一个包含所有结果的对象数组。数组，返回最先完成（无论成功或失败）的。：一个可迭代对象（如数组），包含多个。：一个可迭代对象（如数组），包含多个。：一个可迭代对象（如数组），包含多个。：一个可迭代对象（如数组），包含多个。：无论成功或失败都会执行的回调函数。成功或失败，都会执行的回调函数。结果，若全部失败则返回一个。（可选）：失败时的回调函数。数组，返回第一个成功的。：成功时的回调函数。：失败时的回调函数。
2025-03-05 22:07:31
262
原创 vue3 数据劫持中proxy不能做，需要vue3做的
在 Vue 3 中，Proxy是用于实现数据劫持的核心机制，它能够拦截对对象的各种操作（如读取、写入、删除等），从而实现响应式数据。然而，Proxy并不是万能的，在某些场景下，Vue 3 仍然需要借助其他方法来实现完整的响应式系统。
2025-03-05 21:53:37
775
原创 vue3中使用eventBus
不存在（即该事件还没有注册过任何回调函数），则将其初始化为一个空数组。存在（即该事件有注册的回调函数），则遍历该事件的所有回调函数，并依次调用它们，将。存在（即该事件有注册的回调函数），则遍历该事件的回调函数列表，找到与。对象的键是事件名称，值是一个数组，数组中存储了该事件的所有回调函数。，用于存储事件名称及其对应的回调函数列表。相同的回调函数，并将其从列表中移除。：当事件触发时要执行的回调函数。添加到该事件的回调函数列表中。：传递给事件回调函数的数据。：要订阅的事件名称。：要移除的回调函数。
2025-02-28 16:55:28
595
原创 electron安装/操作等避坑
以下是按照electron官网的例子做的，电脑系统是mac，其他的系统需要调整。2、使用yarn安装electron等操作中，执行命令之前都要有ELECTRON_MIRROR=https://npm.taobao.org/mirrors/electron/，(https://npmmirror.com/mirrors/electron/ 这个更稳)经过试验这样可以相对顺畅的安装。，将 Electron Forge 添加到您应用的开发依赖中，并使用其"import"命令设置 Forge 的脚手架。
2025-02-26 15:09:41
429
原创 vue中的nextTick和node中的process.nextTick
是 Vue 提供的一个方法，用于在 DOM 更新完成后执行回调函数。通常用于在数据变化后立即操作更新后的 DOM。是 Node.js 提供的一个方法，用于将回调推迟到当前事件循环的末尾，但在下一个事件循环开始之前执行。都用于延迟执行回调，但它们的应用场景和执行时机不同。会将回调推迟到下一次 DOM 更新循环之后执行。: 它会在当前操作完成后立即执行，优先级高于。: Vue 在更新 DOM 时是异步的，在 DOM 更新后执行，在当前事件循环末尾执行。主要用于 DOM 操作，用于异步任务的调度。
2025-02-26 10:10:17
327
原创 node.js执行spawn后的code码
在Node.js中，模块的spawn方法用于生成一个新的进程来执行外部命令。当命令执行完毕后，spawn方法会返回一个对象，该对象包含一个事件处理程序，可以用来捕获命令的退出码（code）和信号（signal。
2025-02-23 00:02:15
309
原创 VueUse中的useStorage
通过这种方式，你可以轻松地在 Vue 3 项目中管理用户的本地存储数据，并保持数据的一致性和响应性。它可以帮助你在 Vue 3 中更方便地管理和操作存储数据。是 VueUse 库中的一个组合式函数，用于与浏览器的。： 创建一个响应式的变量，并将其绑定到。： 在你的 Vue 组件中引入。
2025-02-14 17:23:56
725
原创 node.js中spawn和exec区别
简单地说，如果你只需要执行一个快速完成的小命令并且想要直接获取其结果，那么exec可能是更好的选择。而如果你正在处理可能长时间运行或生成大量输出的任务，则应该考虑使用spawn来提高效率和性能。
2025-02-05 15:25:18
359
原创 js对数组去重的方法
使用Set：简洁高效，适用于大多数情况。使用filter和indexOf：易于理解，但性能稍逊于Set。使用reduce：功能强大，但代码稍微复杂一些。使用Map：适用于需要保留元素顺序的情况。使用双重for循环：性能较差，但易于理解。使用Object作为哈希表：简单且高效，适用于数值或字符串类型的数组。使用lodash库：如果已经在项目中使用lodash，则非常方便。
2025-01-10 11:06:36
149
原创 node从父进程中分离子进程
原来的操作是，在升级文件准备好后，应用端调用后端升级接口开始执行升级脚本，然后应用端开始关闭流程（在before-quit事件中，event.preventDefault();我发现如果升级时候只进行关闭app操作，不调用后端升级接口，应用关闭后不会有那个奇怪的后台进程；但升级时按原先调用了后端升级接口后再关闭app，就有那个奇怪的后端进程了，而且这个时候后端server已经关闭了啊，什么鬼👻。没有了奇怪的后台进程，app关闭后，upgrade.bat成功执行，将应用文件替换后，重启app，升级成功。
2024-10-16 18:33:08
336
原创 vue-router中useRoute, useRouter
用于获取当前路由对象的信息。它提供了关于当前活动路由的各种信息，如路径、参数、查询参数等。都是Vue Router 4中的Composition API，它们的主要区别在于用途和功能。：用于访问全局的路由器实例。它允许你在组件中执行导航操作，如跳转到其他路由、获取路由信息等。来访问当前路由的状态，并根据这些信息执行相应的操作。主要用于执行导航操作和访问全局路由器实例。主要用于获取当前路由的信息，而。
2024-08-16 11:34:26
465
原创 electron中ipcRenderer.sendSync与ipcRenderer.invoke比较
最近做electron的项目时，使用了下ipcRenderer.sendSync与ipcRenderer.invoke。它们都是Electron 中用于实现进程间通信（IPC）的两个重要方法。如果你需要立即获取结果并愿意承担阻塞的风险，可能是合适的选择。相反，如果你希望避免阻塞并优化用户体验，将是更好的选择。在实际应用中，根据具体需求和性能考虑选择合适的通信方式。
2024-07-04 10:43:40
2335
1原创 Vue组件间交互
父子组件通信:props兄弟组件通信:eventBusvuex自己实现简单的 Store 模式跨级通信:eventBusVuex自己实现简单的 Store 模式我们要善于站在巨人的肩膀上。
2023-09-22 16:15:57
183
原创 vue工程中使用全局变量
vue工程中使用全局变量最近碰到了要在vue的工程中使用全局变量的事儿。于是学习了些。 图1 工程中store的结构1、使用Co...
2020-11-22 23:53:34
423
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人