ES6导入权限优化问询：如何更高效将指定权限分组为对象？

我现在有一个包含大量权限的列表，只需要导入其中三个，同时想把这三个权限分组到一个对象里赋值给变量。当前写法是：

import { firstPermission, secondPermission, thirdPermission, } from '@constants/permissions';
const relevantPermissions = { firstPermission, secondPermission, thirdPermission };

想问有没有更优的实现方式？之前试过在导入阶段用as关键字但没成功。

其实你可以利用ES6的解构和对象语法来简化这个流程，这里给你几种更高效的写法：

方法一：导入时直接完成对象构建（支持顶级await场景） #

如果你的项目环境支持顶级await（比如现代浏览器、Vite/Webpack等主流构建工具默认配置），可以一步完成导入和对象赋值，省去单独的导入语句：

const relevantPermissions = {
  firstPermission,
  secondPermission,
  thirdPermission
} = await import('@constants/permissions');

要是环境不支持顶级await，把这段代码放进async函数里就能正常运行啦。

方法二：简化原写法的冗余部分 #

你的原写法本身已经很清晰了，只需要去掉导入语句末尾多余的逗号，就是很干净的写法：

import { firstPermission, secondPermission, thirdPermission } from '@constants/permissions';
const relevantPermissions = { firstPermission, secondPermission, thirdPermission };

这里用到的是ES6对象属性简写（Property Shorthand），已经是很简洁的写法了，可读性拉满。

关于你尝试的as关键字用法 #

你之前用as没成功应该是用法不对，as主要用来给导入的变量重命名，如果你需要给权限起别名再放进对象，可以这么写：

import { 
  firstPermission as first, 
  secondPermission as second, 
  thirdPermission as third 
} from '@constants/permissions';
const relevantPermissions = { first, second, third };

但如果不需要重命名，as反而会增加代码量，没必要用~

哪种方案更优？ #

• 如果追求最少代码行数：方法一（支持顶级await时）最省；
• 如果追求最高可读性：方法二或者你的原写法更合适，一眼就能看清导入的权限和最终的对象结构。

内容的提问来源于stack exchange，提问作者jayqui