ES6模块化的导入和导出

简介: ES6模块化的导入和导出

导出1:

    //小明的js
    var name = '小明';
    var age = 20;
    function sum(num1,num2){
        return num1+num2;
    }
    var flag = true;
    if(flag){
        console.log(sum(10,20));
    }
    
    //导出,只能用这个写法,flag: flag,sum: sum不行
    export {
        flag, sum
    }

    //导出函数/类
    export function num(num1,num2){
        return num1*num2;
    }

    export class People{
        run(){
            console.log("在奔跑!!!");
        }
    }

导入1:

//小明的js
//导入
import {flag} from "./aaa.js";

    if(flag){
        console.log("小明牛皮吖~~~");
    }

//导入
import {num,People} from "./aaa.js";
console.log(num(100,1000));

const p = new People();
p.run();

导出2:

    //小红的js
    var obj = {};
    var flag = false;
    console.log("小红")
    
    //导出方式一
    export {
        flag
    }
    //导出方式二
    export var num1 = 100;
    export var num2 = 200;

    //只能有一个export default ,导入的时候可以随便命名,也不需要{}
    const name = 'fg'
    export default name;

导入2:

//小红的js

//导入
import {flag} from "./bbb.js";
    if(flag){
        console.log("小红好牛逼~~~");
    }

import {num1,num2} from "./bbb.js";
console.log(num1);
console.log(num2);

//导出全部
import * as bbb from "./bbb.js";
console.log(bbb.num1);
console.log(bbb.num2);

//export default导入,导入的时候可以随便命名,也不需要{}
import aaa from "./bbb.js";
console.log(aaa);

html:

<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script src="./aaa.js" type="module"></script>
    <script src="./bbb.js" type="module"></script>
    <script src="./aaa1.js" type="module"></script>
    <script src="./bbb1.js" type="module"></script>
</body>
</html>
目录
相关文章
|
SQL 分布式计算 数据处理
如何充分发挥 SQL 能力?
如何充分发挥 SQL 能力,是本篇文章的主题。本文尝试独辟蹊径,强调通过灵活的、发散性的数据处理思维,就可以用最基础的语法,解决复杂的数据场景。
158330 59
|
存储 监控 安全
智慧工地管理平台的技术架构和工作原理
智慧工地管理平台是将互联网+的理念和技术引入建筑工地,从施工现场源头抓起,最大程度的收集人员、安全、环境、材料等关键业务数据,依托物联网、互联网,建立云端大数据管理平台,形成“端+云+大数据”的业务体系和新的管理模式,打通从一线操作与远程监管的数据链条,实现劳务、安全、环境、材料各业务环节的智能化、互联网化管理,提升建筑工地的精益生产管理水平。实现“互联网+”与建筑工地的跨界融合,促进行业转型升级。
814 1
|
存储 负载均衡 调度
Docker 多主机部署:构建容器集群的最佳实践,助力高可用性与负载均衡
Docker 多主机部署:构建容器集群的最佳实践,助力高可用性与负载均衡
1244 0
|
存储 缓存 JSON
微信小程序使用本地存储方法
微信小程序使用本地存储方法
614 1
|
存储 关系型数据库 MySQL
MySQL触发器实战:自动执行的秘密
MySQL触发器实战:自动执行的秘密
347 3
|
12月前
|
设计模式 安全 Java
Java 多线程并发编程
Java多线程并发编程是指在Java程序中使用多个线程同时执行,以提高程序的运行效率和响应速度。通过合理管理和调度线程,可以充分利用多核处理器资源,实现高效的任务处理。本内容将介绍Java多线程的基础概念、实现方式及常见问题解决方法。
386 1
|
数据采集 运维 监控
自动化运维:用Python打造简易监控系统
【8月更文挑战第31天】在追求高效的IT世界里,自动化运维不再是奢侈品而是必需品。本文将通过一个Python示例,展示如何构建一个简单的系统监控工具。从数据采集到警报触发,我们将一步步解锁自动化的秘密,让你的服务器管理变得轻松而高效。
|
安全 网络安全 数据安全/隐私保护
计算机网络实验(思科模拟器Cisco Packet Tracer)——无线路由和防火墙配置
计算机网络实验(思科模拟器Cisco Packet Tracer)——无线路由和防火墙配置
计算机网络实验(思科模拟器Cisco Packet Tracer)——无线路由和防火墙配置
|
前端开发 Java API
Android端通过HttpURLConnection上传文件到服务器
Android端通过HttpURLConnection上传文件到服务器
256 0
|
安全 搜索推荐 API
仿牌外贸独立站/逆向淘宝代购集运系统怎么建设,怎么推广,怎么收款?
建设外贸独立站需选择Shopify或Magento等支持外贸的平台,注重网站设计与SEO优化,集成多平台API以同步商品信息。推广方面,利用社交媒体营销、网红合作和邮件营销吸引客户。收款方式应包括PayPal、Stripe等多渠道支付,并采用AB跳转技术及信用卡支付选项,以保证支付安全和便利性。通过综合策略,推动跨境电商业务增长。