使“this”不那么烦人

作者因全职写 Web 组件而频繁看到this关键字,觉得有点重复,于是寻找解决办法。

  • 简单方法:覆盖 VS Code 主题颜色令牌:默认 Github 亮主题中this是加粗深蓝色,作者不想自定义主题,而是在 VS Code 中覆盖单个令牌。在settings.json中添加以下代码:

    "editor.tokenColorCustomizations": {
    "textMateRules": [
      {
        "scope": "variable.language.this",
        "settings": {
          "foreground": "#b0b0b0"
        }
      }
    ]
    },

    这样this就变成了浅灰色,作者还将注释也调暗了,甚至想把 TypeScript 也调暗。

  • 过度方法:用自定义符号替换this:改变颜色很酷,但如果用图标替换this会怎样?作者在 ShopTalk Discord 上得到一些有趣想法,如“☝️” emoji,Andrew Walpole设计了一个自定义符号[https://www.redbubble.com/i/s...],Alan Smith则学会了如何用 Glyphs Mini 在开源编码字体中添加自定义连字,Andrew 基于 Alan 的工作导出了带有自定义符号的 Fira Code 字体,并在 VS Code 设置中安装:

    "editor.fontFamily": "'Fira Code Ligged', monospace",
    "editor.fontLigatures": true

    这样代码看起来很未来感,但因可读性降低,作者日常不使用该自定义符号,却激发了他创建一堆常见关键字的自定义符号,使 JavaScript 成为完全基于符文的编程语言的欲望。

  • 用 CSS 创建自定义连字的想法:作者提出一个疯狂想法,即在 CSS 中创建自己的自定义连字,避免每次有特定排版需求时都重新制作自定义字体,如:

    @font-face "Dave Hijinks" {
    match: "this.";
    replace: "☝️.";
    }
    
    @font-face "Cloud2Butts" {
    match: "cloud", "AI";
    replace: "butt", url(fart.svg);
    }
    
    body {
    font-face: "Dave Hijinks", "Cloud2Butt", sans-serif;
    }

    这只是一个想法,不是严肃提议,作者只是和朋友一起探索了这个有趣的领域。

阅读 8
0 条评论