L'une de nos pratiques les plus courantes pour l'extension JavaScript est l'expansion de la date.prototype. Parce que nous savons que la classe de date ne fournit que plusieurs méthodes d'obtention d'éléments de date, tels que getDate (), getMinute () ... mais aucune des méthodes de formatage converti en chaîne spécifique. Par conséquent, utilisez ces méthodes subtiles pour encapsuler et combiner le formulaire de chaîne de date que nous voulons. D'une manière générale, cette fonction de formatisation peut être définie sur le prototype de l'objet Date, ou il peut être écrit indépendamment. Le fonctionnement du prototype de définition est tel que date.prototype.format = fonction (date) {...}, et directement nouveau (). . Cependant, la méthode du prototype de définition est légèrement suspectée de l'absence de prototype JS "invasion". Ce problème doit être pris en compte lors de la conception de l'API. Ma suggestion est que les utilisateurs prennent des décisions conformément à leur propre jugement, mais la méthode d'appel est différente et la logique du processus n'affecte pas le processus.
L'exemple suivant est la fonction de formatage de la date JavaScript écrite par des fonctions indépendantes, une fonction de format indépendant. De retour à ce point de mise en forme de connaissances, nous avons examiné comment et quels principes ont été utilisés. Bien que les coutures de chaîne traditionnelles telles que Indexof () + substr () puissent être réalisées, elle est évidemment non seulement une faible efficacité, mais aussi le code est long. Faites ensuite correspondre les résultats des résultats. Voyons d'abord les exemples de Steven Levithan:
Copier le code du code comme suit:
/ **
* Format de date 1.2.3
* @Credit Steven Levithan <Stevenlevithan.com> Comprend des améliorations de Scott Trenda <cott.Trenda.net> et Kris Kowal <Cixar.com/~kris.kowal/>
* Accepte une date, un maître ou une date et un maître.
* Renvoyez une version formatée de la date donnée.
* La date est par défaut à la date / heure actuelle.
* Le masque par défaut sur DateFormat.
* /
dateFormat = (function () {
// Notes régulières, 1. Jeton, (? :) Indiquer un groupe de capture; / 1 référence inversée (pensez: {1,2} Cela peut signifier la même chose que / 1?); Ici, cela signifie que dans le support, il est simple de correspondre à n'importe quel personnage, mais il n'est pas compris pour le moment où ou citations simples).
VARTOKING = / D {1,4} | M {1,4} | / g,
// 2. Timezone, [PMCEA] [SDP] génère la consommation de deux caractères;
fuseau horaire = // b (?: [pmcea] [sdp] t | (?: Pacific | montagne | central | oriental | atlantique) (?: standard | lumière du jour | dominante) temps | (?: gmt | utc) (? [? [? - +] / d {4})?) / b / g,
Timezoneclip = / [^ - + / da-z] / g,
// dans moins de deux caractères de remplissage, ou le nombre de positionnement peut être positionné
pad = fonction (valeur, len) {
Value = String (Val);
Len = Len || 2;
While (val.length <len) val = "0" + valeur;
Valeur de retour;
};
// Pourquoi renvoie une fonction, car les variables expliquées précédemment sont devenues constantes, et les paramètres renvoyés ci-dessous sont la fonction du temps réel. Ceci est mis en œuvre en fermant l'écriture. En tant que commentaires en anglais, vous pouvez accélérer.
// Regex et les fonctions de support sont mises en cache par fermeture
// Description du paramètre: Date: date ou nouvelle date;
Fonction de retour (date, masque, UTC) {
var i18n = dateFormat.i18n;
var masques = dateFormat.masks;
// Vous ne pouvez pas fournir UTC si vous sautez d'autres args (utilisez le "UTC:" Mask Prefix)
// S'il n'y a qu'un seul paramètre, ce paramètre est une chaîne qui ne contient pas de nombres, qui est considéré comme un masque. La date est générée par nouvelle date dans le prochain si, la date est donc la date actuelle.
If (argumes.length == 1 && object.prototype.tostring.call (date) == "[String d'objet]" &&! // d / test (date)) {
masque = date;
Date = non définie;
}
// Date de passage trois aplies Date.Parse, si nécessaire
Date = Date?
if (isnan (date)) throw syntaxerror ("invalid Date");
// Il est clair quel est le masque en jugeant dans de nombreux cas, quelle que soit la spécification précédemment. Faites attention aux compétences de ||.
Mask = string (masques [mask] || masque || masques ["par défaut"]);
// Autoriser la définition de l'argument UTC via le masque
if (mask.slice (0, 4) == "UTC:") {{
masque = masque.slice (4);
Utc = true;
}
// Deux cas, utilisez la situation et le général au format UTC. Notez que les indices littéraux de JS peuvent également revenir aux membres de la méthode.
var_ = utc?
d = date [_ + "date"] ,,,
D = date [_ + "jour"] () ,,
m = date [_ + "mois"] () ,,
y = date [_ + "entièrement"] (),
H = date [_ + "Hold"] () ,,,
M = date [_ + "minutes"] (),
s = date [_ + "secondes"] () ,,,
L = date [_ + "millisecondes"] () ,,
O = utc? 0: date.gettimezoneoffset ()
Flags = {
D: D,
Dd: pad (d),
ddd: i18n.dayNames [d],
dddd: i18n.dayNames [d + 7], // Bit Width: 7, voir dateFormat.DayNames.
M: m + 1, // à partir de 0
mm: pad (m + 1) ,,
mmm: i18n.monthNames [m],
mmmm: i18n.monthnames [m + 12], // largeur de bit: 12, voir dateformat.monthnames
Yy: String (y) .slice (2), // String Slice () Utilisation
yyyy: y,
H: H% 12 || 12, // H signifie 12 heures, H divise 12 (parce que Duodes), et le résultat du reste est de 12 heures.
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),
// patroniser l'influence
T: H <12?
TT: H <12?
T: H <12?
TT: H <12?
// Cherchez du fuseau horaire à cette étape, traitez-le.
// L'article précédent est le fuseau horaire, timezoneclip = / [^ - + / da-z] / g,
// chaîne le formulaire de chaîne de la date de retour, y compris une longue ... UTC ... Informations
// sinon, [""] .pop () renvoie le caractère vide
Z: UTC? ")," ")," ")," ")," ")," ")," ")," ")," ")," ")," ")," ")," ") , ""
// 4 -BIT TimeSoneOffset
o: (o> 0? "-": "+") + pad (math.floor (math.abs (o) / 60) * 100 + math.abs (o)% 60, 4),
// trouver en anglais ["th", "st", "nd", "rd"], selon les chiffres uniques de d
S: ["th", "st", "nd", "rd"] [d% 10> 3? 0: (d% 100 -d% 10! = 10) * d% 10]
};
Return mask.replace (token, function ($ 0 / * est bon 0 0, note 1 1, 2 2 par le système occupé * /) {) {) {) {) {) {) {) {) {) {{ ) {)
// Comment détecter les attributs spécifiés sur un certain objet? Il suffit de le détecter!
// 0, $ SLICE (1, 0, $ Longueur -1);?
Retour 0 $ en drapeaux?
});
};
}) ();
Le code est considéré comme complet sur le traitement des dates, nous entrons donc le principe pour voir son mystère, comment faire face à la date!
Dans le modèle de chaînes de date, nous avons accepté d'utiliser des symboles significatifs de Yyyy / mm / dd, etc., indiquent respectivement un certain élément dans la date, comme y, c'est un an, un mois, un mois, si vous êtes en majuscules, vous devez également Faites attention à Distinguished. En bref, il s'agit d'un accord standardisé, c'est-à-dire le «masque» SO-appelé du code ci-dessus. Quant à la date de l'analyse, d'abord selon toutes les exigences du masque, obtenez chaque élément de chaque date un par un (getDate (), getMinute ()) ... vous pouvez l'obtenir bientôt), puis suivez le réel Conditions de masque, c'est-à-dire masquer la méthode .replace (régulière, élément) pour remplacer le modèle de chaîne et l'élément, et le processus de remplacement est toujours une table de comparaison qui correspond à l'indicateur par drapeau. Quant à la partie régulière, la clé est le processus de compréhension du jeton et de la fonction remplace (). Participez aux commentaires du code ci-dessus pour comprendre les détails internes.
N'est-il pas fatigant de saisir la longue chaîne de masque à chaque fois? Nous pouvons réduire notre charge de travail en définissant des méthodes constantes:
Copier le code du code comme suit:
dateformat.masks = {
"Par défaut": "ddd mmm dd yyyy hh: mm: ss",
Shortdate: "m / d / yy",
Shortdate2: "Yy / m / d / h: mm: ss" ,,
Mediumdate: "Mmm D, Yyyy",
Longdate: "Mmmm D, Yyyy",
Fulldate: "DDDD, Mmmm D, Yyyy",
Short-temps: "H: MM TT",
Medium: "H: MM: SS TT",
longue durée: "h: mm: ss tt z",
Isodate: "yyyy-mm-dd",
Isotime: "HH: MM: SS",
IsodateTime: "Yyyy-mm-d't't't'hh: mm: ss",
IsoutcdateTime: "Utc: yyyyy-mm-d't't't't'hh: mm: ss'z '"
// Ajouter la date de la Chine @Edit 2010.8.11
, Chinesetate: «Yyyy Year Mm Mois Dd Day HH Time MM Points»
}
dateformat.i18n = {
Names de jour: [[
"Sun", "Mon", "mar", "Wed", "Thu", "Fri", "Sat",
"Sunday", "lundi", "mardi", "mercredi", "jeudi", "vendredi", "samedi"
] ,,,
Noms de mois: [[
"Jan", "Feb", "Mar", "APR", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec",
"Janvier", "février", "mars", "avril", "mai", "juin", "juillet", "août", "septembre", "octobre", "novembre", "décembre"
]]
};
Le Dateformat de Steve est suffisant pour terminer la tâche de la plupart des dattes de conversion, mais dans le vaste code, nous avons trouvé une meilleure solution, sans les 20 lignes de code, et l'utilisation régulière est gratuite, c'est-à-dire JS de l'aîné de la lune ombre!
Copier le code du code comme suit:
Date.prototype.format = fonction (format) // Auteur: Meizz
{{
var o = {
"M +": this.getMonth () +1, // mois
"D +": this.getDate (), // jour
"H +": this.gethours (), // heure
"M +": this.getMinutes (), // minute
"S +": this.getSeconds (), // seconde
"q +": math.floor ((this.getMonth ()) + 3), // trimestre
"S": this.getMilliseconds () // milliseconde
}
if (/ (y +) /. test (format)) format = format.replace (regexp. 1 $,
(this.getlyar () + "").
pour (var k in o) if (new regexp ("(" "+ k +"). test (format))
Format = format.replace (regexp. 1 $,
Regexp.
("00" + o [k]).
Format de retour;
}
alert (new Date (). Format ("yyyy-mm-dd hh: mm: ss");
Le principe est similaire à la méthode Steve, mais le code plus concentré intègre les compétences et le compréhensivité. À partir de la 12e ligne de code source, la méthode Test () peut non seulement détecter la fonction minimale de la correspondance, mais en fait, il existe des résultats de correspondance de mémoire. Ensuite, utilisez un nouveau regexp pour créer une instance d'expression régulière sous la forme d'une chaîne, et c'est un endroit intelligent, car il est directement connecté à la table de hachage directement avec O! Ensuite, selon la loi, la gourde est testée d'abord pour l'appariement de la vie, et si certains le remplacent.
De plus, le (00 "+ o [k]). Le but initial était de prendre les deux derniers du tableau. Il s'agit d'une compétence qui utilise de manière complets la méthode substr (). En conséquence, le nombre de chiffres que nous avons ajoutés à l'avance, et la longueur fixe d'origine fixe est inchangée (o [k] .Length), puis combien de chiffres ont été laissés. (Ps "00" équivaut à un symbole de placement, et il peut également être utilisé avec une autre chaîne "xx" au lieu de aucune différence)
Pensez-vous toujours que ce code a beaucoup de difficultés? Nous avons essayé de réécrire la fonction de l'ombre de la lune comme une forte lisibilité. Le code de Yueying.
Copier le code du code comme suit:
date = {
Format: fonction (date, format) {
Date = nouvelle date (date);
date = {
Année: Date.
, Mois: date.getMonth () + 1 // mois, le mois commence à partir de zéro
, Jour: date.getDate ()
, Heure: date.Gethours () ()
, Minute: date.getMinutes ()
, Deuxième: date.getSeconds ()
, MILET: Date.getMilliseconds ()
};
Var
correspondre
, Reg = / (y +) | (y +) | (m +) |
While ((match = reg.exec (format))! = Null) {
match = match [0];
if (/y/i.test (match)) {
Format = format.replace (match, date.year);
}
if (match.indexof ('m')! = -1) {
Format = format.replace (match, 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 (match, date.second);
}
if (match.indexof ('u')! = -1) {
Format = format.replace (match, date.milute);
}
}
Format de retour;
}
};
2011--1-7:
Comment puis-je transformer la chaîne à la date standard JS? Voyez comment le nouvel EXT est fait?
Copier le code du code comme suit:
/ **
* Selon la date de formatage de format spécifique.
* Analyser une valeur INSTO Un utilisateur de date formaté à l'aide du modèle de format spécifié.
* @param {String / Date} Valeur en formatage (la chaîne doit répondre aux exigences de format de l'objet JavaScript Date, voir <a href = "http://www.w3schools.com/jsref/jsref_parser.asp" MCE_HREF = = "http://www.w.w3schools.com/jsref/jsref_parse.asp"> parse () </a>)
* Date Object's <a href = "http://www.w3schools.com/jsref/jsref_parse.asp" mce_href = "http://www.w3schools.com/jrsref_parse.asp" (parse ") </ a> Méthode )
* @param {String} format (facultatif) String de format de format. (Facultatif) (facultatif) Toute chaîne de format de date valide (par défaut est «m / d / y»)
* @Return {String} a formaté la chaîne. La chaîne de date formatée
* /
Date: fonction (v, format) {
if (! v) {{
Retour "" ";
}
if (! ext.isdate (v)) {
v = nouvelle date (date.pars (v));
}
Return v.dateFormat (format || ext.util.format.defaultDateFormat);
}
Le constructeur de date peut-il également déterminer la date en calculant le nombre de millisecondes à partir de 1970? — - Ip, c'est ok, c'est-à-dire, de l'autre manière, du point de vue de ce problème, l'unité avec la plus petite date JS est des millisecondes.
Version finale:
Copier le code du code comme suit:
/ **
* Formatage de date. Pour plus de détails, consultez le billet de blog: http://blog.csdn.net/zhangxin09/archive/2011/01/6111294.aspx
* Par exemple: nouveau Date ().
* @param {String} Format
* @Return {String}
* /
Date.prototype.format = fonction (format) {
var 1 $, o = {
"M +": this.getMonth () + 1, // mois, commencez à partir de 0
"D +": this.getDate (), // date
"H +": this.gethours (), // heures
"M +": this.getMinutes (), // Minutes
"S +": this.getSeconds (), // secondes
// Quate Quarter
"Q +": math.floor ((this.getMonth () + 3) / 3),
"S": this.getMilliseconds () // des milliers de secondes
};
clé var, valeur;
if (//y+)/.test (format)) {{
1 $ = Regexp.
Format = format.replace (1 $, chaîne (this.getlyear ()). Substr (4 - 1 $));
}
Pour (clé dans o) {// Si le paramètre n'est pas spécifié, le sous-string continuera jusqu'à la fin de StringVar.
if (new regexp ("(" + key + ")"). test (format) {
1 $ = Regexp.
Valeur = string (o [key]),
Valeur = 1,Legth == 1?
Format = format.replace (1 $, valeur);
}
}
Format de retour;
}