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  阅读(167)  评论(0)  编辑  收藏  举报