* 引入AMD加载方式: require.js CDN

https://cdn.bootcss.com/require.js/2.3.5/require.js

*  创建模块文件./js/util/date.js

(function (global, factory) {
typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
typeof define === 'function' && define.amd ? define(factory) :
(global.DateUtil = factory());
}(this, function() {
/**
按所给的时间格式输出指定的时间
格式说明
对于 2014.09.05 13:14:20
yyyy: 年份,2014
yy: 年份,14
MM: 月份,补满两位,09
M: 月份, 9
dd: 日期,补满两位,05
d: 日期, 5
HH: 24制小时,补满两位,13
H: 24制小时,13
hh: 12制小时,补满两位,01
h: 12制小时,1
mm: 分钟,补满两位,14
m: 分钟,14
ss: 秒,补满两位,20
s: 秒,20
w: 星期,为 ['日', '一', '二', '三', '四', '五', '六'] 中的某一个,本 demo 结果为 五 e.g.
formatDate(new Date(1409894060000), 'yyyy-MM-dd HH:mm:ss 星期w')
2014-09-05 13:14:20 星期五
*/
function formatDate(t, str) {
var obj = {
yyyy: t.getFullYear(),
yy: ("" + t.getFullYear()).slice(-2),
M: t.getMonth()+1,
MM: ("0"+(t.getMonth()+1)).slice(-2),
d: t.getDate(),
dd: ("0"+t.getDate()).slice(-2),
H: t.getHours(),
HH: ("0"+t.getHours()).slice(-2),
h: t.getHours() % 12,
hh: ("0"+(t.getHours()%12)).slice(-2),
m: t.getMinutes(),
mm: ("0"+t.getMinutes()).slice(-2),
s: t.getSeconds(),
ss: ("0"+t.getSeconds()).slice(-2),
w: ['日', '一', '二', '三', '四', '五', '六'][t.getDay()]
};
return str.replace(/([a-z]+)/ig, function($1) {
return obj[$1];
});
} return {
formatDate: formatDate
}
}));

 

* 配置amd方式加载的配置文件 config.js

+1 Line:  "date": "js/util/date"

require.config({
paths : {
"jquery": "bootstrap/js/jquery-1.10.2.min",
'jquery-cookie': "bootstrap/js/jquery.cookie",
"url-param": "js/util/getUrlParam",
"date": "js/util/date"
},
shim: {
'jquery-cookie': {
deps: ['jquery']
},
'bootstrap': {
deps: ['jquery']
}
}
});

  

* 使用这个模块 对日期格式化 

require(['date'], function(DateUtil) {
// 转换为这样的格式2018.2.1
var ds = DateUtil.formatDate(new Date(), "yyyy.M.d");
});

 

* 总结

** 全局环境不一定是window

(function(global) {console.log(global)})(this)

  运行结果:

- 在浏览器下:

Window {postMessage: ƒ, blur: ƒ, focus: ƒ, close: ƒ, frames: Window, …}

- 在node环境

{}

** 不使用amd方式加载的话, 会执行这行

global.DateUtil = factory()   // 这里的DateUtil为该模块的名字  可以是jQuery, Vue...

