jquery는 현재 시간을 가져옵니다. JavaScript 현재 시간과 날짜 가져오기

얻다 현재 날짜 JavaScript에서는 매우 간단합니다. 이것이 Date 객체의 목적입니다. 구문은 매우 간단하고 메소드 이름은 직관적입니다. 아래 예에서는 Date 객체(JavaScript new date )를 사용하여 현재 연도, 월, 일 및 시간을 밀리초 단위의 정밀도로 가져오는 방법을 보여 드리겠습니다.

현재 날짜 가져오기:

JavaScript에서 현재 날짜를 얻으려면 new 키워드를 사용하여 Date 개체의 새 인스턴스를 만듭니다.

var 날짜 = 새로운 날짜(); 콘솔로그(날짜);

이 코드는 다음 정보를 콘솔에 인쇄합니다.

//2016년 2월 2일 화요일 15:46:56 GMT-0500 (동부 표준시)

현재 요일, 이번 달, 월, 연도 및 현재 시간까지 24시간 형식으로 표시합니다. 조각 "GMT"는 그리니치 표준시를 의미하고 "-0500"은 현지 시간과 GMT 사이의 시간대 차이를 의미합니다.

위키피디아 인용문: "그리니치 표준시(GMT)는 런던 그리니치에 있는 왕립 천문대의 평균 태양시입니다." 이는 협정 세계시(UTC)와 관련이 있습니다. 표시된 날짜 값의 "동부 표준시"는 귀하의 브라우저 또는 컴퓨터의 시간대를 나타냅니다.

* GMT와 UTC는 서로 다르기 때문에 주의하시기 바랍니다. 분 단위로 UTC 값을 고려하겠습니다.

* 또한 JavaScript의 날짜는 1970년 1월 1일 자정(UTC) 이후 경과된 밀리초 단위의 시간으로 정의됩니다. 하루는 86,400,000밀리초입니다. Date 객체의 범위는 1970년 1월 1일 UTC를 기준으로 -100,000,000일부터 100,000,000일까지입니다.

* 위에서 언급한 방법을 사용하여 얻은 값은 장치의 시스템 설정에 따라 다릅니다. 컴퓨터의 시계 설정을 변경하면 이 메서드에서 반환되는 시간도 변경됩니다.

좋습니다. 이제 새로운 JavaScript 날짜 형식을 사용하고 다음 단계로 넘어갈 준비가 되었습니다!

요일 얻기:

요일을 얻으려면 Date 객체의 getDay() JavaScript 메소드를 사용하십시오.

varday = date.getDay(); 콘솔로그(일);

*요일은 0부터 6까지 번호가 지정되며, 일요일 = 0, 월요일 = 1, 화요일 = 2 등으로 표시됩니다.

월 확인:

현재 연도의 이번 달을 얻으려면 getMonth() 메소드를 사용하십시오. 그 전에 메소드 이름이 직관적이라고 말씀드렸는데요!

var 월 = date.getMonth(); 콘솔로그(월); //1

* 요일과 마찬가지로 월도 0부터 11까지의 숫자 형식으로 반환됩니다. 1월 = 0, 2월 = 1, 3월 = 2 등입니다.

해당 월의 날짜 얻기:

해당 월의 날짜를 얻으려면 GetDate() 메서드를 사용할 수 있습니다.

var dayOfMonth = date.getDate(); 콘솔로그(dayOfMonth); //2

* GetDate() 메서드는 1부터 31까지의 날짜를 반환합니다. 숫자 1은 해당 월의 1일에 해당합니다.

시간을 얻는 중:

현재 시간을 얻으려면 GetTime() 메서드가 사용됩니다.

vartime = date.getTime(); 콘솔로그(시간); //1454461242058

보이는데... 이상해... 이게 뭐죠? 1970년 1월 1일 00:00:00 UTC 이후 경과된 밀리초 수를 확인할 수 있습니다. 그럼 몇 살이에요?

1454461242058 ms / 연간 31540000000 ms = 약 46년
1970년 + 46년 = 2016년

다음 사항을 확인해 보겠습니다.

var 연도 = date.getFullYear(); console.log(연도) //2016

그래 그거야! JavaScript 새 날짜를 사용하여 현재 날짜와 시간을 출력합니다.

