V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
V2EX 提问指南
Leviathann
V2EX  ›  问与答

怎么流畅的写 es6 的解构?

  •  
  •   Leviathann · 99 天前 via iPhone · 1005 次点击
    这是一个创建于 99 天前的主题,其中的信息可能已经有所发展或是发生改变。
    字段少的时候还好直接写
    const {a} = obj
    就完了
    字段多的话想利用 lsp 的补全,只能先写
    const {} = obj
    然后把光标移回大括号里,总感觉很不顺畅

    import 的时候也是
    感觉不如那些把需要导入的东西写在最后的语法
    8 条回复    2021-09-08 14:54:13 +08:00
    namelosw
        1
    namelosw  
       99 天前
    这就是语法设计的时候想得少了,Python import 就故意倒过来 from Foo import Bar,不过解构还是从右往左。

    我一般用 VIM,打完 obj 之后按 Esc F { a 就行了。
    littleTomorrow1
        2
    littleTomorrow1  
       98 天前
    用 snippet 去快速输入
    mikulch
        3
    mikulch  
       98 天前
    对象、数组解构复制,对象、数组扩展操作符,一直以来傻傻分不清楚
    zxCoder
        4
    zxCoder  
       98 天前 via Android
    原来这不是我的问题………我一直以为是我 js 学得不好,又不敢问(因为没认真学,项目能跑就行)
    dablwow
        5
    dablwow  
       98 天前   ❤️ 2
    二楼正解,用 snippet,比如 vscode 可以用这个插件
    https://github.com/dsznajder/vscode-es7-javascript-react-snippets

    写对象解构就输入 dob(descrut object),编辑器输入 const {propName} = objectToDescruct,光标先停在 proName,按 tab 再切换到 objectToDescrut 。全程不用按方向键,非常流畅。

    同理,数组解构就是 dar(descrut array),编辑器输入 const [propName] = arrayToDescruct
    3wdddd
        6
    3wdddd  
       98 天前
    n 你也太懒了,鼠标一下大括号不行吗
    Leviathann
        7
    Leviathann  
    OP
       98 天前   ❤️ 2
    @namelosw
    @littleTomorrow1
    @zxCoder
    @dablwow

    发现 webstorm 的 postfix completion 也可以实现这个功能,
    key 设置成 cd (代表 const desctruct)
    内容设置为
    const {$END$} = $EXPR$

    之后只要 输入 obj.cd 就可以选择补全为 const {} = obj,而且光标在 {} 里面
    grewer
        8
    grewer  
       85 天前
    我的 ws 新版本, 自带这功能 , 输入 `props.destruct`, 有时候不用输完, 输入 des 就有了 然后直接回车, 选择就行了
    关于   ·   帮助文档   ·   API   ·   FAQ   ·   我们的愿景   ·   广告投放   ·   感谢   ·   实用小工具   ·   1113 人在线   最高记录 5497   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 21ms · UTC 21:58 · PVG 05:58 · LAX 13:58 · JFK 16:58
    ♥ Do have faith in what you're doing.