(function (global, factory) {
typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
typeof define === 'function' && define.amd ? define(factory) :
(global.DateUtil = factory());
}(this, function() {
function m1() {}
function m2() {}
// ...
// 封装一组方法
return {
method1: m1,
method2: m2,
// ...
}
});

  Usage:   DateUtil.method1(), DateUtil.method2()...

* 简单的自定义异步加载js的函数

/**
* 动态引入javascript文件,
* Usage:
* function script_onload() {
* alert(1);
* }
* var load_js = new Script(script_onload);
* load_js.set("http://static.gongju.com/js/jquery-1.4.4.min.js");
* @param id: domid [optional]
* @param callback js文件加载完了callback function
*/
function Script(callback) {
var js = document.createElement("script");
this.js = js;
js.type = "text/javascript";
document.body.appendChild(js); Script.prototype.set = function(url, id) {
this.js.src = url;
id && (this.js.id = id);
};
if (callback) {
if (navigator.appName.toLowerCase().indexOf('netscape') === -1) {
js.onreadystatechange = function() {
js.readyState === 'complete' && callback(this);
}
} else {
js.onload = function() {
callback(this);
}
}
}
}

  

javascript Date 日期格式化 formatDate, require.js 模块 支持全局js引入 / amd方式加载的更多相关文章

  1. SpringBoot返回date日期格式化

    SpringBoot返回date日期格式化,解决返回为TIMESTAMP时间戳格式或8小时时间差 问题描述 在Spring Boot项目中,使用@RestController注解,返回的java对象中 ...

  2. 能否使用require('.json')的方式加载大量JSON文件?

    Node.js中推崇非阻塞I/O,但是require一个模块时却是同步调用的,这会带来性能上的开销,但并不是每次require都很耗时,因为在require成功之后会缓存起来,在此加载时直接从缓存读取 ...

  3. js Date 日期格式化(转)

    var myDate = new Date();myDate.getYear();        //获取当前年份(2位)myDate.getFullYear();    //获取完整的年份(4位,1 ...

  4. JavaScript Date日期对象以及日期格式化方法

    前言 Date对象是javascript语言中内置的数据类型,用于提供日期和时间的操作接口.Date对象是在早期java中的java.util.Date类基础上创建的,为此,Date类型使用自UTC1 ...

  5. js的 new Date()日期格式化显示以及js获取时间戳

    一.日期格式化显示: 对 new Date() 得到日期的进行格式显示扩展,扩展方法如下: // 对Date的扩展,将 Date 转化为指定格式的String // 月(M).日(d).小时(h).分 ...

  6. javascript Date日期类

      四.Date日期类 迁移时间:2017年5月27日18:43:02 Author:Marydon (一)对日期进行格式化(日期转字符串) 自定义Date日期类的format()格式化方法 方式一: ...

  7. Date 日期格式化

    <span id="time"></span> <script> //名称:日期加法函数 //参数:part(year.month.day.ho ...

  8. js 自己创建ready多个可以依次加载

    js会把相同的方法名给覆盖了,很多时候我们都无法再页面加载的时候写多个onload事件,这样只有最后一个才能起效,所以从网上找了找,最后决定自己写一个,例子很简单,希望有高人来指导指导 <!DO ...

  9. Vue.js 开发实践:实现精巧的无限加载与分页功能

    本篇文章是一篇Vue.js的教程,目标在于用一种常见的业务场景--分页/无限加载,帮助读者更好的理解Vue.js中的一些设计思想.与许多Todo List类的入门教程相比,更全面的展示使用Vue.js ...

随机推荐

  1. NOIP 模拟 6 大佬

    这道题是一道数学期望,考场上想的是,每相邻 \(k\) 天之间有 \(k-1\) 天是重合的,所以每两端之间肯定是有影响的. 结果啪啪打脸 这道题其实不用考虑每两段之间的影响,因为在上一段的每种排法, ...

  2. FPGA学习过程(二)

    项目:数码管动态显示时间 首先建立一个计时一秒的模块,作为数码管显示的需要 module timer_s( input wire clk, input wire rst_n, output wire ...

  3. Spring-Boot注入自定义properties文件配置

    创建wzq.properties wzq.properties注入User实体类中 @PropertySource(value = "classpath:wzq.properties&quo ...

  4. java中的静态内部类

    静态内部类是 static 修饰的内部类,这种内部类的特点是: 1. 静态内部类不能直接访问外部类的非静态成员,但可以通过 new 外部类().成员 的方式访问 2. 如果外部类的静态成员与内部类的成 ...

  5. Jmeter教程 录制脚本

    Jmeter 录制脚本 Jmeter中有2种方法可以录制脚本.  不过我个人非常不推荐录制脚本,录制的脚本混乱,需要再次加工才能使用. 像我这么精通HTTP协议的人. 一直都是使用Fiddler来抓包 ...

  6. mzy git学习,分支冲突,以及冲突解决(五)

    冲突解决: 先尝试制造冲突: 首先我:git checkout -b mzy 创建一个mzy的分支 然后在其中修改readme.txt文件,随便加上一点东西. vim readme.txt   wri ...

  7. 聊聊 PC 端自动化最佳方案 - Pywinauto

    1. 前言 大家好,我是安果! 上一篇文章,聊到 PC 端的一种自动化方案:WinAppDriver 聊聊 PC 端自动化最佳方案 - WinAppDriver 有小伙伴后台给我留言,说「 pywin ...

  8. js调试之firbug

    说下几种方法吧: 1.用alert 这个最最直观 把你想要的内容弹出来给你看,但是要看哪里 就要在哪里加,比较麻烦 2.用firefox 或者chrome浏览器 里面有debug工具的 3.如果想用i ...

  9. JavaScript——字符串——模板字符串

    JavaScript--字符串--模板字符串 字符串可以用反引号包裹起来,其中的${expression}表示特殊的含义,JavaScript会将expression代表的变量的值和反引号中的其它普通 ...

  10. 小程序 读取照片 EXIF 元信息

    安装 exif.js npm install exif-js --save UI <button type="primary" @click="onExif&quo ...