날짜와 시간은 우리 일상생활의 일부이므로 프로그래밍에서 두드러지게 나타납니다. JavaScript에서는 웹사이트를 생성할 때 달력, 열차 시간표 또는 약속 예약을 위한 인터페이스를 추가해야 할 수도 있습니다. 이러한 애플리케이션은 사용자의 현재 시간대를 기준으로 적절한 시간을 표시하거나 항공기 도착 및 출발 또는 이벤트 시작 및 종료 시간과 관련된 계산을 수행해야 합니다. 또한 특정 시간에 일일 보고서를 보내거나 필터링(예: 특정 시간에 영업하는 레스토랑 찾기)을 위해 JavaScript를 사용해야 할 수도 있습니다.

날짜 객체

Date는 날짜와 시간을 저장하는 내장 JavaScript 객체입니다. 이 데이터의 형식을 지정하고 조작하기 위한 다양한 기본 제공 방법을 제공합니다.

기본적으로 인수가 없는 새 Date 인스턴스는 다음에 따라 현재 날짜와 시간을 사용하여 객체를 생성합니다. 환경 설정현재 컴퓨터.

예를 들어 현재 날짜를 변수에 할당해 보세요. now.js 파일을 만듭니다.

// 변수를 현재 날짜와 시간으로 설정
const now = new Date();
// 출력 보기
지금;
2017년 10월 18일 수요일 12:41:34 GMT+0000 (UTC)

출력은 다음 데이터를 포함하는 날짜 문자열입니다.

날짜와 시간이 구분되어 읽기 쉽게 표시됩니다.

그러나 JavaScript는 1970년 1월 1일 자정 이후 경과된 밀리초 수로 구성된 값인 Unix 타임스탬프를 기반으로 날짜를 해석합니다. getTime() 메소드를 사용하여 타임스탬프를 얻을 수 있습니다.

// 현재 타임스탬프를 가져옵니다.
지금.getTime();
1508330494000

현재 타임스탬프로 출력에 나타나는 큰 숫자는 1970년 1월 1일 자정부터 2017년 10월 18일까지 경과된 밀리초 수입니다.

0 시간(또는 에포크 시간)은 날짜 문자열 01 January, 1970 00:00:00 Universal Time(UTC) 및 타임스탬프 0으로 표시됩니다. epoch.js 파일에 새 변수를 생성하여 브라우저에서 이를 확인할 수 있습니다. 타임스탬프 0을 기준으로 Date 의 새 인스턴스를 할당합니다.

// 타임스탬프 0을 새 변수에 할당합니다.
const epochTime = 새로운 날짜(0);
시대시간;
1970년 1월 1일 00:00:00 세계시(UTC)

컴퓨터가 시간을 측정하는 기준으로 제로타임(Zero Time)이 선택되었으며, 자바스크립트에서는 이 방식을 사용하고 있습니다. 타임스탬프와 날짜 문자열은 애플리케이션의 설정과 목적에 따라 사용될 수 있으므로 이해하는 것이 중요합니다.

이제 현재 시간과 타임스탬프를 기반으로 새 Date 인스턴스를 만드는 방법을 알았습니다. JavaScript에는 총 4가지 날짜 형식이 있습니다. 기본 현재 시간 및 타임스탬프 외에도 날짜 문자열을 사용하거나 특정 날짜 및 시간을 지정할 수도 있습니다.

시연하다 다양한 방법특정 날짜에 대한 참조를 사용하려면 세 가지 다른 방법으로 1776년 7월 4일 12시 30분 GMT를 나타내는 새 Date 개체를 만들어 보세요.

// 타임스탬프 메서드
새로운 날짜(-6106015800000);
// 날짜 문자열 메소드
new Date("1980년 1월 31일 12시 30분");
// 날짜 및 시간 방법
새로운 날짜(1776, 6, 4, 12, 30, 0, 0);

이러한 예는 모두 세 가지 다른 방식으로 동일한 날짜 및 시간 정보를 나타냅니다.

보시다시피 타임스탬프 메서드에는 음수가 있습니다. 0시 이전의 날짜는 음수로 표시됩니다.

세 번째 예에서는 초와 밀리초가 0으로 표시됩니다. Date 객체를 생성할 때 누락된 데이터가 있으면 0으로 할당해야 합니다. 누락된 데이터는 문자열의 시간 데이터 순서가 일치하지 않으므로 생략할 수 없습니다. 변화. 여기서 7월은 7이 아닌 6으로 지정되어 있다는 점도 주목해야 합니다. 이는 카운트다운이 1이 아닌 0부터 시작하기 때문입니다. 이에 대한 자세한 내용은 다음 섹션에서 설명합니다.

