* 引入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. STM32—驱动RFID-RC522模块

    文章目录 一.S50(M1)卡介绍 1.S50(M1)卡基础知识 2.内部信息 3.存取控制 4.数据块的存取控制 5.控制块的存取控 6.工作原理 7.M1与读卡器的通信 二.RC522工程代码详解 ...

  2. Longhorn,企业级云原生容器分布式存储 - 备份与恢复

    内容来源于官方 Longhorn 1.1.2 英文技术手册. 系列 Longhorn 是什么? Longhorn 企业级云原生容器分布式存储解决方案设计架构和概念 Longhorn 企业级云原生容器分 ...

  3. @CreatedDate@CreatedBy@LastModifiedBy@LastModifiedDate

    启动类上加上@EnableJpaAuditing 实体类,注意需要加上@EntityListeners(AuditingEntityListener.class)这个注解才能使@CreatedDate ...

  4. 07.SpringMVC之静态资源

    如何你的DispatcherServlet拦截 *.do这样的URL,就不存在访问不到静态资源的问题.如果你的DispatcherServlet拦截"/",拦截了所有的请求,同时对 ...

  5. 在Spring中使用静态工厂时发生的无法得到对象的问题

    因为我测试时,使用的是之前的包Spring 3.x一类的jar包,发现我的代码毫无问题,但是就是运行不出来,后面去Spring官网上发现,JDK6+至少都要使用Spring4.x了,而为了配合JDK8 ...

  6. 用Java8把List转为Map

    1 import com.yang.test.User; 2 3 import javax.jws.soap.SOAPBinding; 4 import java.util.*; 5 import j ...

  7. Jmeter HTML 报告、Jenkins 配置

    目录 Jmeter 生成 HTML 测试报告 Jenkins 配置 Jmeter 生成 HTML 测试报告 JMeter 支持生成 HTML 测试报告, 以便从测试计划中获得图表和统计信息. 以上定义 ...

  8. promise链式调用的应用

    then在链式调用时,会等前一个then或者函数执行完毕,返回状态,才会执行回调函数. (1)代码顺序执行,第一步调用了函数cook ,cook执行返回了一个promise,promise返回的是成功 ...

  9. ES6 promise的应用

    html部分 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <me ...

  10. java对象的引用级别

    解释 在java中也有引用的概念,其实就可以认为是变量.标题中的引用级别是指变量与对象之前的引用级别.java中分为4种,按引用强弱关系排序分别是:强引用.软引用.弱引用.虚引用. 强引用(Stron ...