Programing

ES6는 개체에서 모든 값을 내 보냅니다.

lottogame 2020. 9. 1. 07:58
반응형

ES6는 개체에서 모든 값을 내 보냅니다.


./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

동적이 아닙니다.

개체에서 모든 값을 내보낼 수 있습니까?


그렇게 보이지 않습니다. ECMAScript 6 모듈 에서 인용 : 최종 구문 :

궁금 할 것입니다. 기본 내보내기 개체 (예 : CommonJS)가 가능하다면 왜 명명 된 내보내기가 필요합니까? 대답은 객체를 통해 정적 구조를 적용 할 수없고 관련된 모든 이점을 잃을 수 없다는 것입니다 (다음 섹션에서 설명).


솔루션 해결 방법을 실제로 권장 할 수는 없지만 작동합니다. 개체를 내보내는 대신 각 멤버의 명명 된 내보내기를 사용합니다. 다른 파일에서 첫 번째 모듈의 명명 된 내보내기를 개체로 가져오고 해당 개체를 기본값으로 내 보냅니다. 또한 다음을 사용하여 첫 번째 모듈에서 명명 된 모든 내보내기를 내 보냅니다.export * from './file1';

values ​​/ value.js

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

export {a, b, c};

values ​​/ index.js

import * as values from './value';

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

index.js

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

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

이 추악하지만 실행 가능한 솔루션을 시도하십시오.

// 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);

구성 파일에 대해이 작업을 수행해야했습니다.

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를 사용하고 있습니다.


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

이것은 오늘날 Babel 변환함께 작동 하며 ES2016 모듈의 모든 이점을 실제로 브라우저에 표시 할 때마다 이점을 활용해야합니다.

또한 export default {a, b, c};모든 값을 * as, 즉를 사용하지 않고 객체로 가져올 수 있도록 추가 할 수 있습니다.import myModule from 'my-module';

출처 :


I suggest the following, let's expect a module.js:

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

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

and then you can do in an 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

More examples of destructering objects: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment#Object_destructuring


Every answer requires changing of the import statements.

If you want to be able to use:

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

as in the question, and in your my-module you have everything that you need to export in one object (which can be useful e.g. if you want to validate the exported values with Joi or JSON Schema) then your my-module would have to be either:

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

Or:

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

Not pretty, but it compiles to what you need.

See: Babel example


You can do lots of stupid thing with javascript. I will leave this quote here from YDKJS book.

enter image description here

Mentioned page of the book ->

https://books.google.com.tr/books?id=iOc6CwAAQBAJ&pg=PT150&lpg=PT150&dq=JS+engine+cannot+statically+analyze+the+contents+of+plain+object&source=bl&ots=7v8fMUgwhx&sig=dP3BpY7mEvpvfyxO_koWaXczBWI&hl=en&sa=X&ved=2ahUKEwi4qseXyrDdAhUS-6QKHZYTAEQQ6AEwAHoECAEQAQ#v=onepage&q=JS%20engine%20cannot%20statically%20analyze%20the%20contents%20of%20plain%20object&f=false


Exporting each variable from your variables file. Then importing them with * as in your other file and exporting the as a constant from that file will give you a dynamic object with the named exports from the first file being attributes on the object exported from the second.

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'

참고URL : https://stackoverflow.com/questions/29844074/es6-export-all-values-from-object

반응형