Shulou(Shulou.com)06/02 Report--

This article mainly introduces the meaning of export in javascript. It has a certain reference value. Interested friends can refer to it. I hope you will gain a lot after reading this article. Let's take a look at it.

In JavaScript, export means "export"; all declarations within the module in JavaScript are local, and the module can be exported using the export keyword, which can appear anywhere in the module, and other JS files can load the module through the import command after exporting the module.

The operating environment of this tutorial: windows10 system, javascript1.8.5 version, Dell G3 computer.

What does export mean in javascript

By default, all declarations within the module in JavaScript are local and cannot be accessed externally. If you need to expose some of the declared content in the module and let other modules use it, you need to export the function at this time. The easiest way is to add the export keyword export module.

What you can export includes classes, functions, and variables decorated by var, let, and const. The export command can appear anywhere in the module, as long as it is at the top level of the module. If you are in block-level scope, an error is reported, as is the import command.

Once the external interface of the module is defined using the export command, other JS files can load the module through the import command.

The import command has a lifting effect and is promoted to the head of the entire module, which is executed first. Because import is executed statically, expressions and variables cannot be used, and the syntax structure of the result can only be obtained at run time.

1. Default Import and Export default import/export

Each module has only one default export, which can be a function, class,object, and so on. Because this method is regarded as the main export content, the import method is the easiest.

/ / there is no semi-colon hereexport default function () {} export default class {} / sample class An extends Component {...} export default Akerbank / corresponding import example. Import A from'. / requireTest'//default export, enter an import statement in the lodash module import _ from 'lodash';//, and enter the default method and other variables import _, {each} from' lodash';// corresponding to the export statement export default function (obj) {/ /} export function each (obj, iterator, context) {/ /} export {each as forEach}

Note: a module allows only one default object to be exported, and the actual export is a default-named variable for renaming. The equivalent statement is as follows. So import can be followed by any variable name, and {} is not required.

Import any from'. / requireTest'import {default as any} from'. / requireTest'

II. Import and export of named

It should be noted that the export command specifies the external interface and must establish an one-to-one correspondence with the variables within the module. In addition, the interface output by the export statement and its corresponding value is a dynamic binding relationship, that is, through this interface, the real-time value within the module can be obtained.

The import command accepts a pair of curly braces that specify the name of the variable to import from another module. The variable name in the curly braces must be the same as the external interface name of the imported module (profile.js). If you want to rename the entered variable, the import command uses the as keyword to rename the entered variable.

The from after import specifies the location of the module file, either relative or absolute, and the .js path can be omitted. If it is just the name of the module without a path, then there must be a configuration file that tells the JavaScript engine the location of the module.

/ / profile.js// the first type of exportexport var firstName = 'Michael';export function f () {}; / / the second kind of export, giving priority to var firstName =' Michael';export {firstName}; function f () {} export {f}; / / main.jsimport {firstName, f} from'. / profile';import {firstName as surname} from'. / profile'

III. Rename Import and Export

Export {myFunction}; / / exports a function declared earlierexport const foo = Math.sqrt (2); / / exports a constant

When import the export content of different modules, you must maintain the uniqueness of naming. Renaming can be used to solve this problem, including the following two categories.

/ / rename function v1 () {...} function v2 () {...} export {v1 as streamV1, v2 as streamV2, v2 as streamLatestVersion / / you can export the same value} with two different names on export; / / rename / / both modules will export something named `flip` on import. To import both, you need to change the name of one of them. Import {flip as flipOmelet} from "eggs.js"; import {flip as flipHouse} from "real-estate.js"

IV. Compound writing of export and import

If you input and then output the same module in a module, the import statement can be written together with the export statement.

Export {foo, bar} from 'my_module';// is equivalent to import {foo, bar} from' my_module';export {foo, bar}; Thank you for reading this article carefully. I hope the article "what is the meaning of export in javascript" shared by the editor will be helpful to you. At the same time, I hope you will support us, pay attention to the industry information channel, and more related knowledge is waiting for you to learn!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.