这里书写一个个人理解以及整理的东西,关于模块化以及ES6语法推荐大家阅读阮一峰老师的ES6入门教程 地址:https://es6.ruanyifeng.com/

比较散,请见谅

以前的js是没有模块化这个概念,随着ES6的引入,使我们的代码能够优雅。

模块不是对象,所以本质上还是需要什么加载什么

1、这里有一个city.js

1 // 这里定义一个数据
2 const cityList = [
3 {name: '北京'},
4 {name: ‘上海’}
5 ]
6
7 // 这里使用扩展
8 module.exports = { cityList }

然后在需要引入的地方,如mais.js

// es6使用import来引入

import { cityList } form 'city.js'

// 借此,数据就可以使用了
console.log(cityList)

2、当然不止是数据可以引出,方法也如此,同样的位置

1 const getList = () => {
2 // 筛选出name为北京的项
3 return cityList.filter(item => item.name === '北京')
4 }
5
6 module.exports = { cityList, getList } // 抛出

在其他位置使用,如home.js

1 import { getList } from 'city.js' 2 3 // 使用 4 getList()

很有趣的,在不同的位置引入,只取所需。

作者: 一个热爱改BUG的猴子

javascript模块化(简)的更多相关文章

  1. JavaScript 模块化简析

    关于模块化,最直接的表现就是我们写的 require 和 import 关键字,如果查阅相关资料,就一定会遇到 CommonJS .CMD AMD 这些名词,以及 RequireJS.SeaJS 等陌 ...

  2. JavaScript模块化-require.js,r.js和打包发布

    在JavaScript模块化和闭包和JavaScript-Module-Pattern-In-Depth这两篇文章中,提到了模块化的基本思想,但是在实际项目中模块化和项目人员的分工,组建化开发,打包发 ...

  3. JavaScript模块化演变 CommonJs,AMD, CMD, UMD(一)

    原文链接:https://www.jianshu.com/p/33d53cce8237 原文系列2链接:https://www.jianshu.com/p/ad427d8879cb 前端完全手册: h ...

  4. Javascript模块化编程(三):require.js的用法

    Javascript模块化编程(三):require.js的用法 原文地址:http://www.ruanyifeng.com/blog/2012/11/require_js.html 作者: 阮一峰 ...

  5. Javascript模块化编程(二):AMD规范

    Javascript模块化编程(二):AMD规范   作者: 阮一峰 原文地址:http://www.ruanyifeng.com/blog/2012/10/asynchronous_module_d ...

  6. Javascript模块化编程(一):模块的写法

    Javascript模块化编程(一):模块的写法 作者: 阮一峰 原文链接:http://www.ruanyifeng.com/blog/2012/10/javascript_module.html ...

  7. Javascript模块化编程(二):AMD规范(转)

    这个系列的第一部分介绍了Javascript模块的基本写法,今天介绍如何规范地使用模块. (接上文) 七.模块的规范 先想一想,为什么模块很重要? 因为有了模块,我们就可以更方便地使用别人的代码,想要 ...

  8. Javascript模块化编程(一):模块的写法(转)

    随着网站逐渐变成"互联网应用程序",嵌入网页的Javascript代码越来越庞大,越来越复杂. 网页越来越像桌面程序,需要一个团队分工协作.进度管理.单元测试等等......开发者 ...

  9. Javascript模块化规范

    Javascript模块化规范 一.前端js模块化由来与演变 CommonJS 原来叫 ServerJS,推出 Modules/1.0 规范后,在 Node.js 等环境下取得了很不错的实践.09年下 ...

  10. Javascript模块化开发,使用模块化脚本加载工具RequireJS,提高你代码的速度和质量。

    随着前端JavaScript代码越来越重,如何组织JavaScript代码变得非常重要,好的组织方式,可以让别人和自己很好的理解代码,也便于维护和测试.模块化是一种非常好的代码组织方式,本文试着对Ja ...

随机推荐

  1. 【原创】K8S使用ceph-csi持久化存储之RBD

    一.集群和组件版本 K8S集群:1.17.3+Ceph集群:Nautilus(stables)Ceph-CSI:release-v3.1snapshotter-controller:release-2 ...

  2. 刷题[RCTF 2019]Nextphp

    前置知识 一些关于php7.4版本需知: 1.FFI扩展:ffi.cdef 其中还有这样一段话 如果ffi.cdef没有第二个参数,会在全局查找,第一个参数所声明的符号.意思就是其在不传入第二个参数时 ...

  3. vue学习02-v-text

    vue学习02-v-text 引入环境版本,cdn网络引用或者本地js应用 html的结构,一般是div 创建vue实例 el:挂载点 v-text指令的作用是设置标签的内容 默认写法会替换全部内容, ...

  4. win10病毒和威胁防护无法重新启动解决方法

    1.检查电脑中是否安装了任何的第三方反病毒软件 (例如 360.腾讯电脑管家等)?如果有的话,麻烦您将其卸载,卸载完毕后重启设备,再看一下病毒和威胁防护能否正常启动:2.按 "Windows ...

  5. [译]await VS return VS return await

    原文地址:await vs return vs return await作者:Jake Archibald 当编写异步函数的时候,await,return,return await三者之间有一些区别, ...

  6. 硬核测试:Pulsar 与 Kafka 在金融场景下的性能分析

    背景 Apache Pulsar 是下一代分布式消息流平台,采用计算存储分层架构,具备多租户.高一致.高性能.百万 topic.数据平滑迁移等诸多优势.越来越多的企业正在使用 Pulsar 或者尝试将 ...

  7. CF600E Lomsat gelral 树上启发式合并

    题目描述 有一棵 \(n\) 个结点的以 \(1\) 号结点为根的有根树. 每个结点都有一个颜色,颜色是以编号表示的, \(i\) 号结点的颜色编号为 \(c_i\)​. 如果一种颜色在以 \(x\) ...

  8. 获取豆瓣读书所有热门标签并保存到mongodb数据库

    目标url:https://book.douban.com/tag/?view=type&icn=index-sorttags-all 目的:抓取所有标签名称(tag_name),标签链接(t ...

  9. 浅谈BSGS

    用于求解形如\(a^x≡b\mod p\)的最小非负整数解\(x\). 由欧拉定理\(a^{\phi(p)}≡1\mod p\)可以知道,我们找的解如果有解则一定在\(\phi(p)\)范围内,而最大 ...

  10. 在阿里云上搭建私有GIT仓库

    在阿里云上搭建私有GIT仓库 年轻人就得好好学习,不能这么颓废 最近做项目练练手,用到了github, 但是github访问速度是真的慢啊,下载项目,下载一天了.所以呢,我是个成熟的人了,只好自己搭建 ...