get을 사용하여 날짜 검색

날짜가 있으면 다양한 기본 제공 방법을 사용하여 모든 구성 요소에 액세스할 수 있습니다. 이 메서드는 현지 시간대를 기준으로 날짜의 각 부분을 반환합니다. 이러한 각 메서드는 get으로 시작하여 상대 숫자를 반환합니다. 아래는 Date 객체의 get 메소드에 대한 자세한 표입니다.

날짜 시간 방법 범위
년도 getFullYear() YYYY 1970
get월() 0-11 0 = 1월
해당 월의 일 get날짜() 1-31 1 = 매월 1일
요일 getDay() 0-6 0 = 일요일
시간 getHours() 0-23 0 = 자정
getMinutes() 0-59
두번째 getSeconds() 0-59
밀리초 get밀리초() 0-999
타임스탬프 getTime()

// 새로운 생일 인스턴스를 초기화합니다.
const birthday = new Date(1980, 6, 31);

이제 모든 방법을 사용하여 날짜의 각 구성 요소를 추출할 수 있습니다.

birthday.getFullYear(); // 1980년
birthday.getMonth(); // 6
생일.getDate(); // 31
birthday.getDay(); // 4
birthday.getHours(); // 0
birthday.getMinutes(); // 0
birthday.getSeconds(); // 0
birthday.getMilliseconds(); // 0
생일.getTime(); // 333849600000(GMT용)

때로는 날짜의 일부만 추출해야 할 수도 있으며, 내장된 get 메소드가 이 작업에 도움이 될 것입니다.

예를 들어, 오늘 날짜를 10월 3일과 비교하여 10월 3일인지 아닌지 확인할 수 있습니다.

// 오늘 날짜를 가져옵니다.
const today = new Date();
// 오늘을 10월 3일과 비교
if (today.getDate() === 3 && today.getMonth() === 9) (
console.log("10월 3일입니다.");
) 또 다른 (
console.log("10월 3일이 아닙니다.");
}
10월 3일이 아닙니다.

내장된 get 메소드를 사용하면 날짜 구성요소에 액세스할 수 있습니다.

설정으로 날짜 변경

위에 나열된 모든 get 메소드에는 해당하는 set 메소드가 있습니다. get을 사용하여 특정 날짜 구성 요소를 검색하는 경우 set은 해당 구성 요소를 변경하는 데 사용됩니다. 아래는 Date 객체의 setter 메소드에 대한 자세한 표입니다.

날짜 시간 방법 범위
년도 setFullYear() YYYY 1970
세트월() 0-11 0 = 1월
해당 월의 일 세트날짜() 1-31 1 = 매월 1일
요일 세트데이() 0-6 0 = 일요일
시간 setHours() 0-23 0 = 자정
setMinutes() 0-59
두번째 setSeconds() 0-59
밀리초 set밀리초() 0-999
타임스탬프 세트타임() 0 이후의 밀리초 수

이러한 설정 방법을 사용하여 하나 이상의 날짜 구성 요소를 변경할 수 있습니다. 예를 들어 생일 변수의 연도를 1997년으로 변경할 수 있습니다.

// 생일 날짜의 연도 변경
birthday.setFullYear(1997);
생일;
1997년 7월 31일 목요일 00:00:00 GMT+0000 (UTC)

이제 생일 변수를 호출하면 1980년이 아니라 1997년이 표시됩니다.

내장된 set 메소드를 사용하면 Date 객체의 다른 부분을 변경할 수 있습니다.

UTC 방법

위에 설명된 get 메소드는 다음을 기반으로 날짜 구성요소를 검색합니다. 지역 설정사용자의 시간대. 날짜 및 시간에 대한 제어를 강화하려면 getUTC 메서드를 사용할 수 있습니다. 이 메서드는 get 메서드와 동일하게 작동하지만 UTC(협정 세계시) 표준을 기반으로 시간을 계산합니다. 다음은 JavaScript의 Date 객체에 대한 UTC 메소드 표입니다.

날짜 시간 방법 범위
년도 getUTCFullYear() YYYY 1970
getUTC월() 0-11 0 = 1월
해당 월의 일 getUTCDate() 1-31 1 = 매월 1일
요일 getUTCDay() 0-6 0 = 일요일
시간 getUTCHours() 0-23 0 = 자정
getUTCMinute() 0-59
두번째 getUTCSecons() 0-59
밀리초 getUTCM밀리초() 0-999

