ES6导入导出

默认导入导出:

导出(定义“”):
  对象:export default { ... }   
  函数:export default  function fun() { ... }   
  变量:export default  12  
对应的导入方式(定义“”): import <任意名> from '模块路径'
 
按需导入导出:
导出变量: export var a = 10 【按需导出】
导出函数: export function Fun() {...}  【按需导出】
导出对象: export var b= {...}
对应的导入方式(“克隆”): import { a, Fun, b as c} from ‘模块路径’ 【按需导入】
 
注意:一个模块只能默认导出一个,而按需导出是多个。
 
 
示例:导出:
export var a= "按需导出变量";
export function Fun() {
    console.log("按需导出函数");
}
export var obj = {
    name: '小庄',
    age: '男'
}
export default 12;

导入:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script type="module">
        import {a,Fun,obj} from "./text.js"
        
        console.log(a);
        Fun();
        console.log(obj.name)

        console.log("---------------默认导出---------------");
        import xm from "./text.js"
        console.log(xm)
    </script>
</head>
<body>
    
</body>
</html>

 

posted @ 2021-03-29 21:24  小庄的blog  阅读(165)  评论(0编辑  收藏  举报