随记

摘要： HTML 版本不停的更新迭代，也导致浏览器支持的写法眼花缭乱，就拿 script 标签来说，刚刚入行的那会儿就只知道用来写内联的 js 代码，后来又学到了引入 js 文件，ES 模块规范化之后又知道能用来引入模块化的 js 代码，可这就是它的全部了吗？？ 然而...并不是！！！ 各种用法 看看 sc 阅读全文

摘要： setInterval 和 setTimeout 两者都是用于控制 JS 函数延迟执行，但是在执行机制和用途上还是有点儿差异。 虽然说两者功能上有区别，但在使用上却可以相互模拟各自的功能，大胆的猜测下：也许浏览器内核底层都是同一个方法，只是上层封装出的两个语法糖而已。 语法 两者在语法上极其相似，除 阅读全文

摘要： 最初的 JS 执行代码都是一条线执行到底，当遇到比较耗时的操作时，比如大数组循环运算，就会导致页面卡着，就像假死一样。就像一个人在厨房烧菜一样，需要依次完成切菜、炒菜、装盘这些步骤，此过程中没办法同时做其他事情，必须按顺序执行每一个步骤。 Web Worker 赋予了 JS 分配任务的能力，在遇到复 阅读全文

摘要： 在前端风风雨雨的混了多年，从没在项目中实际使用过 IndexedDB 这个浏览器端的数据库，所以今天就摸了下 MDN 的后门，写一个简单的入门示例。 页面大概长这样： 源码： 以下代码包含了一个数据库所有的 CRUD （增删改查）操作。 <div> <button id="js_add_btn">添 阅读全文

摘要： sessionStorage 与 localStorage 差不多可以算作一对兄弟，它俩的暴露的 API 方法一模一样。 但两者也有不同点： 1、sessionStorage 存入的数据在页面关闭后，会自动清除。 2、相同 URL 的每个 tab 页签的 sessionStorage 会被隔离，互不 阅读全文

摘要： 本地存储除了 Cookie 外，还有 localStorage 和 sessionStorage，本文一探 localStorage。 localStorage 此 API 存入的数据会 永久 保存在浏览器中，除非用户手动删除。 localStorage 能用于同一浏览器同一域名跨标签页通信。 同一 阅读全文

摘要： 面试时候经常会被问及 Cookie 大小限制，但一直没尝试写一些 demo 测试下溢出极限值会怎样~~ 本文就来看看各种极限情况！ 英文 测试代码： (() => { const maxSize = 4 * 1024; // 4KB const name = 'name' // 最大出入的 valu 阅读全文

摘要： 前端的 cookie 读写在 2020 年之前一直不存在一个官方的接口，每次需要使用 cookie 的时候，要么是引入三方插件，要么就需要自己封装一个公用的组件或函数。 npm 的 cookie 插件周下载量 6 千万左右，可以想象一下此功能在前端的应用场景有多么广泛~~ cookie 插件: ht 阅读全文

摘要： 前端开发一直有种错觉，好像异常捕获都是后端的事，毕竟后端开发时如果不处理代码中的异常，有些资源得不到释放，极其容易导致内存泄漏。 前端由于 JS 的垃圾回收机制无需手动释放资源，反而不会怎么使用异常捕获代码中的错误。实际上任何编程语言，要写出一个健壮性的代码，都需要考虑异常处理。 本文分析下哪些地方 阅读全文

摘要： JS 中异步任务随处可见，比如： 1、用户交互的点击、输入 2、网络请求的 fetch、ajax、WebSocket 3、资源中的图片、脚本加载 4、定时任务 setTimeout、setInterval、动画 5、Web Worker 中的后台任务 以上这些地方都能见到 JS 异步任务使用场景。 阅读全文