로컬 getter와 UTC getter 간의 차이점을 테스트하려면 다음 코드를 실행하세요.

// 현재 시간을 변수에 할당
const now = new Date();
// 현지 및 UTC 시간대를 인쇄합니다.
console.log(now.getHours());
console.log(now.getUTCHours());

이 코드는 UTC 시간대로 현재 시간과 시간을 인쇄합니다. 현재 UTC 시간대에 있는 경우 프로그램에 표시되는 숫자는 동일합니다.

UTC는 국제 시간 표준을 제공하므로 프로그램에 필요한 경우 시간대에 따라 코드를 지원할 수 있습니다.

결론

이 튜토리얼에서는 Date 객체를 인스턴스화하는 방법, 내장 메서드를 사용하여 주어진 날짜의 구성 요소에 액세스하고 수정하는 방법을 배웠습니다. JavaScript의 시간과 날짜에 대한 자세한 내용은 Mozilla 개발자 네트워크에서 찾을 수 있습니다.

날짜 작업 방법을 아는 것은 정기적인 보고서 생성부터 올바른 시간대로 날짜 및 일정 표시에 이르기까지 JavaScript의 많은 일반적인 작업에 중요합니다.

태그:

사이트에 또 다른 유용한 점은 현재 날짜를 삽입하는 것입니다. 인터넷에는 날짜 스크립트의 예가 수십 개 있지만 제 생각에는 그 중 상당수가 심각하고 추악한 것 같습니다. 그 사이에, 표준 수단 JavaScript를 사용하면 웹사이트 페이지에 날짜를 삽입하는 것이 매우 쉽습니다. 나는 그것을 매우 자주 사용합니다! Skazka 사유지의 사진(현재 사이트의 스크린샷)에 있습니다!

전체 날짜 스크립트는 다음과 같습니다.

제 생각에는 이보다 더 쉽고, 아름답고, 이해하기 쉬운 곳은 없습니다. 이 스크립트의 구성을 연구하고 싶지 않다면 HTML 페이지의 아무 곳에나 붙여넣고 다음 내용을 얻으십시오.

또 다른 고급 옵션

//
// ]]>
// ]]>
// ]]>
// ]]>
// ]]>
! 오늘
// + " " + d.getFullYear() + " y.");
// ]]>
// ]]>
// ]]>
// ]]>
// ]]>
// ]]>

다음과 같습니다.

오늘

일반적으로 기술이 필요하지 않습니다. 어리석게 코드를 삽입하면 모든 것이 정상입니다!

더:

따라서 변수 d에 날짜 값을 할당한 다음 요일( day )과 월( Month )에 대한 배열( Array )을 만들고 필요한 문법 형식(대소문자, 숫자, 대문자)으로 지정합니다. 단어가 날짜의 시작 부분에 있는 경우 등. .P. 스크립트의 마지막 줄은 실제로 날짜를 인쇄합니다( document.write ). 여기에서는 현재 날짜 표시줄에 표시할 내용과 순서를 설정합니다. 구성 요소는 + 기호로 서로 구분됩니다. 공백을 입력하려면 " " 구조를 사용하고 문자 g(연도)를 입력하려면 "g" 구조를 사용합니다.

스크립트에서 볼 수 있듯이 현재 시간 데이터를 가져오는 것은 get 요소에 의해 수행됩니다. 이 방법을 사용하면 다음 정보를 얻을 수 있습니다.

  • getDate() - 해당 월의 날짜를 나타내는 1부터 31까지의 숫자를 반환합니다.
  • getDay() - 요일을 0(일요일)부터 6(토요일)까지의 정수로 반환합니다.
  • getMonth() - 해당 연도의 월 수를 반환합니다.
  • getFullYear() - 연도를 반환합니다. getYear()만 사용하면 현재 연도에서 1900을 뺀 값이 인쇄됩니다.
  • get Hours() - 하루 중 시간을 반환합니다.
  • getMinutes() - 0에서 59 사이의 숫자로 분을 반환합니다.
  • getSeconds() - 0에서 59까지의 초 수를 반환합니다.

Java 스크립트를 사이트 페이지에 직접 삽입하는 것이 항상 편리한 것은 아닙니다. 페이지 상단의 태그 사이에 스크립트 설명을 배치하고 텍스트에서 필요에 따라 호출할 변수를 설정하는 것이 좋습니다. TODAY라고 부르고 위와 같은 방식으로 날짜 출력 형식을 정의해 보겠습니다. 스크립트는 다음과 같습니다.


날짜를 표시하려면 다음 명령을 사용하여 페이지 HTML 코드의 올바른 위치에서 스크립트를 호출합니다.


document.write(오늘);

사이트에 날짜를 표시해야 하는 페이지가 많이 있는 경우 날짜를 표시하기 위한 Java 스크립트를 별도의 파일(예: data.js )로 분리하는 것이 더 편리합니다. 실제로 이것은 설명된 스크립트 중 첫 번째, 즉 document.write 줄(위 참조)로 구성된 페이지입니다. 메인 페이지와 같은 디렉터리에 위치해야 하며, 다음과 같이 날짜가 표시되는 곳에서 호출됩니다.


data.js 파일의 인코딩이 기본 문서와 동일한지 확인하세요. 그렇지 않으면 날짜가 멋진 고리, 사각형 및 기타 장신구와 함께 표시됩니다.

논평.설명된 스크립트는 사용자 컴퓨터에 설정된 날짜를 표시하며 이는 항상 실제 현재 시간과 일치하지는 않습니다. 정확한 시간을 표시해야 하는 경우 서버에 시간을 표시하는 PHP 스크립트를 사용해야 합니다.

현재 날짜와 시간을 포함하는 새 Date 객체를 만들려면 new Date()를 사용하세요.

그것을 참고날짜() 인수 없이 호출되는 것은 다음과 같습니다.새로운 날짜(Date.now()) .

날짜 객체가 있으면 사용 가능한 여러 메소드 중 하나를 사용하여 해당 속성을 검색할 수 있습니다(예: 4자리 연도를 가져오려면 getFullYear()).

다음은 몇 가지 일반적인 날짜 방법입니다.

현재 연도를 가져옵니다. var year = (new Date()).getFullYear(); 콘솔로그(연도); // 샘플 출력: 2016 이번 달을 가져옵니다. var Month = (new Date()).getMonth(); 콘솔로그(월); // 샘플 출력: 0

0 = 1월입니다. 월별로 다르기 때문이죠 0 ~ 전에 11 이므로 색인에 +1을 추가하는 것이 바람직한 경우가 많습니다.

현재 날짜를 가져옵니다. var day = (new Date()).getDate(); 콘솔로그(일); // 샘플 출력: 31 현재 시간을 가져옵니다. var hour = (new Date()).getHours(); 콘솔 로그(시간); // 샘플 출력: 10 현재 분 가져오기 var Minute = (new Date()).getMinutes(); 콘솔 로그(분); // 샘플 출력: 39 현재 초 가져오기 var second = (new Date()).getSeconds(); 콘솔로그(초); // 샘플 출력: 48 현재 밀리초 가져오기

Date 객체 인스턴스의 밀리초(0~999)를 얻으려면 getMilliseconds 메소드를 사용하십시오.

var milliseconds = (new Date()).getMilliseconds(); 콘솔 로그(밀리초); // 출력: 현재 밀리초

현재 시간과 날짜를 사람이 읽을 수 있는 문자열로 변환 var now = new Date(); // 날짜를 UTC 시간대 형식의 문자열로 변환: console.log(now.toUTCString()); // 출력: 2017년 6월 21일 수요일 09:13:01 GMT

정적 Date.now() 메서드는 1970년 1월 1일 00:00:00 UTC 이후의 밀리초 수를 반환합니다. Date 객체의 인스턴스를 사용하여 해당 시간 이후 경과된 밀리초 수를 얻으려면 해당 getTime 메서드를 사용하십시오.

// 현재 날짜의 정적 메소드를 사용하여 밀리초를 가져옵니다. console.log(Date.now()); // Date 인스턴스의 getTime 메소드를 사용하여 밀리초를 가져옵니다. console.log((new Date()).getTime());

안녕하세요 여러분!
저는 종종 통계 데이터를 다루어야 하는데 날짜와 관련된 일이 많습니다. 또한 동일한 날짜를 다양한 형식(예: 기계 친화적, 인간 친화적)으로 페이지에 사용할 수 있습니다. 나는 여러분 대부분이 Date 객체를 사용하면서 나오는 모든 끔찍한 코드에 대해 꽤 잘 알고 있다고 생각합니다.
예를 들어, DD.MM.YYYY 형식으로 현재 날짜를 얻으려면 다음을 수행해야 합니다.
var d = new Date(), fd = d.getDate() + "." + (d.getMonth()+1) + "." + d.getFullYear();
그리고 그런 줄이 많을 때는 언제입니까? 자바스크립트에서는 개발할 때 월이 0부터 시작한다는 사실을 기억하기 쉽나요? 아니면 백엔드의 거의 모든 곳에서 초가 아닌 밀리초가 있다는 사실인가요? 인기 있는 Moment.js 라이브러리를 사용하면 일부 문제를 해결할 수 있지만 작동 속도가 매우 느립니다.
문제의 라이브러리는 이러한 문제를 해결합니다.
관심이 있으시면 이 짧은 리뷰를 읽어 보시기 바랍니다.

TempusJS는 Date 개체에 대한 많은 구문 설탕이므로 매우 빠릅니다. 라이브러리 자체의 구문은 매우 간단합니다. 예를 들어 이전 예제는 다음과 같이 작성할 수 있습니다.
var fd = tempus().format("%d.%m.%Y");
이제 속도에 대해. 스포일러에서는 Tempus와 Moment의 비교 및 ​​기본 날짜 형식을 볼 수 있습니다(위 참조).

네이티브 JS, MomentJS, TempusJS 비교

현재 날짜 가져오기 네이티브 JS x 2,175,575 ops/초 ±0.75%(96 실행 샘플링) 순간 x 284,864 ops/초 ±0.85%(96 실행 샘플링) Tempus x 2,086,081 ops/초 ±0.73%(97 실행 샘플링) 네이티브 JS 형식 지정 x 1,637,517 ops/초 ±0.61%(100개 실행 샘플링) 순간 x 8,808 ops/초 ±1.07%(100개 실행 샘플링) Tempus x 942,815 ops/초 ±0.68%(94개 실행 샘플링) 자동 날짜 감지 및 기본 JS 구문 분석 x 11,204,316 ops /초 ±0.81%(88개 실행 샘플링) 순간 x 38,511ops/초 ±1.41%(95개 실행 샘플링) Tempus x 93,973ops/초 ±1.06%(85개 실행 샘플링) 순간 x 46,293ops/초 ±0.63% 날짜 구문 분석( 100개 실행 샘플링) Tempus x 109,947 ops/초 ±0.93%(99개 실행 샘플링) 구문 분석 및 검증 순간 x 44,588 ops/초 ±1.09%(90개 실행 샘플링) Tempus x 103,439 ops/초 ±0.90%(94개 실행 샘플링)
결과는 내 노트북에서 구글 크롬 30.0.1599.114. 다른 브라우저에서는 결과가 다르지만 비율은 거의 동일하게 유지됩니다.
테스트에는 benchmark.js 라이브러리가 사용되었습니다.
다른 기능에 대한 벤치마크를 볼 수 있습니다.

따라서 이 라이브러리의 장점은 다음과 같이 작성할 수 있습니다.

  • IE6+, Chrome, Firefox, Opera를 지원합니다.
  • 호출 체인을 지원합니다.
  • 월은 0 대신 1(기본값)부터 시작할 수 있습니다.
  • 밀리초는 비활성화(기본값)하거나 활성화할 수 있습니다.
  • 빠른 작업(대부분의 경우 브라우저의 기본 Date 개체가 사용되며 그 구현은 더 빠른 언어로 작성됨)
  • 사용자 정의 형식 및 플러그인 지원
  • 날짜 유효성 검사는 매우 빠르며 날짜를 설정하는 기능에만 의존합니다(값을 입력할 때 유효성 검사가 이미 수행되고 별도로 계산되지 않기 때문입니다).
  • 다국어 지원 및 사용자 언어 자동 감지.

여기서는 일부 기능에 대해서만 설명하겠습니다.

형식화 및 구문 분석

따라서 우선 날짜 형식 지정의 또 다른 예를 살펴보겠습니다. 여기서는 호출 체인도 사용합니다. 각 값 설정이 끝나면 체인 아래에서 더 사용할 수 있는 TempusDate 개체를 다시 얻습니다. 예:
템퍼스(). // 새로운 날짜를 얻습니다. calc((월: -1)). // 한 달씩 줄입니다. format("%d.%m.%Y"); // 문자열로 출력
따라서 우리는 같은 날, 시, 초를 얻지만 한 달 전을 얻게 됩니다. 이는 지난 달 보고서를 가져오는 데 유용합니다.

