怎么流畅的写 es6 的解构?

2021-08-26 01:41:05 +08:00
 Leviathann
字段少的时候还好直接写
const {a} = obj
就完了
字段多的话想利用 lsp 的补全,只能先写
const {} = obj
然后把光标移回大括号里,总感觉很不顺畅

import 的时候也是
感觉不如那些把需要导入的东西写在最后的语法
1495 次点击
所在节点    问与答
8 条回复
namelosw
2021-08-26 02:06:27 +08:00
这就是语法设计的时候想得少了,Python import 就故意倒过来 from Foo import Bar,不过解构还是从右往左。

我一般用 VIM,打完 obj 之后按 Esc F { a 就行了。
littleTomorrow1
2021-08-26 07:17:46 +08:00
用 snippet 去快速输入
mikulch
2021-08-26 08:12:38 +08:00
对象、数组解构复制,对象、数组扩展操作符,一直以来傻傻分不清楚
zxCoder
2021-08-26 09:20:18 +08:00
原来这不是我的问题………我一直以为是我 js 学得不好,又不敢问(因为没认真学,项目能跑就行)
dablwow
2021-08-26 09:34:53 +08:00
二楼正解,用 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
2021-08-26 10:29:59 +08:00
n 你也太懒了,鼠标一下大括号不行吗
Leviathann
2021-08-26 11:44:55 +08:00
@namelosw
@littleTomorrow1
@zxCoder
@dablwow

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

之后只要 输入 obj.cd 就可以选择补全为 const {} = obj,而且光标在 {} 里面
grewer
2021-09-08 14:54:13 +08:00
我的 ws 新版本, 自带这功能 , 输入 `props.destruct`, 有时候不用输完, 输入 des 就有了 然后直接回车, 选择就行了

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/798047

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX