MDN’s new design is in Beta! A sneak peek: https://blog.mozilla.org/opendesign/mdns-new-design-beta/

export

This translation is incomplete. Please help translate this article from English.

export statement ใช้สำหรับ export functions, objects หรือ primitives จากไฟล์ (หรือ โมดูล (module)).

Note: ความสามารถนี้ยังไม่สามารถใช้งานได้กับบราวเซอร์ (browsers) ที่มีอยู่ในขณะนี้ได้ . แต่สามารใช้ตัวแปลง (transpilers) , อย่างเช่น Traceur CompilerBabel หรือ Rollup ช่วยได้

Syntax

export { name1, name2, …, nameN };
export { variable1 as name1, variable2 as name2, …, nameN };
export let name1, name2, …, nameN; // also var
export let name1 = …, name2 = …, …, nameN; // also var, const

export expression;
export default expression;
export default function (…) { … } // also class, function*
export default function name1(…) { … } // also class, function*
export { name1 as default, … };

export * from …;
export { name1, name2, …, nameN } from …;
export { import1 as name1, import2 as name2, …, nameN } from …;
nameN
เป็นตัวระบุ (Identifier) ถึงการส่งออกแล้ว (exported) (ดังนั้นจึงสามารถนำเข้า (imported) ด้วยคำสั่ง import ในสคริป (script) อื่นได้).

Description

There are two different types of export, each type corresponds to one of the above syntax:

  • Named exports:
    export { myFunction }; // exports a function declared earlier
    export const foo = Math.sqrt(2); // exports a constant
  • Default exports (only one per script):
    export default function() {} // or 'export default class {}'
    // there is no semi-colon here

Named exports are useful to export several values. During the import, one will be able to use the same name to refer to the corresponding value.

Concerning the default export, there is only a single default export per module. A default export can be a function, a class, an object or anything else. This value is to be considered as the "main" exported value since it will be the simplest to import.

Examples

Using named exports

In the module, we could use the following code:

// module "my-module.js"
function cube(x) {
  return x * x * x;
}
const foo = Math.PI + Math.SQRT2;
export { cube, foo };

This way, in another script (cf. import), we could have:

import { cube, foo } from 'my-module';
console.log(cube(3)); // 27
console.log(foo);    // 4.555806215962888

Using the default export

If we want to export a single value or to have a fallback value for our module, we could use a default export:

// module "my-module.js"
export default function cube(x) {
  return x * x * x;
}

Then, in another script, it will be straightforward to import the default export:

import cube from 'my-module';
console.log(cube(3)); // 27

Note that it is not possible to use var, let or const with export default.

Specifications

Specification Status Comment
ECMAScript 2015 (6th Edition, ECMA-262)
The definition of 'Exports' in that specification.
Standard Initial definition.
ECMAScript 2017 Draft (ECMA-262)
The definition of 'Exports' in that specification.
Draft  

Browser compatibility

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari
Basic support No support No support No support No support No support
Feature Android Chrome for Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Basic support No support No support No support No support No support No support

See also

Document Tags and Contributors

 ผู้มีส่วนร่วมกับหน้านี้: sbayit
 อัปเดตล่าสุดโดย: sbayit,