다음 예는 날짜 구문 분석입니다.
// 날짜가 "2013-11-18"인 TempusDate 객체를 반환합니다. tempus("11/18/2013"); // 날짜가 "2013-12-12"인 TempusDate 객체를 반환합니다. tempus("2013-12-12", "%Y-%m-%d"));
Tempus는 일부 알려진 형식을 자동으로 감지할 수 있습니다. 또한 특정 형식을 지정하면 구문 분석이 더 빨라집니다. 또한 구문 분석에 실패할 경우 반환될 날짜를 설정할 수 있습니다.
// 왜냐하면 "123"은 "%d.%m.%Y" 형식과 일치하지 않습니다. // 2013-01-01 날짜를 포함하는 객체가 반환됩니다. tempus("123", "%d.%m.%Y ", 템퍼스());
기본 형식 목록을 볼 수 있습니다.

이제 이미 형식이 지정된 날짜의 형식을 변경해 보겠습니다.
// "2013-11-05" tempus("2013/11/05").format("%Y-%m-%d"); // 아니면 이렇게 // "10월 12일" tempus("2013-10-12 12:31:01", "%Y-%m-%d %H:%M:%S").format(" %B, %d");

또한 서식 지정을 위해 현지화를 사용할 수도 있습니다. 기본적으로 사용자의 언어가 선택됩니다(브라우저에서 가져옴). 사용자의 언어가 사용 가능한 Tempus 언어 중에 없으면 기본 언어가 선택됩니다.
// 언어 설정 tempus.lang("ru"); // 표준 사용 형식 // "Nov, 05" tempus(1383609600).format("%B, %d");
현재 러시아어와 영어의 두 가지 언어만 있으므로 기꺼이 도와드리겠습니다.

유효성 검사 날짜 유효성 검사는 다음과 같습니다.
// 거짓 tempus를 반환합니다("08/32/2013", "%d.%m.%Y").valid(); // 실제 tempus를 반환합니다("00:00 01/01/2012", "%H:%M %d.%m.%Y").valid();

오류가 발생한 경우 값이 false가 아닌 경우 오류가 발생한 필드를 볼 수 있습니다.
// ("연도":-5,"월":false,"일":false,"시간":false, // "분":false,"초":false,"밀리초":false) 템퍼스를 반환합니다. (). 연도(-5). // 연도=-5로 설정합니다. 즉, 잘못된 오류(); // 오류가 있는 객체를 얻습니다.

날짜 범위 때로는 연도(예: 연령), 월, 일 수 등을 알아야 합니다. 두 날짜 사이. 이를 위해 두 날짜 간의 차이를 찾아 원하는 형식("연도", "월", "일", "시간", "분", "초", ")으로 반환하는 between 메서드를 사용할 수 있습니다. 밀리초").
다음은 2013년 11월 1일부터 2014년 5월 5일 사이의 개월 수를 구하는 간단한 예입니다.
// 6개의 tempus()를 반환합니다.between(tempus(), "month");
아니면 새해까지 몇 시간 남았나요?
tempus().between(tempus(), "시간");
마지막 예에서는 연도만 지정했음을 알 수 있습니다. 배열이나 객체에 값을 설정할 때 누락된 값은 다음과 같습니다.
최소한으로 채웠습니다. 문서에서 최소값이 있는 상수 목록을 볼 수 있습니다.

또한 calc 함수를 사용하여 날짜를 변경할 수 있습니다.
// 날짜가 2012-01-01인 TempusDate를 반환합니다. tempus().calc((연도: 1, 월: -4, 일: -1));

