saber酱的抱枕

生于忧患,死于安乐

05/11
14:33
学习

JS 中 exec 和 match 进行正则表达式匹配的区别

设想一下简单的例子:有字符串 abcd,我们使用正则表达式 /\w/g 全局匹配它,应该获取到 a b c d 四个字符串。

正则表达式的 exec 方法和字符串的 match 都可以达到这个目的,但使用方式上有差别。

下面的内容只探讨全局匹配模式的情况。非全局匹配模式,可以基本认为它们没有差别。
Read More →

JS 中 exec 和 match 进行正则表达式匹配的区别

04/21
15:31
软件

RGB 颜色值转换成 HSL

RGB 是用三原色的混合来表示颜色的,HSL 的三个维度则是色相、饱和度、亮度。

RGB 比较贴近显示器的发光原理,大部分电脑屏幕的每个像素都是由 红绿蓝 三个发光点组成,根据 RGB 值控制发光强度。但是对于普通人来说,看 RGB 值的数字比较难以理解,很难从 RGB 值里面出这个颜色是什么颜色,饱和度高不高,亮度高不高。HSL 正是直接描述这三个维度的,因此在进行一些图像处理时,HSL 会更加合适。

根据搜索到的转换公式,我编写了一个函数,用于将 RGB 值转换成 HSL 值。
Read More →

RGB 颜色值转换成 HSL

07/23
11:11
软件

Babel 将 js 变量名转换为驼峰命名风格

我想修改之前的代码,把 js 变量名转换为驼峰命名风格,如下:

// 原有代码的变量名是下划线方式
let test_name = ''
test_name = document.querySelector('.test_name')
// 修改成驼峰命名
let testName = '';
testName = document.querySelector('.test_name');

因为要修改的文件内容繁杂,变量名很多,手动修改不能接受,此外我还担心手动替换会影响到不该改的地方(如字符串里),所以我想找一个工具来自动转换,这样就方便多了。
Read More →

Babel 将 js 变量名转换为驼峰命名风格

07/21
17:09
软件

ESlint 使用 Standard 代码风格

今天我想让 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/23
09:13
学习

不规则的空白

今天有人报告我的 pixiv 图片下载器在某些情况下,无法保存某个图片。我去检查了下,发现这个作品(pid=73111615)最后的空格暗藏玄机。

不规则的空格 空白

复制这个空格,粘贴到别的地方,把光标放到最后,然后按键盘的 ← 箭头,会发现需要按 4 次才能到这个空格的前面。

复制到浏览器控制台,发现确实是 4 个字符。

不规则的空格 空白

经过检查,第一个空格是普通的空格,后面 3 个是特殊字符,它并不会显示出来。浏览器控制台里那时应该是做了特殊处理。这玩意放在代码里,ESLint 报错说这是“irregular whitespace”,不规则的空白。

最后我复制它的 Unicode 码 \u200b,把它替换掉了。

不规则的空格 空白

特殊字符防不胜防啊,不知道以后还会不会遇到别的来捣乱。

不规则的空白

03/28
02:42
学习

Vue.js 待办事项 Todolist 之 2

在线体验 Github

去年我做了个 Vue.js 的待办事项,是 PC 上的样式,现在又做了个待办事项,算是手机上的。依旧可以设置背景。

之前 pc 上的那个,闹钟有兼容性问题,而手机上这个,不再播放音乐来提醒了,改为使用浏览器的通知。但这需要 HTTPS 和浏览器的支持,所以上面的在线体验是没有通知的。

其他详见 GitHub 里的说明~

Vue.js 待办事项 Todolist 之 2

02/19
03:20
软件

一个 JavaScript 拾色器



DEMO:选取颜色可以改变网页的背景颜色。

我在网上找到了个 JavaScript 拾色器(原网址),觉得比较小巧方便,就花了一些时间对它进行修改和优化。

当我觉得已经搞完的时候,才醒悟过来这个拾色器没有灰度,无法选取灰色、黑色。这使它的实用性大打折扣,但这也是没办法的事。(原因下面再讲)

姑且放个下载吧(内附 demo 和使用说明):

colorPicker.js
Read More →

一个 JavaScript 拾色器