V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
推荐关注
Meteor
JSLint - a JavaScript code quality tool
jsFiddle
D3.js
WebStorm
推荐书目
JavaScript 权威指南第 5 版
Closure: The Definitive Guide
cutemurphy2888
V2EX  ›  JavaScript

ts 的骚操作

  •  
  •   cutemurphy2888 · 2022-03-31 11:14:21 +08:00 · 4937 次点击
    这是一个创建于 967 天前的主题,其中的信息可能已经有所发展或是发生改变。
    var Cute;
    (function (Cute) {
    Cute[Cute["Red"] = 2] = "Red";
    Cute[Cute["Blue"] = 3] = "Blue";
    Cute[Cute["Yellow"] = 4] = "Yellow";
    })(Cute || (Cute = {}));
    var cc = Cute.Blue;
    console.log(Cute,cc, 892);


    key 和 value 互换。·

    key 里完成了一次赋值操作 ,很骚·
    24 条回复    2022-04-01 17:20:09 +08:00
    matthewzhong
        1
    matthewzhong  
       2022-03-31 11:23:15 +08:00
    我理解原先的 key ,value 应该还会在
    murmur
        2
    murmur  
       2022-03-31 11:24:16 +08:00
    npm install object-swap-key-val

    这不是更骚
    superfatboy
        3
    superfatboy  
       2022-03-31 11:24:50 +08:00
    这个不是枚举么??
    libook
        4
    libook  
       2022-03-31 11:24:54 +08:00   ❤️ 1
    干得好,以后别这么干了……

    这个说是 ts 代码,但实际上完全兼容 js 代码,没有任何 ts 附加特性。
    这种互换没啥意义,程序已知 2\3\4 和 Red\Blue\Yellow 的时候,完全可以直接 Cute[2]="Red",key 里面堆这么多都是废话。
    而且原本的 key 都没去掉,只是给 Cute 对象增加了 2/3/4 这三个新 key ,造成了数据冗余,除非很确定后续会同时用到这两套 key ,但为了 debug 没那么痛苦我依然建议分成两个对象来分别存储。
    更有实际意义的是当 key 和 value 都是动态变化的情况下进行互换,但其实一个循环就能搞定了。

    这样的代码很可能过不了 code review……
    DOLLOR
        5
    DOLLOR  
       2022-03-31 11:27:41 +08:00
    这是 enum 转为 js 之后的代码吧。
    enum 是我觉得 ts 里最迷惑的地方,我从来不用。
    anjianshi
        6
    anjianshi  
       2022-03-31 11:28:07 +08:00
    这种“骚操作”,既不简洁,也不容易读。且和 TypeScript 没有关系,就是普通 JavaScript 代码。
    试试下面的?

    ```
    // 原版本
    var Cute;
    (function (Cute) {
    Cute[(Cute["Red"] = 2)] = "Red";
    Cute[(Cute["Blue"] = 3)] = "Blue";
    Cute[(Cute["Yellow"] = 4)] = "Yellow";
    })(Cute || (Cute = {}));
    var cc = Cute.Blue;
    console.log('A', Cute, cc);


    // 改良版
    var Cute2 = [['Red', 2], ['Blue', 3], ['Yellow', 4]].reduce(function (o, pair) {
    return {
    ...o,
    [pair[0]]: pair[1],
    [pair[1]]: pair[0]
    }
    }, {})
    var cc2 = Cute2.Blue;
    console.log('B', Cute2, cc2);

    // 改良精简版
    var Cute3 = [['Red', 2], ['Blue', 3], ['Yellow', 4]].reduce((o, [k, v]) => ({ ...o, [k]: v, [v]: k }), {})
    var cc3 = Cute3.Blue;
    console.log('C', Cute3, cc3);

    ```
    nulIptr
        7
    nulIptr  
       2022-03-31 11:28:56 +08:00   ❤️ 1
    这跟 ts 有啥关系? pr 里看到这种代码肯定会 reject 的。

    建议讨论一下
    const int const *a,b;里面 b 是什么类型
    int i=0;int b=++i+i+++++i;里面 b 的值是多少
    magewu1223ll
        8
    magewu1223ll  
       2022-03-31 11:29:30 +08:00
    这就是枚举编译后的代码啊
    DOLLOR
        9
    DOLLOR  
       2022-03-31 11:33:05 +08:00
    @libook
    @nulIptr
    这是 ts 的 enum 编译之后生成的 js 代码,为什么要对编译之后生成的代码做 review ?
    libook
        10
    libook  
       2022-03-31 11:41:39 +08:00
    @DOLLOR #8 题主里根本没说是什么,那我就默认是人写的代码。
    mxT52CRuqR6o5
        11
    mxT52CRuqR6o5  
       2022-03-31 11:45:09 +08:00 via Android
    @libook 标题里说了是 ts 啊
    gdrk
        12
    gdrk  
       2022-03-31 11:51:15 +08:00
    这是 enum 编译后的代码吧,之前还是看文档时看到过,后面也没用过这个特性。不知道在什么场景下会用到
    davin
        13
    davin  
       2022-03-31 13:08:43 +08:00
    增强代码可读性,预防某些魔法值,用起来有时候比写 Switch 爽,每个实例的唯一性等等。比如服务端给个 status 字段,值为 1 代表未开始,2 进行中,3 已完成,比较适合用 enum 来定义。
    fstar
        14
    fstar  
       2022-03-31 13:16:52 +08:00
    这个我一看就知道其实是 TypeScript 的 enum 的编译为 JavaScript 的结果,是 TS 枚举的反射特性。

    https://www.typescriptlang.org/docs/handbook/enums.html#reverse-mappings

    enum Cute {
    Red = 2,
    Blue,
    Yellow
    }

    没啥问题,编译用的模板越紧凑越好。
    bthulu
        15
    bthulu  
       2022-03-31 13:44:35 +08:00
    @anjianshi 很明显你这两个改良版不如原版简洁易读
    catinsides
        16
    catinsides  
       2022-03-31 13:57:27 +08:00   ❤️ 3
    我替 OP 把标题完善一下吧:
    ts 编译结果后中的骚操作
    又是 code review ,又是改良的,不愿再笑
    ychost
        17
    ychost  
       2022-03-31 14:53:45 +08:00
    代码写的很骚,下次别写了
    0o0O0o0O0o
        18
    0o0O0o0O0o  
       2022-03-31 15:09:20 +08:00 via iPhone
    wunonglin
        19
    wunonglin  
       2022-03-31 15:13:55 +08:00
    那些对编译后的代码 review ,那不是有🧊么。。。如果真是为了极致性能,为何不写原生 js
    zhwithsweet
        20
    zhwithsweet  
       2022-03-31 15:33:40 +08:00
    从来不用枚举!
    enchilada2020
        21
    enchilada2020  
       2022-03-31 15:39:16 +08:00 via Android
    @0o0O0o0O0o 最近在玩这个 还挺有意思的 不过测试用例不够完善 有时候过了是过了 未必是对的
    FLynnCPP
        22
    FLynnCPP  
       2022-03-31 17:15:57 +08:00 via iPhone
    @nulIptr 有毒
    IvanLi127
        23
    IvanLi127  
       2022-03-31 18:31:11 +08:00 via Android
    楼主这标题,把 ts 改成 tsc 或许也能让楼里少出现些 reviewer 吧 哈哈哈哈。这代码我第一次看也觉得挺骚的。
    iqoo
        24
    iqoo  
       2022-04-01 17:20:09 +08:00
    @libook 用 const enum 就会替换成常量。不加 const 估计是留着这些废代码为运行时动态查表用的。
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   3754 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 30ms · UTC 04:15 · PVG 12:15 · LAX 20:15 · JFK 23:15
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.