사용자 정의 형식 월에 자체 형식을 적용합니다. 이 형식은 01에서 12 대신 1에서 12까지의 값을 사용할 수 있습니다.
// 새로운 형식 등록 tempus.registerFormat("%q", // 지시문 - %q function(date) ( // 여기에 형식 지정 함수를 지정합니다. 즉, %q를 대체할 내용 return date.month(); ) , function(value) ( ​​​​// 여기에 구문 분석 함수가 있습니다. var v = Number(value); return (month: (isNaN(v) ? undefed: v) ); ), 1, // 값 2는 , // 최대 길이 "number" // 유형); // 테스트 // "01.1.2013"을 반환합니다. tempus((연도: 2013, 월: 1, 일: 1)).format("%d.%q.%Y"); // 반환 ("연도":2013,"월":2,"일":10,"시간":0,"분":0,"초":0); tempus("2013년 2월 10일", "%d.%q.%Y").get();
등록할 때 일부 매개변수가 별도로 설정되는 반면 정규식을 사용할 수 있다는 것을 알 수 있습니다. 사실 처음에는 거기에 있었지만, 버리고 나니 속도가 수십 배나 빨라졌다.
일부 형식을 제거해야 하는 경우 unregisterFormat을 사용하십시오.
tempus.unregisterFormat("%d"); // "%d.01.2013"을 반환합니다. 왜냐하면 %d 지시문은 더 이상 존재하지 않습니다. tempus.format((연도: 2013, 월: 1, 일: 1), "%d.%m.%Y"); Getters/Setters year(), Month(), day(), hour(), Minutes(), second(), milliseconds(), dayOfWeek(), utc() 함수를 사용하여 특정 값을 가져오거나 설정할 수 있습니다. , 타임스탬프( ) 또는 set(). 예를 들어:
템퍼스(). // 현재 날짜 연도(1900)를 가져옵니다. // 그대로 두고 연도를 1900으로 설정합니다. leapYear(); // 윤년인지 확인합니다. 이 경우 false입니다. tempus().year(); // 이것이 숫자 형식으로 현재 연도를 얻는 방법입니다. 날짜 생성 날짜는 다양한 방법으로 생성할 수 있습니다. 전체 목록매개변수는 문서에 있습니다. 다음은 최소한의 예입니다.
// ["2013년 3월 29일", "2013년 3월 30일", "2013년 3월 11일", "2013년 4월 1일", "2013년 4월 2일"]을 반환합니다. tempus.generate(( dateFrom: "20130329", formatFrom: "%Y.%m.%d", dateTo: "20130402", 기간: (일: 1), 형식: "%d.%m.%Y" )));
이는 백엔드에 대한 요청 없이 클라이언트에서 직접 날짜별로 차트를 표시하고 표시 형식을 변경하는 데 유용할 수 있습니다. 날짜는 배열이나 객체로 생성될 수 있으며, 여기서 날짜 자체는 키로 사용됩니다(이는 이벤트를 날짜에 바인딩해야 할 때(예: 자체 달력을 만들 때) 유용합니다). 또한 날짜는 일, 주, 월, 시간, 연도 등 무엇이든 기준으로 그룹화할 수 있습니다. 이것은 달력에도 적용될 수 있습니다.플러그인 마지막으로 중요한 것은 플러그인입니다. 여기서는 임의의 날짜를 생성하기 위해 공장을 확장합니다. 또한 tempus.classes()에서 찾을 수 있는 TempusDate 클래스가 필요합니다. 다음은 예제 플러그인입니다:
(함수(tempus) ( var TempusDate = tempus.classes("TempusDate"); tempus.randomDate = function() ( var date = new TempusDate(); date.year(Math.floor((Math.random()*( tempus.MAX_YEAR - tempus.MIN_YEAR)) + tempus.MIN_YEAR)).month(Math.floor((Math.random()*(tempus.MAX_MONTH - tempus.MIN_MONTH)) + tempus.MIN_MONTH)).day(Math. Floor((Math.random()*(date.dayCount() - tempus.MIN_DAY)) + tempus.MIN_DAY)).hours(Math.floor((Math.random()*(tempus.MAX_HOURS - tempus.MIN_HOURS) ) + tempus.MIN_HOURS)).분(Math.floor((Math.random()*(tempus.MAX_MINUTES - tempus.MIN_MINUTES)) + tempus.MIN_MINUTES)).seconds(Math.floor((Math.random() *(tempus.MAX_SECONDS - tempus.MIN_SECONDS)) + tempus.MIN_SECONDS)); 반환 날짜; ); ))(tempus); // 이제 다음과 같은 날짜를 만들 수 있습니다. var someRandomDate = tempus.randomDate();
이렇게 하면 jQuery + Tempus, Angular + Tempus 등을 사용하여 위젯을 작성하는 것이 편리할 것이라고 생각합니다. Github에서 소스를 다운로드하여 소스를 설치할 수 있습니다.
https://github.com/crusat/tempus-js/releases
또는 Bower를 통해:
$ 정자 설치 템퍼스
tempus.js 또는 tempus.min.js라는 파일 하나만 필요합니다.

이 라이브러리가 유용하길 바라며, 라이브러리를 올바른 방향으로 더욱 발전시키기 위해 무엇이 부족한지 아는 것도 흥미로울 것입니다. 관심을 가져주셔서 감사합니다!
추신 초대 해주셔서 감사합니다!



관련 기사: