Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   форматирование даты (https://javascript.ru/forum/dom-window/44059-formatirovanie-daty.html)

dianitka 04.01.2014 18:36

форматирование даты
 
В учебнике Jquery.Продвинутое руководство по Javascript есть такой пример

(function($){
  $.formatDate = function(date,pattern) {
    var result = [];
    while (pattern.length>0) {//You don't need to use jQuery to get the length of a string because it is a basic JavaScript string object property: somestring.length;

/*--------do not understand------------*/
      
$.formatDate.patternParts.lastIndex = 0;//This property returns an integer that specifies the character position immediately after the last match found by exec( ) or test( ) methods.
      var matched = $.formatDate.patternParts.exec(pattern);//The exec() method tests for a match in a string. - RegExpObject.exec(string) ;eturns the matched text if it finds a match, otherwise it returns null.
	  alert('pattern:'+pattern);
	  alert('matched[0]:'+matched[0]);
      if (matched) {
        result.push($.formatDate.patternValue[matched[0]].call(this,date));
        pattern = pattern.slice(matched[0].length);
      }
      else {
        result.push(pattern.charAt(0));
        pattern = pattern.slice(1);
      }
    }
    return result.join('');
  };

/*--------do not understand------------*/


  $.formatDate.patternParts =
    /^(yy(yy)?|M(M(M(M)?)?)?|d(d)?|EEE(E)?|a|H(H)?|h(h)?|m(m)?|s(s)?|S)/;

  $.formatDate.monthNames = [
    'January','February','March','April','May','June','July',
    'August','September','October','November','December'
  ];

  $.formatDate.dayNames = [
    'Sunday','Monday','Tuesday','Wednesday','Thursday','Friday',
    'Saturday'
  ];

  $.formatDate.patternValue = {
    yy: function(date) {
      return $.toFixedWidth(date.getFullYear(),2);
    },
    yyyy: function(date) {
      return date.getFullYear().toString();
    },
    MMMM: function(date) {
      return $.formatDate.monthNames[date.getMonth()];
    },
    MMM: function(date) {
      return $.formatDate.monthNames[date.getMonth()].substr(0,3);
    },
    MM: function(date) {
      return $.toFixedWidth(date.getMonth()+1,2);
    },
    M: function(date) {
      return date.getMonth()+1;
    },
    dd: function(date) {
      return $.toFixedWidth(date.getDate(),2);
    },
    d: function(date) {
      return date.getDate();
    },
    EEEE: function(date) {
      return $.formatDate.dayNames[date.getDay()];
    },
    EEE: function(date) {
      return $.formatDate.dayNames[date.getDay()].substr(0,3);
    },
    HH: function(date) {
      return $.toFixedWidth(date.getHours(),2);
    },
    H: function(date) {
      return date.getHours();
    },
    hh: function(date) {
      var hours = date.getHours();
      return $.toFixedWidth(hours>12 ? hours - 12 : hours,2);
    },
    h: function(date) {
      return date.getHours()%12;
    },
    mm: function(date) {
      return $.toFixedWidth(date.getMinutes(),2);
    },
    m: function(date) {
      return date.getMinutes();
    },
    ss: function(date) {
      return $.toFixedWidth(date.getSeconds(),2);
    },
    s: function(date) {
      return date.getSeconds();
    },
    S: function(date) {
      return $.toFixedWidth(date.getMilliseconds(),3);
    },
    a: function(date) {
      return date.getHours() < 12 ? 'AM' : 'PM';
    }
  };

  $.toFixedWidth = function(value,length,fill) {
    var result = (value || '').toString();
    fill = fill || '0';
    var padding = length - result.length;
    if (padding < 0) {
      result = result.substr(-padding);
    }
    else {
      for (var n = 0; n < padding; n++) result = fill + result;
    }
    return result;
  };

})(jQuery);


<!DOCTYPE html>
<html>
  <head>
    <title>$.dateFormat() test</title>
    <link rel="stylesheet" type="text/css" href="../styles/core.css">
    <script type="text/javascript" src="../scripts/jquery-1.4.js"></script>
    <script type="text/javascript" src="jquery.jqia.formatDate.js"></script>
    <script type="text/javascript">
      var testPatterns = [
        'yyyy','yy','MMMM','MMM','MM','M','dd','d','EEEE','EEE','a',
       'HH','H','hh','h','mm','m','ss','s','S',
        'EEEE MMMM, d yyyy hh:mm:ss.S a',
		'M/d/yy HH:mm'
      ];
    </script>
  </head>

  <body>
    <div>
      <script>
        var now = new Date();
        document.write('<div>Test date: '+now+'</div>');
        $.each(testPatterns,function(){
          document.write('<div>'+this+'='+$.formatDate(now,this)+'</div>');
        });
      </script>
    </div>

  </body>
</html>


Можете, пожалуйста, кто знает, как это работает, прокомментировать код внутри комментариев /*--------do not understand------------*/ )) Почему переменная matched превращается из строки в массив и когда я оставляю в вызове функции в HTML только последние два вида форматирования, функция перестает работать. И что это за регулярное выражение

Rise 05.01.2014 06:43

Цитата:

Сообщение от dianitka (Сообщение 290566)
Почему переменная matched превращается из строки в массив

Потому что она никогда строкой и не была...
Цитата:

Сообщение от dianitka (Сообщение 290566)
И что это за регулярное выражение

Обычное регулярное выражение...
Цитата:

Сообщение от dianitka (Сообщение 290566)
В учебнике Jquery.Продвинутое руководство по Javascript есть такой пример

Рано вам еще до продвинутых руководств, начните с основ http://learn.javascript.ru/

dianitka 07.01.2014 13:23

возможно и рано, но все же остальное кроме этого участка кода я понимаю.
с регулярками не разбираюсь-это да
на счет переменной matched - то, что это - строка, так подумала т.к. никогда не сталкивалась с функцией exec() - //The exec() method tests for a match in a string. - RegExpObject.exec(string) ;returns the matched text if it finds a match, otherwise it returns null. - тут(w3schools) сказано что возвращается текст, если совпадение найдено, а в каком еще виде может быть текст, если это не строка?

а вот в учебнике с этого форума нашла объяснение: exec() - Выполняет поиск совпадений в указанной строке. Возвращает массив результатов или null

kostyanet 09.01.2014 02:20

Все потому что в js таки нет человеческого форматирования дат.

melky 09.01.2014 08:43

Цитата:

Сообщение от dianitka (Сообщение 290854)
сказано что возвращается текст, если совпадение найдено, а в каком еще виде может быть текст, если это не строка?

у регулярок есть запоминающие скобки. поэтому результатов может быть, сколько угодно, поэтому и:

Цитата:

Сообщение от dianitka (Сообщение 290854)
exec() - Выполняет поиск совпадений в указанной строке. Возвращает массив результатов или null


kostyanet 09.01.2014 22:40

Группировки запоминающих скобок заполонили телевикторины.

"Запоминающие скобки" это группы.


Часовой пояс GMT +3, время: 07:30.