1、模块简介

　　什么是模块：

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

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

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

　　使用示例：

　　文件 say.js

　　export function sayHi(user)

　　　　return `Hello ,${user}!`;

　　}

　　文件index.html

　　<!doctype html>

　　<script type="module">

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

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

　　</script>

　　核心模块功能

　　　　1)始终使用 use strict

　　　　2)模块级作用域

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

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

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

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

　　<script>

　　　　alert(this);//window

　　</script>

　　<script type = "moudle">

　　　　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 = ;

// 导出类

export class User {

  constructor(name) {

    this.name = name;

  }

}

　　声明后导出

 function sayHi(User){

     alert(`Hello,${User}!`);

 }

 fucntion sayBye(user)

     alert(`bye,${user}!`);

 }

 export{sayHi,sayBye};

　　指明导入的内容

 // 												


											
javaScript  基础知识汇总 （十五）的更多相关文章
	

    
						
  1. javaScript 基础知识汇总（五）
		
    1.垃圾回收 JavaScript 的内存管理是自动的,不能强制执行或者阻止执行 可达性 JavaScript中主要的内存管理概念是可达性. 什么是可达性? 定义一个对象 let user = { n ...
    
		
    2. 
						
  2. JavaScript 基础知识汇总目录
		
    一.标签.代码结构.现代模式.变量.数据类型.类型转换 GO 二.运算符.值的比较.交互.条件运算符.逻辑运算符 GO 三.循环 while 和 for .switch语句.函数.函数表达式和箭头函数 ...
    
		
    3. 
								
  3. javaScript 基础知识汇总 （十）
		
    1.New Function 语法:let func = new Function ([arg1[, arg2[, ...argN]],] functionBody) //无参数示例: let say ...
    
		
    4. 
						
  4. javaScript 基础知识汇总 （十二）
		
    1.属性的标志和描述符 属性的标志 对象属性除value外还有三个特殊属性,即标志 writable ----如果为true,则可以修改,否则它只是只读的. enumerable ----如果为tru ...
    
		
    5. 
						
  5. javaScript 基础知识汇总 （十四）
		
    1.回调 什么是回调? 个人理解,让函数有序的执行. 示例: function loadScript(src,callback){ let script = document.createElemen ...
    
		
    6. 
						
  6. JavaScript基础知识汇总
		
    1. 图片热区: <img src="logo.jpg" usemap="#logo"> <map id="logo" n ...
    
		
    7. 
						
  7. javascript基础学习（十五）
		
    javascript之cookie 学习要点: cookie介绍 创建与获取cookie cookie的编码 cookie的生存期 cookie的路径 cookie的domain cookie的sec ...
    
		
    8. 
						
  8. javaScript 基础知识汇总（三）
		
    1.循环:while 和 for while 循环 while(condition){ //代码 循环体 } do ... while  循环 let i =0; do { //循环体 }while( ...
    
		
    9. 
						
  9. javaScript 基础知识汇总（六）
		
    1.基本类型与对象的区别 基本类型:是原始类型的中的一种值. 在JavaScript中有6中基本类型:string number  boolean  symbol  null  undefined 对 ...
    
		
    10. 
		

	


随机推荐
	

    
									
  1. UFT安装
			
    1.下载解压双击setup.exe 2.点击安装 3.点击下一步 4.检测是否需要安装插件之后一路向下 5.安装之后图标 下载: 链接:https://pan.baidu.com/s/1sa0h037 ...
    
			
    2. 
						
  2. C 语言高效编程与代码优化
			
    译文链接:http://www.codeceo.com/article/c-high-performance-coding.html英文原文:Writing Efficient C and C Cod ...
    
			
    3. 
						
  3. 设置Fiddler来抓取Android接口数据
			
    1.下载安装fiddler,安装包可自行百度.安装完成打开fiddler 2.将Fiddler设置远程访问PC 选择Fiddler->Tools->Fiddler Option 3.选择C ...
    
			
    4. 
						
  4. Linux Ubuntu 查看IP
			
    一.第一种方式:ifconfig -a 1.打开命令终端:Crtl + Alt + T 2.执行命令:ifconfig -a 如果你没有安装net-tools工具,则出现如下显示: (没有找到'ifc ...
    
			
    5. 
						
  5. drf中的jwt使用与手动签发效验
			
    jwt认证 1)session存储token,需要数据库参与,耗服务器资源.低效 2)缓存存token,需要缓存参与,高效,不易集群 3)客户端存token,服务器存签发与交易token的算法,高效, ...
    
			
    6. 
						
  6. URL与URI与URN的区别与联系
			
    1.什么是URL? 统一资源定位符(或称统一资源定位器/定位地址.URL地址等[1],英语:Uniform Resource Locator,常缩写为URL),有时也被俗称为网页地址(网址).如同在网 ...
    
			
    7. 
						
  7. 两个不错的IT类优质号
			
    虽然标题已经被用烂了,但是我觉得还是用这样的方式介绍这两个不错的公众号,可能你们刚好需要,我刚好知道,仅此而已. 刚认识的一个小哥哥和一个小姐姐,他们都非常优秀,有喜欢Java和Linux的同学千万不 ...
    
			
    8. 
						
  8. 产品需求说明书PRD模版
			
    <软件自动化测试开发>出版了 XXX产品需求说明书 [版本号:V+数字]                 编  制: 日  期: 评  审: 日  期: 批  准: 日  期:       ...
    
			
    9. 
						
  9. cpupower frequency 无法设置userspace的问题
			
    Disable intel_pstate in grub configure file: $ sudo vi /etc/default/grub Append "intel_pstate=d ...
    
			
    10. 
						
  10. 会员VS广告：陷入两难抉择的视频网站该如何自救
			
    ​ 互联网实在是非常奇妙,其在让一个行业兴起时,却又对传统行业造成严重冲击.比如电商不断创造销售神话,由此成为线下实体店严重萎靡,客流量和销售额直线下降的重要原因之一.但与此同时,因互联网而狂奔的新兴 ...
    
			
    11.