首页 > 编程语言> 文章详细

javaScript 基础知识汇总（十五）

2019-09-12 11:04:16 阅读：280 来源： 互联网

标签：javaScript 汇总 js 基础知识 say export 模块 John sayHi

1、模块简介

　　什么是模块：

　　模块就是一个文件，一个脚本，通过关键字export 和 import 交换模块之间的功能。

　　export 关键字表示在当前模块之外可以访问的变量和功能。

　　import 关键字允许从其他模块中导入一些诸如函数之类的功能。

　　使用示例：

　　文件 say.js

　　export function sayHi(user)

　　　　return `Hello ,${user}!`;

　　}

　　文件index.html

　　<!doctype html>

　　　　import {sayHi} from './say.js';

　　　　document.body.innerHTML = sayHi('John");

　　</script>

　　核心模块功能

　　　　1)始终使用 use strict

　　　　2)模块级作用域

　　　　　　每个模块都有自己的作用域

　　　　3)模块代码仅在第一次导入时解析

　　顶级 “this" 是未定义的（undefined）

　　　　在模块中的this与模块中的区别是普通脚本中的this 是window 而模块中的this则是undefined

　　　　alert(this);//window

　　</script>

　　　　alert(this);//undefined

　　</script>

　　模块脚本是延迟解析的

外部模块脚本 <script type="module" src="..."> 不会阻塞 HTML 的解析，它们与其他资源并行加载。
直到 HTML 文档完全解析渲染后（即使模块脚本比 HTML 先加载完成），模块脚本才会开始运行。
执行脚本的相对顺序：在前面的先执行。

　　不允许裸模块

　　　　import {sayHi} from 'sayHi'; // Error，“裸”模块
　　　　// 模块必须提供路径，例如 './sayHi.js'

2、模块的导入导出

　　声明前导出　　

  
// 导出数组
export let months = ['Jan', 'Feb', 'Mar','Apr', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];

// 导出 const 声明的变量
export const MODULES_BECAME_STANDARD_YEAR = 2015;

// 导出类
export class User {
  constructor(name) {
    this.name = name;
  }
}

　　声明后导出

1 function sayHi(User){
2     alert(`Hello,${User}!`);
3 }
4 fucntion sayBye(user)
5     alert(`bye,${user}!`);
6 }
7 export{sayHi,sayBye};

　　指明导入的内容

1 //

标签：javaScript,汇总,js,基础知识,say,export,模块,John,sayHi
来源： https://www.cnblogs.com/xiaoqiyaozou/p/11510663.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

javaScript 基础知识汇总 （十五）

1、模块简介

2、模块的导入导出

javaScript 基础知识汇总（十五）