Maison > interface Web > js tutoriel > le corps du texte

Comment implémenter l'importation et l'exportation en javascript (code ci-joint)

不言
Libérer: 2018-08-22 17:56:23
original
3804 Les gens l'ont consulté

Le contenu de cet article concerne la mise en œuvre de l'importation et de l'exportation en JavaScript (avec code). Il a une certaine valeur de référence. Les amis dans le besoin peuvent s'y référer.

Importation et exportation de nœuds

Un JavaScript fichier peut exporter exprots d'innombrables variables, fonctions et objets, mais require() n'a besoin de charger JS qu'une seule fois. Par conséquent, après avoir été invisible, un espace de noms de niveau supérieur sera ajouté.

Importer un module vide est un objet vide, et un module est un objet.

Méthode d'export :

  • exports, exporter la formule entière

  • module.exports, exporter la partie d'affectation

Méthode d'importation :

  • reuire()

// 导出一个变量
exports.a = 10;

// 导入该变量
let b = require('./export')

// 导入的形式 `console.log(b)`输出导入的值:
// { a: 10 }
Copier après la connexion
// 导出一个变量,直接需要变量值使用.
// module.exports = 'name';

// 导入该变量
let b = require('./export')

// 导入的形式 `console.log(b)`输出导入的值:
// name
Copier après la connexion
// 导出对象
module.exports = {
  name1: 123,
  name2: 456
}

// 导入该变量
let b = require('./export')

// 导入的形式 `console.log(b)`输出导入的值:
// { name1: 123, name2: 456 }
Copier après la connexion
// 导出对象
exports.msg = {
  name1: 1,
  name2: 2
}

// 导入该变量
let b = require('./export')

// 导入的形式 `console.log(b)`输出导入的值:
// { msg: { name1: 1, name2: 2 } }
Copier après la connexion
// 导出函数
exports.showMsg = function () {
}

// 导入该变量
// let b = require('./export')

// 导入的形式 `console.log(b)`输出导入的值:
// { showMsg: [Function] }

// 在 引用结果 需要  通过  变量 引用对象 执行
// var b= require();
// b.showMsg();
Copier après la connexion
// 导出函数
module.exports = function () {
}

// 导入该变量
let b = require('./export')

// 导入的形式 `console.log(b)`输出导入的值:
// [Function]

// 引入文件的 变量  直接执行
Copier après la connexion

Méthodes d'exportation couramment utilisées pour les objets et les fonctions : module.exports

Importation et exportation ES6 et TS

Exportation : export
Importation : import

Remarque :

  • Exporter et importer, sauf en utilisant as, les noms de variables sont les mêmes

  • exporter Un fichier, la valeur par défaut est un objet vide

  • Utiliser directement le fichier importé pour définir le nom de la variable, exécuter directement le

  • default exporter, dans l'importé Vous pouvez prendre n'importe quel nom de variable

  • export defaultLe module d'exportation par défaut ne peut pas utiliser {}exportation d'objet

// 导出一个常量
export const foo = Math.sqrt(2)

// 导入
import { foo } from './export'
import * as Tools from './export' // 使用 Tools.foo
Copier après la connexion
function myFunction () {}
// 导出已经声明的函数
export { myFunction }

导入
import { myFunction } from './export'
Copier après la connexion
// 多个导出
export function cube(x: number): number {
    return x * x * x
}
const foo: number = Math.PI * Math.sqrt(2)
export { foo } // 导出多个

// 导入
import { cube, foo } from './export'
Copier après la connexion
// 导出函数
export default function () {}
export default function fun () {}

// 导入
import myFunction from './export' // 可以取任意变量名
// 如果导出默认,定义函数名或者变量名,或者类名
// 导入的时候可以写和原来相同名字,也可以取任意变量名
Copier après la connexion
// 导出类
export default class {}

// 导入
import Test from './export'
Copier après la connexion

Un fichier (module) ne peut avoir qu'un seul export par défaut, qui peut être une classe, une fonction, un objet, etc.

Importer le contenu du module entier et insérez la variable export dans la portée actuelle, y compris toutes les liaisons d'exportation dans le fichier export (y compris export default) :

// 导出多个模块
export function query () {}
export function update () {}

// 导入
import * as API from './export'
Copier après la connexion

Importez l'intégralité du module en tant que fonction supplémentaire, mais ne pas importer les membres exportés du module :

import 'my-module'
Copier après la connexion

Recommandations associées :

Import et export Excel

Problèmes d'importation et d'exportation Oracle

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal
À propos de nous Clause de non-responsabilité Sitemap
Site Web PHP chinois:Formation PHP en ligne sur le bien-être public,Aidez les apprenants PHP à grandir rapidement!