0

0

JavaScript中import的详解(附示例)

不言

不言

发布时间:2018-12-11 09:27:48

|

14759人浏览过

|

来源于segmentfault

转载

本篇文章给大家带来的内容是关于javascript中import的详解(附示例),有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。

import 语句用于导入由另一个模块导出的绑定。无论是否声明了 strict mode,导入的模块都运行在严格模式下。import语句不能在嵌入式脚本中使用。

语法

import defaultExport from “module-name”;
import * as name from “module-name”;
import { export } from “module-name”;
import { export as alias } from “module-name”;
import { export1 , export2 } from “module-name”;
import { export1, export2 as alias2 , [...] } from “module-name”;
import defaultExport, { export [ , [...] ] } from “module-name”;
import defaultExport, * as name from “module-name”;
import “module-name”;

defaultExport

将引用模块默认导出的名称。

立即学习Java免费学习笔记(深入)”;

module-name

要导入的模块。这通常是包含模块的 .js 文件的相对或绝对路径名,可以不包括 .js 扩展名。某些打包工具可以允许或要求使用该扩展;检查你的运行环境,只允许单引号和双引号的字符串。

name

引用时将用作一种命名空间的模块对象的名称。

export,exportN

要导入的导出名称

alias,aliasN

将引用指定的导入的名称。

描述

name 参数是“模块对象”的名称,它将用一种名称空间来引用导出。导出参数指定单个命名导出,而import * as name 语法导入所有导出。

导入整个模块的内容

这将 myModule 插入当前作用域,其中包含来自位于 /modules/my-module.js 文件导出的所有模块。

OpenCV
OpenCV

开源计算机视觉库拥有超过2500个算法,提供详细的文档和实时计算机视觉的示例代码。它可以在Windows、Linux、Mac OS X、Android、iOS上运行,并通过JavaScript在您的浏览器中使用。语言:C++、Python、Julia、Javascript主页:https://opencv.org问答论坛:https://forum.opencv.org/文档:https://docs.opencv.org源代码:https://github.com/opencv请特别关注我们的教程!ht

下载
import * as myModule from ‘/modules/my-module.js’;

在这里,访问导出意味着使用模块名称(在这种情况下为”myModule”)作为命名空间。例如,如果上面导入的模块包含一个doAllTheAmazingThings(),你可以这样调用:

myModule.doAllTheAmazingThings();

导入单个导出

给定一个名为 myExport 的对象或值,它已经从模块 my-module 导出(因为整个模块被导出)或显式导出(使用 export 语句),将 myExport 插入到当前作用域。

import { myExport } from ‘/modules/my-module.js’;

导入多个导出

将 foo 和 bar 插入当前作用域。

import { foo, bar } from ‘/modules/my-module.js’;

导入带有别名的导出

导入时可以重命名导出,例如,将shortName 插入当前作用域。

import { reallyReallyReallyLongModuleExportName as shortName } from “/modules/my-module.js”;

导入时重命名多个导出

使用别名导入模块的多个导出。

import {
    reallyReallyReallyLongModuleMemberName as shortName,
    anotherLongModuleName as short
} form “/modules/my-module.js”;

仅为副作用而导入一个模块

模块仅为副作用(中性词、无贬义含义)而导入,而不是导入模块中的任何内容,这将运行模块中的全局代码,但实际上不导入任何值。

import “/modules/my-module.js”

导入默认值

在 default-export (无论是对象、函数、类等)有效时可用。然后可以使用 import 语句来导入这样的默认值。
最简单的用法是直接导入默认值:

import myDefault from “/modules/my-module.js”;

也可以同时将 default 语法与上述用法(命名空间导入和命名导入)一起使用。在这种情况下,default 导入必须首先声明。

import myDefault, * as myModule from “/modules/my-module.js”;

或者

import myDefault, { foo, bar } from “/modules/my-module.js”;

示例

从辅助模块导入以协助处理 AJAX DSON 请求。

模块:file.js

function getJSON(url, callback){
    let xhr = new XMLHttpRequest();
    xhr.onload = function () {
        callback(this.responseText)
    };
    xhr.open(‘GET’, url, true);
    xhr.send();
}
export function getUserFulContents(url, callback){
    getJSON(url, data => callback(JSON.parse(data)));
}

主程序:main.js

import { getUserFulContents } from “/modules/file.js”;
getUserFulContents(‘http://www.example.com”, 
    data => { doSomethingUseful(data); } )

补充

strict mode
严格模式
嵌入式脚本

相关文章

java速学教程(入门到精通)
java速学教程(入门到精通)

java怎么学习?java怎么入门?java在哪学?java怎么学才快?不用担心,这里为大家提供了java速学教程(入门到精通),有需要的小伙伴保存下载就能学习啦!

下载

相关标签:

本站声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

相关专题

更多
ip地址修改教程大全
ip地址修改教程大全

本专题整合了ip地址修改教程大全,阅读下面的文章自行寻找合适的解决教程。

86

2025.12.26

压缩文件加密教程汇总
压缩文件加密教程汇总

本专题整合了压缩文件加密教程,阅读专题下面的文章了解更多详细教程。

50

2025.12.26

wifi无ip分配
wifi无ip分配

本专题整合了wifi无ip分配相关教程,阅读专题下面的文章了解更多详细教程。

100

2025.12.26

漫蛙漫画入口网址
漫蛙漫画入口网址

本专题整合了漫蛙入口网址大全,阅读下面的文章领取更多入口。

293

2025.12.26

b站看视频入口合集
b站看视频入口合集

本专题整合了b站哔哩哔哩相关入口合集,阅读下面的文章查看更多入口。

589

2025.12.26

俄罗斯搜索引擎yandex入口汇总
俄罗斯搜索引擎yandex入口汇总

本专题整合了俄罗斯搜索引擎yandex相关入口合集,阅读下面的文章查看更多入口。

725

2025.12.26

虚拟号码教程汇总
虚拟号码教程汇总

本专题整合了虚拟号码接收验证码相关教程,阅读下面的文章了解更多详细操作。

63

2025.12.25

错误代码dns_probe_possible
错误代码dns_probe_possible

本专题整合了电脑无法打开网页显示错误代码dns_probe_possible解决方法,阅读专题下面的文章了解更多处理方案。

30

2025.12.25

网页undefined啥意思
网页undefined啥意思

本专题整合了undefined相关内容,阅读下面的文章了解更多详细内容。后续继续更新。

94

2025.12.25

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

相关下载

更多

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
React 教程
React 教程

共58课时 | 3万人学习

TypeScript 教程
TypeScript 教程

共19课时 | 1.8万人学习

Bootstrap 5教程
Bootstrap 5教程

共46课时 | 2.7万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号