Js的预编译你了解多少呢？
预编译 预编译 是指在程序运行之前，先对程序进行一些处理，例如预处理、编译、链接等，以便提高程序运行效率和减少运行时的错误。 编译的 作用 ：提高程序的 效率和稳定性 ，减少程序在运行过程中可能出现的错误，并提高程序的 可维护性 和 可扩展性 。 作用域 作用域是函数身上的属性 \[\[scope\]\] (给js引擎访问的，我们拿不到 隐式属性 )，用于存储函数中的 有效标识符 。 作用域链 作用域是执行期上下文对象的集合，这种集合呈...
JSON 的键为什么必须有引号？
00\. 写作背景 如题， 为什么 JSON 的键被设计为必须有引号 ？ 但是，问题无厘头，不代表无意义。Vite 源码的 pnpm 配置使用了一种 YAML 格式的配置文件，很多工具和语言也支持 YAML。 举个栗子，这是格式化工具 Prettier 官网的示例： 粉丝请注意，YAML 和 JSON 一龙一猪， 键名真的可以没引号 ！那么，强制要求键名加引号、而且必须是双引号的 JSON 到底在搞什么飞机？ 有时候，乍一看是几何题，其...
Web Worker知道吧？怎么动态的创建Web Worker呢
前言 浏览器是一个多进程多线程的架构，以 为例，每一个 页都是一个单独的渲染进程。在这个渲染进程下，有 执行线程和渲染线程。 执行线程与渲染线程是互斥的，这就导致了我们在执行一些长任务的时候，会阻塞渲染线程，具体的表现可能有： 1. 动画卡顿 2. 点击按钮/输入框输入没反应等等 在 中，浏览器提出了 这种技术，它允许在主线程之外运行脚本，这样就可以在后台执行一些耗时的任务，而不会阻塞 执行线程，从而提高了 应用的性能和响应性。 web...
原来vue3中template使用ref无需.value是因为这个
本文是 的第 15 篇，和该系列的其他文章一起服用效果更佳。 1. 2. 3. 4. 5. 6. 7. 8. 9. 10. 11. 12. 13. 14. 15. 16. 17. 18. 19. 20. 众所周知，vue3的template中使用ref变量无需使用 。还可以在事件处理器中进行赋值操作时，无需使用 就可以直接修改ref变量的值，比如： 。你猜vue是在编译时就已经在代码中生成了 ，还是运行时使用Proxy拦截的方式去实现的...
Vue v-for 进阶指南：in 与 of 的区别及应用场景
在 开发中， 是我们用来遍历数组、对象或其他数据结构的核心指令。然而，很多开发者可能忽略了其中的一个细微差别： 和 。这两个关键字看似相似，但却有各自不同的使用场景和适用数据类型。理解它们的区别，可以帮助我们编写更简洁、高效的代码。 本文将详细探讨 中的 和 ，并讲解它们各自的适用场景，帮助你在 项目中做出最佳选择。 什么是 ？ 是 提供的用于遍历数据的指令，它可以帮助你快速渲染列表、表格等动态生成的内容。在使用 时，我们通常需要遍历一...
7 种常见的前端攻击
大家都知道，保证网站的安全是十分重要的，一旦网站被攻陷，就有可能造成用户的经济损失，隐私泄露，网站功能被破坏，或者是传播恶意病毒等重大危害。所以下面我们就来讲讲7 种常见的前端攻击。 1\. 跨站脚本 (XSS) 跨站脚本攻击 (XSS) 是一种注入攻击，攻击者通过将恶意脚本注入到网页中，欺骗用户浏览器执行，从而窃取用户敏感信息或破坏网站。XSS 攻击是 Web 应用程序中最常见的安全威胁之一，也是造成重大安全事故的常见原因。 攻击方式...
React | 浏览器刷新，会执行 useEffect 的 卸载函数吗？
React | 浏览器刷新，会执行 useEffect 的 卸载函数吗？ 需求描述 后端在跑一个长期的异步上传任务，在任务执行过程中，用户刷新页面（f5），此时产品希望能够发送一个 kill 任务，杀掉这个任务。 拆解 需求合理性 其他情况是否存在类似：比如关闭 tab，关闭浏览器，突然断网等操作，等浏览器层级或者异常的用户行为 前端是否应该响应这种行为：对于更深层次的需求处理 根本问题点，或者说为什么会存在这个需求：上一个任务会加锁，...
前端安全领域
在前端开发领域，前端安全经常被公司忽视，这些公司大部分都是以业务为中心的公司，认为前端只是页面仔，画个页面调个接口，能有多大安全隐患？下面我将举几个前端安全相关的例子！ 下面这些内容都还是基于前端开发层面的思考和总结，在处理安全漏洞方面，前端是存在一定的局限性，所以前端的防护措施只是第一道防线，后端的安全验证和防护同样很重要。 ### 什么是XSS 它指的是攻击者通过在网页中注入恶意的脚本代码（一般是 JavaScript 代码），当其...
面试官：sessionStorage 能在多个标签页之间共享数据吗？
sessionStorage 能在多个标签页之间共享数据吗？在回答这个问题之前我们先来聊聊另一个存储API localstorage localstorage 与 sessionStorage 经常是放在一起讨论，那他们之间的区别是什么呢？ 只读的 属性允许你访问一个 源（origin）的对象 ；存储的数据将保存在浏览器会话中。 类似 ，但其区别在于：存储在 的数据可以长期保留；而当页面会话结束——也就是说，当页面被关闭时，存储在 的数...