10/6
2020
假设有一个页面，上面黄色部分是一个浮窗。我们需要用 JavaScript 实现：点击页面其他部分时关闭这个浮窗。
要点在于区分用户点击的是浮窗还是其他部分。
09/1
2020
我在 Chrome 扩展里修改了前台页面的请求，把 referer 和 origin 都修改了。但是请求还是因为跨域问题失败了。在失败的错误信息里，看到 origin 是修改之前的原本的 origin。
Fetch 请求的 request origin
08/10
2020
我用 JavaScript 写了一个把图片转换为 icon 图标的工具，支持多种图标尺寸，可以在线使用：
https://icon.pixiv.download/
效果：
左边是图片，右边是生成的 ico 文件。
之前当我想在 pixiv 下载器里加入“用户头像转 ico 文件”的功能时，搜索相关的 JS 库，发现都是给 NodeJS 写的（需要依赖一些图片处理的包），没有原生 JS 可以直接用的。然后我去搜索在线转换的网站，想扒代码，发现都是发送到服务器由后端进行转换的。
没办法我就自己研究写了一个，使用原生 JS，转换是在本地直接完成的，不需要发送到服务器。
把图片转换为 icon 图标的工具
07/23
2020
console.log(0)
setTimeout(() => {
console.log(1)
}, 0);
console.log(2)如上代码会输出 0,2,1。 setTimeout 里面的是最后执行的。这是因为 JavaScript 的任务队列分为同步队列和异步队列， 优先执行同步队列里的任务，同步队列里的任务执行完了才会执行异步队列里的任务。setTimeout 里的代码会被放到异步队列里，这样就改变了代码的执行顺序。指定时间 0 是让 JavaScript 执行异步队列时尽早执行这部分代码。
JavaScript 中 setTimeout 0 的使用
05/11
2020
设想一下简单的例子：有字符串 abcd，我们使用正则表达式 /\w/g 全局匹配它，应该获取到 a b c d 四个字符串。
正则表达式的 exec 方法和字符串的 match 都可以达到这个目的，但使用方式上有差别。
下面的内容只探讨全局匹配模式的情况（也就是正则表达式后面加了 g 标识）。非全局匹配模式，可以基本认为它们没有差别。
JS 中 exec 和 match 进行正则表达式匹配的区别
04/21
2020
RGB 是用三原色的混合来表示颜色的，HSL 的三个维度则是色相、饱和度、亮度。
RGB 比较贴近显示器的发光原理，大部分电脑屏幕的每个像素都是由 红绿蓝 三个发光点组成，根据 RGB 值控制发光强度。但是对于普通人来说，看 RGB 值的数字比较难以理解，很难从 RGB 值里面出这个颜色是什么颜色，饱和度高不高，亮度高不高。HSL 正是直接描述这三个维度的，因此在进行一些图像处理时，HSL 会更加合适。
根据搜索到的转换公式，我编写了一个函数，用于将 RGB 值转换成 HSL 值。
Read More →
RGB 颜色值转换成 HSL
09/1
2019
最近我开始学习使用 TypeScript。先看了看教程，好像很简单的样子，就那些类型嘛，定义好类型就完事了。但是实际使用中却遇到了不少问题，在这里记录一些经验。
Read More →
TypeScript 使用记录
07/23
2019
我想修改之前的代码，把 js 变量名转换为驼峰命名风格，如下：
// 原有代码的变量名是下划线方式
let test_name = ''
test_name = document.querySelector('.test_name')
// 修改成驼峰命名
let testName = '';
testName = document.querySelector('.test_name');
因为要修改的文件内容繁杂，变量名很多，手动修改不能接受，此外我还担心手动替换会影响到不该改的地方（如字符串里），所以我想找一个工具来自动转换，这样就方便多了。
Read More →
Babel 将 js 变量名转换为驼峰命名风格
07/21
2019
今天我想让 Eslint 使用 Standard 代码风格来检查 JavaScript 代码，又折腾了许久。
其实弄明白了就简单了，安装这些依赖的 npm 包：
npm install -g standard eslint eslint-config-standard eslint-plugin-standard eslint-plugin-promise eslint-plugin-import eslint-plugin-node
如果不想全局安装，你也可以把 -g 改为 -D 进行本地安装。
安装完之后，在 .eslintrc 配置文件的 extend 规则里添加 standard，如：
{
"extends": ["standard"]
}
重启项目，如果 ESlint 没有报错信息，应该就可以使用 Standard 规则检查代码了。
Read More →
ESlint 使用 Standard 代码风格
04/24
2019
在本站页面打开浏览器控制台，可以看到一些提示信息：
2 个提示：避免使用 document.write()
2 个提示：解析器因 document.write() 被阻塞
Read More →
