javascript模块化(简)
这里书写一个个人理解以及整理的东西,关于模块化以及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模块化(简)的更多相关文章
- JavaScript 模块化简析
关于模块化,最直接的表现就是我们写的 require 和 import 关键字,如果查阅相关资料,就一定会遇到 CommonJS .CMD AMD 这些名词,以及 RequireJS.SeaJS 等陌 ...
- JavaScript模块化-require.js,r.js和打包发布
在JavaScript模块化和闭包和JavaScript-Module-Pattern-In-Depth这两篇文章中,提到了模块化的基本思想,但是在实际项目中模块化和项目人员的分工,组建化开发,打包发 ...
- JavaScript模块化演变 CommonJs,AMD, CMD, UMD(一)
原文链接:https://www.jianshu.com/p/33d53cce8237 原文系列2链接:https://www.jianshu.com/p/ad427d8879cb 前端完全手册: h ...
- Javascript模块化编程(三):require.js的用法
Javascript模块化编程(三):require.js的用法 原文地址:http://www.ruanyifeng.com/blog/2012/11/require_js.html 作者: 阮一峰 ...
- Javascript模块化编程(二):AMD规范
Javascript模块化编程(二):AMD规范 作者: 阮一峰 原文地址:http://www.ruanyifeng.com/blog/2012/10/asynchronous_module_d ...
- Javascript模块化编程(一):模块的写法
Javascript模块化编程(一):模块的写法 作者: 阮一峰 原文链接:http://www.ruanyifeng.com/blog/2012/10/javascript_module.html ...
- Javascript模块化编程(二):AMD规范(转)
这个系列的第一部分介绍了Javascript模块的基本写法,今天介绍如何规范地使用模块. (接上文) 七.模块的规范 先想一想,为什么模块很重要? 因为有了模块,我们就可以更方便地使用别人的代码,想要 ...
- Javascript模块化编程(一):模块的写法(转)
随着网站逐渐变成"互联网应用程序",嵌入网页的Javascript代码越来越庞大,越来越复杂. 网页越来越像桌面程序,需要一个团队分工协作.进度管理.单元测试等等......开发者 ...
- Javascript模块化规范
Javascript模块化规范 一.前端js模块化由来与演变 CommonJS 原来叫 ServerJS,推出 Modules/1.0 规范后,在 Node.js 等环境下取得了很不错的实践.09年下 ...
- Javascript模块化开发,使用模块化脚本加载工具RequireJS,提高你代码的速度和质量。
随着前端JavaScript代码越来越重,如何组织JavaScript代码变得非常重要,好的组织方式,可以让别人和自己很好的理解代码,也便于维护和测试.模块化是一种非常好的代码组织方式,本文试着对Ja ...
随机推荐
- Flutter学习四之实现一个支持刷新加载的列表
上一篇文章用Scaffold widget搭建了一个带底部导航栏的的项目架构,这篇文章就来介绍一下在flutter中怎么实现一个带下拉刷新和上拉加载更多的一个列表,这里用到了pull_to_refre ...
- 【FLASK】钩子函数的使用
from flask import Flask from flask import abort app = Flask(__name__) # 在第一次请求之前调用,可以在此方法内部做一些初始化操作 ...
- vue学习09 图片切换
目录 vue学习09 图片切换 定义图片数组:imgList:[],列表数据使用数组保存 添加图片索引:index 绑定src属性:使用v-bind,v-bind指令可以设置元素属性,比如src 图片 ...
- 微信小程序 A~Z城市选择器js文件
微信小程序城市选择 [a~z] 的所有城市选择 city.js a~z排序的城市数据 addressChoose.js 其他js文件可引用 city.js /** * Created by yvded ...
- 故意使用free掉的内存的一个实验( 常量区/栈)
故意使用free掉的内存的一个实验 考虑一下两种声明 struct stuff{ char home[10]; int num; char name[10]; }; struct stuff{ cha ...
- 08 . Jenkins之SpringCloud微服务+Vue+Docker持续集成
简介 大致流程 /* 1.开发人员每天把代码提交到Gitlab代码仓库 2.jenkins从gitlab中拉取项目源码,编译并打包成war包,然后构建Docker镜像,将镜像上传到Harbor私有仓库 ...
- 中部:执具 | R语言数据分析(北京邮电大学)自整理笔记
第5章工欲善其事.必先利其器 代码,是延伸我们思想最好的工具. 第6章基础编程--用别人的包和函数讲述自己的故事 6.1编程环境 1.R语言的三段论 大前提:计算机语言程序=算法+数据结构 小前提:R ...
- python图像的绘制
转载:https://blog.csdn.net/haoji007/article/details/52063168 实际上前面我们就已经用到了图像的绘制,如: io.imshow(img) 这一行代 ...
- 入职大厂,齐姐精选的 9 道 Java 集合面试题
Java 集合框架其实都讲过了,有一篇讲 Collection 的,有一篇讲 HashMap 的,那没有看过的小伙伴快去补下啦,文末也都有链接:看过的小伙伴,那本文就是检测学习成果的时候啦 今天这篇文 ...
- Linux系统编程—管道
▋****1. 管道的概念 管道,又名「无名管理」,或「匿名管道」,管道是一种非常基本,也是使用非常频繁的IPC方式. 1.1 管道本质 管道的本质也是一种文件,不过是伪文件,实际上是一块内核缓冲区, ...