ES6 + 자바 스크립트 모듈 내보내기 옵션
ES6 모듈의 공개 내보내기가 다음 두 가지 방법으로 수행되는 것을 보았습니다.
// method 1
export var getAnswer = function () { return 'forty two'; };
// method 2
export default function () { return 'forty two'; };
- 둘 다 유효합니까?
- 그렇다면 둘 다 존재하는 이유는 무엇입니까?
- ES6 구문을 사용하는 모듈 내보내기에 대한 다른 유효한 옵션이 있습니까?
내 googlefu로 답을 찾지 못한 것이 놀랍습니다. CommonJS, RequireJS, AMD, Node 등이 아닌 ES6 모듈 에만 관심이 있습니다 .
1 년 후, 주제에 대해 내가 찾은 최고의 정보가 여기 있습니다.
수출에는 4 가지 유형이 있습니다. 다음은이를 사용하는 일부 가져 오기와 함께 각각의 사용 예입니다.
내보내기 구문
// default exports
export default 42;
export default {};
export default [];
export default (1 + 2);
export default foo;
export default function () {}
export default class {}
export default function foo () {}
export default class foo {}
// variables exports
export var foo = 1;
export var foo = function () {};
export var bar;
export let foo = 2;
export let bar;
export const foo = 3;
export function foo () {}
export class foo {}
// named exports
export {};
export {foo};
export {foo, bar};
export {foo as bar};
export {foo as default};
export {foo as default, bar};
// exports from
export * from "foo";
export {} from "foo";
export {foo} from "foo";
export {foo, bar} from "foo";
export {foo as bar} from "foo";
export {foo as default} from "foo";
export {foo as default, bar} from "foo";
export {default} from "foo";
export {default as foo} from "foo";
가져 오기 구문
// default imports
import foo from "foo";
import {default as foo} from "foo";
// named imports
import {} from "foo";
import {bar} from "foo";
import {bar, baz} from "foo";
import {bar as baz} from "foo";
import {bar as baz, xyz} from "foo";
// glob imports
import * as foo from "foo";
// mixing imports
import foo, {baz as xyz} from "foo";
import foo, * as bar from "foo";
// just import
import "foo";
둘 다 유효합니다.
Method 1 provides named exports. The key here is that you can export more than one thing. This should be used instead of exporting an object with multiple properties. When you import a module with named exports, use import {a, b} from c
.
Method 2 provides the default export. There can be only one default export. This is primarily used when you are exporting a single thing, like a class
, or a single function
that you expect to be used without any additional support. When you import a module with a default export, use import d from c
.
Note that you can use both! so if you have a major, primary function with a handful of occasionally used helpers, you can export
the helpers, and export default
the primary. When you import a module and need both kinds of exports, use import d, {a, b} from c
.
One other option is that you can get named exports by listing them at the end of your module, like so: export {a,b,c}
. You can also rename them export {a as $a, b as c}
.
I got all of this from this article, which is the best source for up-to-date es6 module information that I've been able to find.
- Are both of these valid?
No, export function () { return answer; };
is invalid, either you use default, or you add a name to that function declaration.
- If so, why do they both exist?
They don't :)
- Are there other valid options for module exports using ES6 syntax?
You can see a lot of valid options here: https://github.com/eslint/espree/pull/43
참고URL : https://stackoverflow.com/questions/25494365/es6-javascript-module-export-options
'Nice programing' 카테고리의 다른 글
사용자가 BottomSheet에서 끌기 비활성화 (0) | 2020.10.06 |
---|---|
변수가 null 인 경우 표시 / 숨기기 방법 (0) | 2020.10.06 |
Android에서 View와 ViewGroup의 차이점 (0) | 2020.10.06 |
파이썬 hash () 함수 내장 (0) | 2020.10.06 |
mysql 테이블 열 데이터 유형을 얻는 방법은 무엇입니까? (0) | 2020.10.06 |