js文档部分：

let str = {realname:"张三",age:18}
 
let cont = (num)=>{
	console.log(num);
	return num*10;
}
 
 
let tabt = [1,2,3,4,5];

导出类型有以下两种方式:    export {str,cont,tabt};                  export default str

导入类型有以下两种方式:        import {str,cont,tabt} from "./daochu.js";     

                import  a  from "./daochu.js";

import   后面接数据名   from   后面接js存储地址

修改导出数据名使用as  , 传一个值使用 export default

注：修改一个值，不用使用as修改数据名，同时也不用加{ }，否则会报错

根据上面的知识点，下面会详细操作给大家查看：

js内容传出数据（多个）：

let str = {realname:"张三",age:18}

let cont = (num)=>{
    console.log(num);
    return num*10;
}

let tabt = [1,2,3,4,5];
//导出
export {str,cont,tabt};

HTML传入数据（及修改数据内容）多个：

    //导入
            import {str,cont,tabt} from "./daochu.js";
            //调用函数并赋值；
             let text = cont(10);
             console.log(text);
            
            //改变对象内部的值
            str.realname = "李四";
             console.log(str);
            
             //增加数组的长度
              let box = tabt.length+1;
              console.log(box);
              //在数组中添加数据
                tabt.push(10);
               console.log(tabt);
               tabt.unshift(8);
               console.log(tabt);
             //在对象中添加数据
            str.sex="男";
            console.log(str);   
              

在HTMl中通过as修改数据名：

//导入
            import {str as bbt,cont,tabt} from "./daochu.js";
            //调用函数并赋值；
             let text = cont(10);
             console.log(text);
            
            //改变对象内部的值
            bbt.realname = "李四";
             console.log(bbt);
            
             //增加数组的长度
              let box = tabt.length+1;
              console.log(box);
              //在数组中添加数据
                tabt.push(10);
               console.log(tabt);
               tabt.unshift(8);
               console.log(tabt);
             //在对象中添加数据
            bbt.sex="男";
            console.log(bbt);   

js传出数据，只传一个数据：

let str = {realname:"张三",age:18}

let cont = (num)=>{
    console.log(num);
    return num*10;
}

let tabt = [1,2,3,4,5];
//导出
export default str

HTML传入数据以及更改数据名：

    import  dll  from "./daochu.js";

理论讲解： 

通过export命令显式指定输出的代码，再通过import命令输入。export default命令的本质是将后面的值，赋给default变量。

 export和export default的区别

两者的相同点与区别点如下：

1、两者均可用于导出常量、函数、文件、模块；

2、在一个文件中可以多次使用export，但是export default只能用一次；

3、通过export输出的，在import导入时需要使用{}，export default不需要；

4、export与export default不可同时使用；

import基础用法

使用export命令定义了模块的对外接口以后，其他 JS 文件就可以通过import命令加载这个模块。

只读

import命令输入的变量都是只读的，因为它的本质是输入接口。也就是说，不允许在加载模块的脚本里面，改写接口。

aa = {}; // Syntax Error : 'a' is read-only;

模块引入的第二个方式

更多知识查询可以点击下方链接：

4.4 ES6 模块 | 菜鸟教程