ES6从对象导出所有值

时间:2015-04-24 09:42:40

标签: module export ecmascript-6

假设我有一个模块(./my-module.js),该模块的对象应该是其返回值:

let values = { a: 1, b: 2, c: 3 }

// "export values" results in SyntaxError: Unexpected token

所以我可以导入它们:

import {a} from './my-module'           // a === 1
import * as myModule from './my-module' // myModule.a === 1

我发现的唯一方法是对出口进行硬编码:

export let a = values.a
export let b = values.b
export let c = values.c
// or:
export let {a, b, c} = values

这不是动态的。

是否可以从对象中导出所有值?

10 个答案:

答案 0 :(得分:61)

我不能真正推荐这个解决方案解决方法,但它确实有效。您可以使用命名导出每个成员,而不是导出对象。在另一个文件中,将第一个模块的命名导出导入到对象中,并将该对象导出为默认值。还使用export * from './file1';

从第一个模块导出所有指定的导出

<强>值/ value.js

let a = 1;
let b = 2;
let c = 3;

export {a, b, c};

<强>值/ index.js

import * as values from './values';

export default values;
export * from './values';

<强> index.js

import values, {a} from './values';

console.log(values, a); // {a: 1, b: 2, c: 3} 1

答案 1 :(得分:28)

似乎不是这样。引自ECMAScript 6 modules: the final syntax

  

您可能想知道 - 如果我们可以简单地默认导出对象(如CommonJS),为什么我们需要命名导出?答案是你不能通过对象强制执行静态结构并失去所有相关的优点(在下一节中描述)。

答案 2 :(得分:12)

尝试这个丑陋但可行的解决方案:

// use CommonJS to export all keys
module.exports = { a: 1, b: 2, c: 3 };

// import by key
import { a, b, c } from 'commonjs-style-module';
console.log(a, b, c);

答案 3 :(得分:8)

我只需要为配置文件执行此操作。

var config = {
    x: "CHANGE_ME",
    y: "CHANGE_ME",
    z: "CHANGE_ME"
}

export default config;

你可以这样做

import { default as config } from "./config";

console.log(config.x); // CHANGE_ME

这是使用Typescript记住你。

答案 4 :(得分:3)

export const a = 1;
export const b = 2;
export const c = 3;

这将在今天使用Babel transforms,并且只要该功能实际存在于浏览器中,就应该利用ES2016模块的所有优势。

您还可以添加export default {a, b, c};,这样您就可以将所有值导入为* as的对象,即import myModule from 'my-module';

来源:

答案 5 :(得分:3)

我建议如下,让我们期待 module.js

const values = { a: 1, b: 2, c: 3 };

export { values }; // you could use default, but I'm specific here

然后你可以在 index.js

中进行
import { values } from "module";

// directly access the object
console.log(values.a); // 1

// object destructuring
const { a, b, c } = values; 
console.log(a); // 1
console.log(b); // 2
console.log(c); // 3

// selective object destructering with renaming
const { a:k, c:m } = values;
console.log(k); // 1
console.log(m); // 3

// selective object destructering with renaming and default value
const { a:x, b:y, d:z = 0 } = values;
console.log(x); // 1
console.log(y); // 2
console.log(z); // 0

破坏对象的更多示例:https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment#Object_destructuring

答案 6 :(得分:2)

每个答案都需要更改导入语句。

如果您希望能够使用:

import {a} from './my-module'           // a === 1
import * as myModule from './my-module' // myModule.a === 1

在问题中以及在my-module中,您都需要将所有内容导出到一个对象中(这很有用,例如,如果您想使用Joi或JSON Schema验证导出的值),然后您的{ {1}}必须是:

my-module

或者:

let values = { a: 1, b: 2, c: 3 }
let {a, b, c} = values;
export {a, b, c};

不漂亮,但是可以根据您的需要进行编译。

请参阅:Babel example

答案 7 :(得分:2)

答案 8 :(得分:2)

为什么不直接对对象进行命名导出:

let values = { a: 1, b: 2, c: 3 }
export { values }

export let values = { a: 1, b: 2, c: 3 }

然后在需要的地方进行命名导入:

import { values } from './my-module'

let foo = values.a
let { a, b, c } = values

import { values as myModule } from './my-module'

let foo = myModule.a
let { a, b, c } = myModule

也可以进行默认导出:

let values = { a: 1, b: 2, c: 3 }
export default values 

export default { a: 1, b: 2, c: 3 }

然后消费它:

import whateverIcallIt from './my-Module'

let foo = whateverIcallIt.a
let {a, b, c } = whateverIcallIt

如果你想导出一堆单独的值,比如一堆常量,你可以:

export const a = 1
export const b = 2
//...

甚至

export const a = 1,
             b = 2,
             c = 3,
//...

然后单独导入它们:

import { a, b, c } from './my-module'

答案 9 :(得分:0)

从变量文件中导出每个变量。然后,像在其他文件中一样,用*导入它们,然后从该文件中将其导出为常量,将为您提供一个动态对象,其中第一个文件的命名导出是从第二个文件导出的对象的属性。

Variables.js

export const var1 = 'first';
export const var2 = 'second':
...
export const varN = 'nth';

Other.js

import * as vars from './Variables';

export const Variables = vars;

Third.js

import { Variables } from './Other';

Variables.var2 === 'second'
相关问题