หนึ่งในแนวทางปฏิบัติทั่วไปของเราสำหรับการขยาย JavaScript คือการขยายตัวของวันที่ prototype เนื่องจากเรารู้ว่าคลาสวันที่มีวิธีการที่ได้รับองค์ประกอบวันที่หลายอย่างเช่น getDate (), getMinute () ... แต่ไม่มีวิธีการจัดรูปแบบใด ๆ ที่แปลงเป็นสตริงเฉพาะ ดังนั้นใช้วิธีการที่ละเอียดอ่อนเหล่านี้เพื่อห่อหุ้มและรวมรูปแบบสตริงวันที่ที่เราต้องการ โดยทั่วไปฟังก์ชั่นการจัดรูปแบบนี้สามารถกำหนดได้บนต้นแบบของวัตถุวันที่หรือสามารถเขียนได้อย่างอิสระ การทำงานของต้นแบบนิยามเป็นเช่น date.prototype.format = ฟังก์ชั่น (วันที่) {... } และวันที่ใหม่โดยตรง () . อย่างไรก็ตามวิธีการต้นแบบคำจำกัดความนั้นสงสัยเล็กน้อยว่าการขาดต้นแบบ "การบุกรุก" JS ปัญหานี้จะต้องได้รับการพิจารณาเมื่อออกแบบ API ข้อเสนอแนะของฉันคือผู้ใช้ตัดสินใจตามการตัดสินของตนเอง แต่วิธีการโทรนั้นแตกต่างกันและตรรกะของกระบวนการไม่ส่งผลกระทบต่อกระบวนการ
ตัวอย่างต่อไปนี้คือฟังก์ชั่นการจัดรูปแบบของวันที่ JavaScript ที่เขียนโดยฟังก์ชั่นอิสระฟังก์ชั่นรูปแบบอิสระ กลับไปที่จุดความรู้นี้ของการจัดรูปแบบนี้เราตรวจสอบวิธีการและหลักการที่ใช้ แม้ว่าการเย็บแบบดั้งเดิมเช่น INDEXOF ()+substr () สามารถทำได้ แต่ก็ไม่เพียง แต่มีประสิทธิภาพต่ำ แต่ยังมีรหัสยาว จากนั้นจับคู่ผลลัพธ์ของผลลัพธ์ ก่อนอื่นดูตัวอย่างจาก Steven Levithan:
คัดลอกรหัสรหัสดังนี้:
-
* รูปแบบวันที่ 1.2.3
* @credit Steven Levithan <stevenlevithan.com> รวมถึงการปรับปรุงโดย Scott Trenda <scott.trenda.net> และ kris kowal <cixar.com/~kris.kowal/>
* ยอมรับวันที่อาจารย์หรือวันที่และอาจารย์
* ส่งคืนเวอร์ชันที่จัดรูปแบบของวันที่ที่กำหนด
* วันที่เริ่มต้นเป็นวันที่/เวลาปัจจุบัน
* หน้ากากเริ่มต้นที่ DateFormat
-
dateFormat = (function () {
// โน้ตปกติ, 1. โทเค็น, (:) ระบุกลุ่มที่ไม่ได้รับการอ้างอิง;/1 การอ้างอิงย้อนกลับ (คิดว่า: {1,2} มันหมายถึงเช่นเดียวกับ/1?); ที่นี่มันหมายถึงในวงเล็บมันเป็นเรื่องง่ายที่จะจับคู่กับตัวละครใด ๆ หรือคำพูดเดียว)
Vartoken = D {1,4} | /g,
// 2. เขตเวลา, [PMCEA] [SDP] สร้างการบริโภคสองอักขระ;
Timezone = // B (?: [PMCEA] [SDP] T | (?: Pacific | Mountain | Central | Eastern | Atlantic) (?: มาตรฐาน | กลางวัน | -+]/d {4})?)/b/g
timezoneclip =/[^-+/da-z]/g
// ในอักขระการเติมน้อยกว่าสองบิตหรือจำนวนตำแหน่งสามารถวางตำแหน่งได้
pad = function (value, len) {
value = string (val);
LEN = LEN || 2;
ในขณะที่ (val.length <len) val = "0" + ค่า;
ค่าส่งคืน;
-
// เหตุใดจึงส่งคืนฟังก์ชั่นเนื่องจากตัวแปรที่อธิบายไว้ก่อนหน้านี้มีค่าคงที่และพารามิเตอร์ที่ส่งคืนด้านล่างเป็นฟังก์ชันของเวลาจริง สิ่งนี้ถูกนำไปใช้โดยการปิดการเขียน เป็นความคิดเห็นเป็นภาษาอังกฤษคุณสามารถเร่งความเร็วได้
// regexes และฟังก์ชั่นสนับสนุนจะถูกแคชผ่านการปิด
// พารามิเตอร์คำอธิบาย: วันที่: วันที่หรือวันที่ใหม่;
ฟังก์ชั่นส่งคืน (วันที่, หน้ากาก, utc) {
var i18n = dateformat.i18n;
var masks = dateFormat.masks;
// คุณไม่สามารถให้ UTC ได้หากคุณข้าม args อื่น ๆ (ใช้ "UTC:" คำนำหน้าหน้ากาก)
// หากมีพารามิเตอร์เดียวพารามิเตอร์นี้เป็นสตริงที่ไม่มีตัวเลขซึ่งถือเป็นหน้ากาก วันที่ถูกสร้างขึ้นโดยวันที่ใหม่ในวันถัดไปถ้าดังนั้นวันที่เป็นวันที่ปัจจุบัน
if (argumes.length == 1 && object.prototype.toString.call (วันที่) == "[สตริงวัตถุ]" &&! // d /ทดสอบ (วันที่)) {
หน้ากาก = วันที่;
วันที่ = ไม่ได้กำหนด;
-
// วันที่ผ่านวันที่สาม aple.parse ถ้าจำเป็น
วันที่ = วันที่ใหม่ (วันที่): วันที่ใหม่;
ถ้า (isnan (วันที่)) โยน syntaxerror ("วันที่ไม่ถูกต้อง");
// เป็นที่ชัดเจนว่าหน้ากากคืออะไรโดยการตัดสินในหลายกรณีไม่ว่าจะระบุไว้ก่อนหน้านี้อย่างไร ให้ความสนใจกับทักษะของ ||
หน้ากาก = สตริง (หน้ากาก [หน้ากาก] || หน้ากาก || มาสก์ ["ค่าเริ่มต้น"]);
// อนุญาตให้ตั้งค่าอาร์กิวเมนต์ UTC ผ่านหน้ากาก
if (mask.slice (0, 4) == "utc:") {{
mask = mask.slice (4);
utc = true;
-
// สองกรณีใช้สถานการณ์และทั่วไปในรูปแบบ UTC โปรดทราบว่าดัชนีตัวอักษรของ JS สามารถกลับไปที่สมาชิกของวิธีการได้
var_ = utc?
d = วันที่ [_ + "วันที่"] ,,,
d = วันที่ [_ + "วัน"] () ,,
m = วันที่ [_ + "เดือน"] () ,,
y = วันที่ [_ + "เต็ม"] ()
H = วันที่ [_ + "Hold"] () ,,,
m = วันที่ [_ + "นาที"] ()
s = วันที่ [_ + "วินาที"] () ,,,
l = วันที่ [_ + "มิลลิวินาที"] () ,,
O = UTC?
Flags = {
D: D,
DD: Pad (D)
ddd: i18n.daynames [d],
DDDD: i18n.dayNames [D + 7], // ความกว้างบิต: 7, ดู DateFormat.dayNames
M: M + 1, // เริ่มจาก 0
MM: Pad (M + 1) ,,
MMM: I18N.MONTHNAMES [M],
mmmm: i18n.monthnames [m + 12], // ความกว้างบิต: 12, ดู dateformat.monthnames
yy: string (y) .slice (2), // string slice () การใช้งาน
yyyy: y,
H: H % 12 || 12, // H หมายถึง 12 ชั่วโมง H หาร 12 (เพราะ duodes) และผลลัพธ์ที่เหลือคือ 12 ชั่วโมง
HH: PAD (H % 12 || 12)
H: H,
HH: PAD (H)
M: M,
MM: Pad (M)
S: S,
SS: PAD (S)
l: pad (l, 3), // max, 999ms
l: pad (l> 99? math.round (l / 10): l),
// อุปถัมภ์อิทธิพล
T: H <12?
TT: H <12?
T: H <12?
TT: H <12?
// ค้นหาเขตเวลาในขั้นตอนนี้เพียงจัดการกับมัน
// บทความก่อนหน้านี้คือเขตเวลา, timezoneclip =/[^-+/da-z]/g,
// สตริงรูปแบบสตริงของวันที่ส่งคืนรวมถึงความยาว ... UTC ... ข้อมูล
// ถ้าไม่, [""] .pop () ส่งคืนอักขระที่ว่างเปล่า
z: UTC? ")," ")," ")," ")," ")," ")," "),"), ""), ""), "),"), "),"), "),"), "),"), "),"), "),") ""
// 4 -bit TimezoneOffset
o: (o> 0? "-": " +") + pad (math.floor (math.abs (o) / 60) * 100 + math.abs (o) % 60, 4),
// ค้นหาเป็นภาษาอังกฤษ ["th", "st", "nd", "rd"] ตามตัวเลขหลักเดียวของ d
S: ["th", "st", "nd", "rd"] [d % 10> 3? 0: (d % 100 -d % 10! = 10) * d % 10]
-
return mask.replace (โทเค็น, ฟังก์ชั่น ($ 0 /* ดี $ 0, ประกาศ $ 1, $ 2 โดยระบบที่ครอบครอง* /) {) {) {) {) {) {) {) {) {) {) ) {)
// วิธีการตรวจจับแอตทริบิวต์ที่ระบุในวัตถุบางอย่าง? เพียงแค่ตรวจจับมัน!
// $ 0.SLICE (1, $ 0.Length -1);
คืนเงิน $ 0 ในธง?
-
-
-
รหัสนี้ถือว่าครอบคลุมเกี่ยวกับการประมวลผลวันที่ดังนั้นเราจึงป้อนหลักการเพื่อดูความลึกลับของมัน -วิธีจัดการกับวันที่!
ในแม่แบบสตริงวันที่เราตกลงที่จะใช้สัญลักษณ์ที่มีความหมายของ yyyy/mm/dd ฯลฯ ตามลำดับระบุองค์ประกอบบางอย่างในวันที่เช่น y นั่นคือปีเดือนเดือนถ้าคุณเป็นตัวพิมพ์ใหญ่คุณควร ให้ความสนใจกับความโดดเด่น ในระยะสั้นนี่เป็นข้อตกลงที่ได้มาตรฐานนั่นคือ "หน้ากาก" ที่เรียกว่า "ของรหัสข้างต้น สำหรับวันที่ของการวิเคราะห์ก่อนอื่นตามข้อกำหนดทั้งหมดของหน้ากากรับแต่ละองค์ประกอบของแต่ละวันที่หนึ่งทีละหนึ่ง (getDate (), getMinute ()) ... คุณสามารถรับได้เร็ว ๆ นี้) จากนั้นติดตามของจริง เงื่อนไขของหน้ากากนั่นคือหน้ากากวิธี. retplace (ปกติ, องค์ประกอบ) เพื่อแทนที่เทมเพลตสตริงและองค์ประกอบและกระบวนการแทนที่ยังคงเป็นตารางเปรียบเทียบที่ตรงกับธงโดยการตั้งค่าสถานะ สำหรับส่วนปกติกุญแจสำคัญคือกระบวนการทำความเข้าใจโทเค็นและฟังก์ชันแทนที่ () เข้าร่วมในความคิดเห็นของรหัสข้างต้นเพื่อทำความเข้าใจรายละเอียดภายใน
การเข้าสู่สตริงหน้ากากยาวทุกครั้งไม่เหนื่อยหรือเปล่า? เราสามารถลดภาระงานของเราโดยการกำหนดวิธีการคงที่:
คัดลอกรหัสรหัสดังนี้:
DateFormat.masks = {
"ค่าเริ่มต้น": "ddd mmm dd yyyy hh: mm: ss",
shortdate: "m/d/yy"
shortdate2: "yy/m/d/h: mm: ss" ,,
ปานกลาง: "MMM D, YYYY"
Longdate: "Mmmm D, Yyyy",
Fulldate: "DDDD, MMMM D, YYYY"
ShortTime: "H: MM TT",
ปานกลาง: "H: MM: SS TT"
มานาน: "H: MM: SS TT Z"
isodate: "yyyy-mm-dd",
isotime: "HH: MM: SS",
isodatetime: "yyyy-mm-dd''t't't'hh: mm: ss",
isOutcDatetime: "utc: yyyyy-mm-dd''t't't't't'hh: mm: ss'z '"
// เพิ่มวันที่จีน @Edit 2010.8.11
, chinesetate: 'Yyyy Year mm Month Dd Day Hh Time Mm Points'
-
dateformat.i18n = {
Daynames: [[[
"Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat",
"วันอาทิตย์", "วันจันทร์", "วันอังคาร", "วันพุธ", "วันพฤหัสบดี", "วันศุกร์", "วันเสาร์"
-
ชื่อเดือน: [[
"Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec", "
"มกราคม", "กุมภาพันธ์", "มีนาคม", "เมษายน", "พฤษภาคม", "มิถุนายน", "กรกฎาคม", "สิงหาคม", "กันยายน", "ตุลาคม", "พฤศจิกายน", "ธันวาคม"
-
-
DateFormat ของ Steve นั้นเพียงพอที่จะทำให้งานของการแปลงวันที่ส่วนใหญ่เสร็จสมบูรณ์ แต่ในรหัสที่กว้างใหญ่เราได้พบวิธีแก้ปัญหาที่ดีกว่าโดยไม่มีรหัส 20 บรรทัดและการใช้งานปกตินั้นฟรีนั่นคือ JS จากอาวุโสของดวงจันทร์ เงา!
คัดลอกรหัสรหัสดังนี้:
date.prototype.format = function (รูปแบบ) // ผู้แต่ง: meizz
-
var o = {
"M+": this.getMonth () +1, // เดือน
"d+": this.getdate (), // วัน
"H+": this.getHours (), // ชั่วโมง
"M+": this.getMinutes (), // นาที
"S+": this.getSeconds (), // วินาที
"Q+": Math.floor ((this.getMonth ())+3), // quarter
"s": this.getmilliseconds () // มิลลิวินาที
-
if (/(y+)/. ทดสอบ (รูปแบบ)) รูปแบบ = format.replace (regexp. $ 1,
(this.getlyear ()+"")
สำหรับ (var k ใน o) ถ้า (ใหม่ regexp ("(" " + k +") การทดสอบ (รูปแบบ))
format = format.replace (regexp. $ 1
regexp
("00"+ o [k])
รูปแบบการส่งคืน;
-
การแจ้งเตือน (วันที่ใหม่ (). รูปแบบ ("yyyy-mm-dd hh: mm: ss");
หลักการนั้นคล้ายคลึงกับวิธีสตีฟ แต่ยิ่งโค้ดเข้มข้นมากขึ้นก็รวมทักษะและความครอบคลุมเข้าด้วยกัน เริ่มต้นจากบรรทัดที่ 12 ของซอร์สโค้ดวิธีการทดสอบ () ไม่เพียง แต่ตรวจจับฟังก์ชั่นขั้นต่ำของการจับคู่ แต่ในความเป็นจริงมีผลลัพธ์การจับคู่หน่วยความจำ จากนั้นใช้ regexp ใหม่เพื่อสร้างอินสแตนซ์ของนิพจน์ทั่วไปในรูปแบบของสตริงและเป็นสถานที่ที่ฉลาดเพราะมันเชื่อมต่อโดยตรงกับตารางแฮชโดยตรงกับ O! จากนั้นตามกฎหมายมะระจะได้รับการทดสอบสำหรับการจับคู่ของชีวิตก่อนและถ้าบางคนแทนที่มัน
นอกจากนี้ ("00" + o [k]) จุดประสงค์ดั้งเดิมคือการใช้สองอาร์เรย์สุดท้าย นี่เป็นทักษะที่ใช้อย่างครอบคลุมถึงวิธีการ substr () เป็นผลให้จำนวนหลักที่เราเพิ่มล่วงหน้าและความยาวสตริงคงที่ดั้งเดิมไม่เปลี่ยนแปลง (O [k] .length) จากนั้นจำนวนตัวเลขที่เหลืออยู่ (ps "00" เทียบเท่ากับสัญลักษณ์ตำแหน่งและสามารถใช้กับสตริงอื่น ๆ "xx" แทนไม่มีความแตกต่าง)
คุณยังรู้สึกว่ารหัสนี้มีปัญหามากมายหรือไม่? เราพยายามเขียนฟังก์ชั่นของเงาของดวงจันทร์ใหม่ในฐานะที่เป็นความสามารถในการอ่านที่แข็งแกร่ง รหัสของ YUEYING
คัดลอกรหัสรหัสดังนี้:
วันที่ = {
รูปแบบ: ฟังก์ชั่น (วันที่, รูปแบบ) {
วันที่ = วันที่ใหม่ (วันที่);
วันที่ = {
ปี: date.getlyear ()
, เดือน: date.getMonth () + 1 // เดือน, เดือนเริ่มต้นที่ศูนย์
, วัน: date.getDate ()
, ชั่วโมง: date.getHours () ()
, นาที: date.getMinutes ()
, ที่สอง: date.getSeconds ()
, milute: date.getMilliseconds ()
-
วาจา
จับคู่
, reg = (y+) |
ในขณะที่ ((match = reg.exec (รูปแบบ))! = null) {
จับคู่ = จับคู่ [0];
if (/y/i.test (จับคู่)) {
format = format.replace (match, date.year);
-
if (match.indexof ('m')! = -1) {
format = format.replace (จับคู่, date.month);
-
if (match.indexof ('d')! = -1) {
format = format.replace (match, date.day);
-
if (match.indexof ('h')! = -1) {
format = format.replace (match, date.hour);
-
if (match.indexof ('m')! = -1) {
format = format.replace (match, date.minute);
-
if (match.indexof ('s')! = -1) {
format = format.replace (จับคู่, วันที่วินาที);
-
if (match.indexof ('u')! = -1) {
format = format.replace (match, date.milute);
-
-
รูปแบบการส่งคืน;
-
-
2554--1-7:
ฉันจะเปลี่ยนสตริงเป็นวันที่มาตรฐาน JS ได้อย่างไร ดูว่า EXT ใหม่เสร็จอย่างไร?
คัดลอกรหัสรหัสดังนี้:
-
* ตามวันที่จัดรูปแบบรูปแบบเฉพาะ
* แยกวิเคราะห์ค่าผู้ใช้วันที่จัดรูปแบบโดยใช้รูปแบบรูปแบบที่ระบุ
* @param {สตริง/วันที่} ค่าในการจัดรูปแบบ (สตริงจะต้องเป็นไปตามข้อกำหนดรูปแบบของวัตถุ JavaScript Date ดู <a href = "http://www.w3schools.com/jsref/jsref_parser.asp" mce_href = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = "http://www.w.w3schools.com/jsref/jsref_parse.asp"> parse () </a>) ค่าของรูปแบบ (สตริงจะต้องสอดคล้องกับรูปแบบที่คาดหวังโดย Javascrift
* วันที่วัตถุ <a href = "http://www.w3schools.com/jsref/jsref_parse.asp" mce_href = "http://www.w3schools.com/jsref_parse.asp" (Parse " )
* @param {สตริง} รูปแบบ (ตัวเลือก) การจัดรูปแบบการจัดรูปแบบสตริง (ไม่บังคับ) (ไม่บังคับ) สตริงรูปแบบวันที่ที่ถูกต้องใด ๆ (ค่าเริ่มต้นเป็น 'M/D/Y')
* @return {String} ได้จัดรูปแบบสตริงแล้ว สตริงวันที่ที่จัดรูปแบบ
-
วันที่: ฟังก์ชั่น (v, รูปแบบ) {
ถ้า (! v) {{
กลับ "" ";
-
if (! ext.isdate (v)) {
v = วันที่ใหม่ (date.pars (v));
-
return v.dateFormat (รูปแบบ || ext.util.format.defaultdateformat);
-
ตัวสร้างวันที่สามารถกำหนดวันที่โดยการคำนวณจำนวนมิลลิวินาทีจากปี 1970 ได้หรือไม่? —— ip นี่ก็โอเค -นั่นคือในทางอื่นจากมุมมองของปัญหานี้หน่วยที่มีวันที่ JS ที่เล็กที่สุดคือมิลลิวินาที
เวอร์ชันสุดท้าย:
คัดลอกรหัสรหัสดังนี้:
-
* การจัดรูปแบบวันที่ สำหรับรายละเอียดดูโพสต์บล็อก: http://blog.csdn.net/zhangxin09/archive/2011/01/6111294.aspx
* เช่นวันที่ใหม่ ()
* @param {string} รูปแบบ
* @return {String}
-
date.prototype.format = function (รูปแบบ) {
var $ 1, o = {
"M +": this.getMonth () + 1, // เดือนเริ่มจาก 0
"D+": this.getDate (), // วันที่
"H+": this.getHours (), // ชั่วโมง
"M+": this.getMinutes (), // นาที
"s+": this.getSeconds (), // วินาที
// Quate Quarter
"q +": math.floor ((this.getMonth () + 3) / 3)
"s": this.getmilliseconds () // พันวินาที
-
คีย์ var ค่า;
if (//y+)/.test (รูปแบบ)) {{
$ 1 = regexp
format = format.replace ($ 1, string (this.getlyear ()). substr (4 -$ 1));
-
สำหรับ (คีย์ใน O) {// หากไม่ได้ระบุพารามิเตอร์ย่อยย่อยจะดำเนินการต่อไปยังสิ้นสุด StringVar
ถ้า (ใหม่ regexp ("(" + คีย์ + ")"). ทดสอบ (รูปแบบ) {
$ 1 = regexp
value = string (o [key])
ค่า = $ 1.length == 1?
format = format.replace ($ 1, ค่า);
-
-
รูปแบบการส่งคืน;
-