JavaScript에서 두 날짜의 차이를 어떻게 알 수 있습니까?


111

시간 프레임으로 이벤트를 정의 할 수있는 응용 프로그램을 만들고 있습니다. 사용자가 시작일을 선택하거나 변경할 때 종료일을 자동으로 채우고 싶습니다. 그러나 두 시간의 차이를 얻는 방법과 그 차이를 사용하여 새로운 종료 날짜를 만드는 방법을 알 수 없습니다.

답변:


73

JavaScript에서 날짜는 getTime()메소드 를 호출하여 epoc 이후 밀리 초 수로 변환 하거나 숫자 표현식에서 날짜를 사용하여 .

따라서 차이를 얻으려면 두 날짜를 빼면됩니다.

차이를 기반으로 새 날짜를 만들려면 생성자에 밀리 초 수를 전달하면됩니다.

var oldBegin = ...
var oldEnd = ...
var newBegin = ...

var newEnd = new Date(newBegin + oldEnd - oldBegin);

이것은 작동합니다

편집 : @bdukes가 지적한 버그 수정

수정 :

동작에 대한 설명 oldBegin, oldEnd그리고 newBegin있습니다 Date인스턴스. 연산자를 호출 +하고 -Javascript 자동 캐스팅을 트리거하고 valueOf()해당 개체 의 프로토 타입 메서드를 자동으로 호출 합니다. valueOf()메서드가에 Date대한 호출로 객체 에서 구현되는 경우가 발생합니다 getTime().

그래서 기본적으로: date.getTime() === date.valueOf() === (0 + date) === (+date)


.getTime ()이 작동하는 데 필요한 형식은 무엇입니까? 예를 들어-new Date ('22 -12-2012 00:00 '). getTime ()이 작동하지 않습니다 ... 아이디어가 있습니까?
Jimmyt1988

1
JS에서 날짜 구문 분석의 경우 다음 질문을 살펴볼 것을 제안합니다. stackoverflow.com/questions/1576753/…
Vincent Robert

8
OldBegin, oldEnd 및 NewBegin이 Date객체 여야 합니까? 여기서 변수 선언이 생략 되었기 때문에 어떤 유형의 객체가되어야하는지 말하기는 어렵습니다.
Anderson Green

또한 JavaScript에서 날짜를 더하거나 빼는 데 사용할 수있는 함수가 있습니다. stackoverflow.com/a/1214753/975097
Anderson Green

숫자와 날짜를 추가 할 때주의하십시오. 설명은 아래 내 대답을 참조하십시오
Dan

24

JavaScript는 즉시 날짜 차이를 완벽하게 지원합니다.

var msMinute = 60*1000, 
    msDay = 60*60*24*1000,
    a = new Date(2012, 2, 12, 23, 59, 59),
    b = new Date("2013 march 12");


console.log(Math.floor((b - a) / msDay) + ' full days between');
console.log(Math.floor(((b - a) % msDay) / msMinute) + ' full minutes between');

이제 몇 가지 함정이 있습니다. 이 시도:

console.log(a - 10);
console.log(a + 10);

따라서 숫자와 날짜를 추가 할 위험이있는 경우 날짜를 number직접 변환하십시오 .

console.log(a.getTime() - 10);
console.log(a.getTime() + 10);

내 첫 번째 예제는 Date 객체의 힘을 보여 주지만 실제로는 시한 폭탄처럼 보입니다.


댄, 당신의 모범이 이해하고 따라가는 가장 쉬운 방법을 찾았습니다. 감사.
Melanie

5
"함정"은 실제로 언어 사양에 따라 기본값입니다. 빼기 연산자 -는 인수를 숫자로 강제 변환하므로 Date는 시간 값을 반환합니다. +연산자는 오버로드, 그래서 번호 또는 연결에, 강제를 추가 할 수 있습니다. 이 경우 날짜는 문자열로 강제 변환되므로 +연결을 수행합니다. 혼란은 Date 개체의 잘못이 아니라 연산자 오버로딩의 문제입니다.
RobG

9

JsFiddle 데모보기

    var date1 = new Date();    
    var date2 = new Date("2025/07/30 21:59:00");
    //Customise date2 for your required future time

    showDiff();

function showDiff(date1, date2){

    var diff = (date2 - date1)/1000;
    diff = Math.abs(Math.floor(diff));

    var days = Math.floor(diff/(24*60*60));
    var leftSec = diff - days * 24*60*60;

    var hrs = Math.floor(leftSec/(60*60));
    var leftSec = leftSec - hrs * 60*60;

    var min = Math.floor(leftSec/(60));
    var leftSec = leftSec - min * 60;

    document.getElementById("showTime").innerHTML = "You have " + days + " days " + hrs + " hours " + min + " minutes and " + leftSec + " seconds before death.";

setTimeout(showDiff,1000);
}

HTML 코드 :

<div id="showTime"></div>

4

당신은 시간 구성 요소에 대해 상관하지 않을 경우 사용할 수 있습니다 .getDate().setDate()단지 날짜 부분을 설정할 수 있습니다.

따라서 종료일을 시작일로부터 2 주 후로 설정하려면 다음과 같이하십시오.

function GetEndDate(startDate)
{
    var endDate = new Date(startDate.getTime());
    endDate.setDate(endDate.getDate()+14);
    return endDate;
}

두 날짜 간의 차이 (일)를 반환하려면 다음과 같이하십시오.

function GetDateDiff(startDate, endDate)
{
    return endDate.getDate() - startDate.getDate();
}

마지막으로 2nd에서 반환 된 값을 매개 변수로 사용할 수 있도록 첫 번째 함수를 수정 해 보겠습니다.

function GetEndDate(startDate, days)
{
    var endDate = new Date(startDate.getTime());
    endDate.setDate(endDate.getDate() + days);
    return endDate;
}

31
GetDateDiff()월간 장벽을 뛰어 넘을 것입니다. 예를 들어 2011/04/26 및 2011/05/01은 -25를 반환하지만 오프셋은 5 일이어야합니다.
nfm 2011

var ds = new Date (2014, 0, 31, 0, 0, 0, 0); var de = new Date (2014, 2, 31, 0, 0, 0, 0); GetDateDiff (ds, de) return 0
Noor

3

감사합니다 @ Vincent Robert , 실제로는 기본 예제를 사용하여 끝냈습니다 newBegin + oldEnd - oldBegin. 다음은 단순화 된 최종 솔루션입니다.

    // don't update end date if there's already an end date but not an old start date
    if (!oldEnd || oldBegin) {
        var selectedDateSpan = 1800000; // 30 minutes
        if (oldEnd) {
            selectedDateSpan = oldEnd - oldBegin;
        }

       newEnd = new Date(newBegin.getTime() + selectedDateSpan));
    }

1
가끔 사용 getTime하고 가끔 사용하지 않는 이유를 설명하는 것이 좋습니다.
Dan

2

필요에 따라이 함수는 2 일 간의 차이를 계산하고 소수점 일수로 결과를 반환합니다.

// This one returns a signed decimal. The sign indicates past or future.

this.getDateDiff = function(date1, date2) {
    return (date1.getTime() - date2.getTime()) / (1000 * 60 * 60 * 24);
}

// This one always returns a positive decimal. (Suggested by Koen below)

this.getDateDiff = function(date1, date2) {
    return Math.abs((date1.getTime() - date2.getTime()) / (1000 * 60 * 60 * 24));
}

1
A의 배치 Math.abs()호출, 그리고 당신은 항상 긍정적 인 소수를 얻을 것이다.
Koen.

1
좋은 제안 Koen. 그러면 사람들에게 두 가지 옵션이 제공됩니다. 제안한대로 실제 날짜 차이 또는 차이가 과거 또는 미래인지를 나타내는 기호가있는 날짜 차이입니다. :)
sparkyspider

JavaScript date.getTime()에서는 미래 / 과거 시간을 얻기 위해 밀리 초 단위로 숫자를 더하거나 뺄 수도 있습니다 . `var nextMinute = new Date (someDate.getTime () + 60 * 1000);
Dan

오타입니까? "2 일 사이". 아마도 두 날짜 사이에있을 것입니다.
tomazahlin

2

moment.js를 사용하는 경우 한 줄의 코드로 날짜 차이를 제공하는 더 간단한 솔루션이 있습니다.

moment(endDate).diff(moment(beginDate), 'days');

자세한 내용은 moment.js 페이지 에서 확인할 수 있습니다 .

건배, Miguel


1
function compare()
{
  var end_actual_time    = $('#date3').val();

  start_actual_time = new Date();
  end_actual_time = new Date(end_actual_time);

  var diff = end_actual_time-start_actual_time;

  var diffSeconds = diff/1000;
  var HH = Math.floor(diffSeconds/3600);
  var MM = Math.floor(diffSeconds%3600)/60;

  var formatted = ((HH < 10)?("0" + HH):HH) + ":" + ((MM < 10)?("0" + MM):MM)
  getTime(diffSeconds);
}
function getTime(seconds) {
  var days = Math.floor(leftover / 86400);

  //how many seconds are left
  leftover = leftover - (days * 86400);

  //how many full hours fits in the amount of leftover seconds
  var hours = Math.floor(leftover / 3600);

  //how many seconds are left
  leftover = leftover - (hours * 3600);

  //how many minutes fits in the amount of leftover seconds
  var minutes = leftover / 60;

  //how many seconds are left
  //leftover = leftover - (minutes * 60);
  alert(days + ':' + hours + ':' + minutes);
}

1

대체 수정 확장 코드 ..

http://jsfiddle.net/vvGPQ/48/

showDiff();

function showDiff(){
var date1 = new Date("2013/01/18 06:59:00");   
var date2 = new Date();
//Customise date2 for your required future time

var diff = (date2 - date1)/1000;
var diff = Math.abs(Math.floor(diff));

var years = Math.floor(diff/(365*24*60*60));
var leftSec = diff - years * 365*24*60*60;

var month = Math.floor(leftSec/((365/12)*24*60*60));
var leftSec = leftSec - month * (365/12)*24*60*60;    

var days = Math.floor(leftSec/(24*60*60));
var leftSec = leftSec - days * 24*60*60;

var hrs = Math.floor(leftSec/(60*60));
var leftSec = leftSec - hrs * 60*60;

var min = Math.floor(leftSec/(60));
var leftSec = leftSec - min * 60;




document.getElementById("showTime").innerHTML = "You have " + years + " years "+ month + " month " + days + " days " + hrs + " hours " + min + " minutes and " + leftSec + " seconds the life time has passed.";

setTimeout(showDiff,1000);
}

답변에 추가 설명을 추가하고 더 나은 영어를 사용하십시오.
기금 모니카의 소송

이 솔루션은 윤년을 무시하고 365 일을 사용하기 때문에 잘못된 것입니다.
Sergey Goliney

0
function checkdate() {
    var indate = new Date()
    indate.setDate(dat)
    indate.setMonth(mon - 1)
    indate.setFullYear(year)

    var one_day = 1000 * 60 * 60 * 24
    var diff = Math.ceil((indate.getTime() - now.getTime()) / (one_day))
    var str = diff + " days are remaining.."
    document.getElementById('print').innerHTML = str.fontcolor('blue')
}

0
<html>
<head>
<script>
function dayDiff()
{
     var start = document.getElementById("datepicker").value;
     var end= document.getElementById("date_picker").value;
     var oneDay = 24*60*60*1000; 
     var firstDate = new Date(start);
     var secondDate = new Date(end);    
     var diffDays = Math.round(Math.abs((firstDate.getTime() - secondDate.getTime())/(oneDay)));
    document.getElementById("leave").value =diffDays ;
 }
</script>
</head>
<body>
<input type="text" name="datepicker"value=""/>
<input type="text" name="date_picker" onclick="function dayDiff()" value=""/>
<input type="text" name="leave" value=""/>
</body>
</html>

0

이 코드는 학습 시작일과 종료일 (적정 일자 자격)을 입력 할 때 학습 기간을 채우고, 1 년 미만의 기간이 예인 경우 알림 메시지가 고려하는 첫 번째 입력 요소가 있는지 확인 txtFromQualifDate하고 두 번째 txtQualifDate와 세 번째txtStudyYears

그것은 분수와 함께 년 수의 결과를 보여줍니다

function getStudyYears()
    {
        if(document.getElementById('txtFromQualifDate').value != '' && document.getElementById('txtQualifDate').value != '')
        {
            var d1 = document.getElementById('txtFromQualifDate').value;

            var d2 = document.getElementById('txtQualifDate').value;

            var one_day=1000*60*60*24;

            var x = d1.split("/");
            var y = d2.split("/");

            var date1=new Date(x[2],(x[1]-1),x[0]);

            var date2=new Date(y[2],(y[1]-1),y[0])

            var dDays = (date2.getTime()-date1.getTime())/one_day;

            if(dDays < 365)
            {
                alert("the date between start study and graduate must not be less than a year !");

                document.getElementById('txtQualifDate').value = "";
                document.getElementById('txtStudyYears').value = "";

                return ;
            }

            var dMonths = Math.ceil(dDays / 30);

            var dYears = Math.floor(dMonths /12) + "." + dMonths % 12;

            document.getElementById('txtStudyYears').value = dYears;
        }
    }

1
브라우저마다 문자열 표시 (특히 구분 기호)가 다르므로 연도를 찾기 위해 날짜 문자열을 구문 분석하지 마십시오. getFullYear그것을 위해 설계된 사용 . ------- 대부분의 코너 케이스를 지원할 수있는 googlecode의 datejs 라이브러리 참조
Dan

@Dan의 조언에 감사하지만 실제 정부 프로젝트 (다른 ​​브라우저)에서 저를 위해 일하고 테스트했습니다. :)
shareef 2013-04-04

0

Date 객체를 사용하고 getTime()두 날짜 모두에 함수를 사용하면 1970 년 1 월 1 일 이후의 각 시간을 숫자 값으로 제공합니다. 그런 다음이 숫자의 차이를 알 수 있습니다.

그래도 도움이되지 않으면 전체 문서를 확인하십시오. http://www.w3schools.com/jsref/jsref_obj_date.asp


오, 예, 몰랐습니다.이 답변 아래의 답변은 최대 반년입니다.
Koen.

0

아래 코드는 오늘부터 선물 날짜까지 남은 날짜를 반환합니다.

종속성 : jQuery 및 MomentJs.

var getDaysLeft = function (date) {
  var today = new Date();
  var daysLeftInMilliSec = Math.abs(new Date(moment(today).format('YYYY-MM-DD')) - new Date(date));
  var daysLeft = daysLeftInMilliSec / (1000 * 60 * 60 * 24);   
  return daysLeft;
};

getDaysLeft('YYYY-MM-DD');

0
var getDaysLeft = function (date1, date2) {
   var daysDiffInMilliSec = Math.abs(new Date(date1) - new Date(date2));
   var daysLeft = daysDiffInMilliSec / (1000 * 60 * 60 * 24);   
   return daysLeft;
};
var date1='2018-05-18';
var date2='2018-05-25';
var dateDiff = getDaysLeft(date1, date2);
console.log(dateDiff);

0

이것이 내가 내 시스템에서 한 일입니다.

var startTime=("08:00:00").split(":");
var endTime=("16:00:00").split(":");
var HoursInMinutes=((parseInt(endTime[0])*60)+parseInt(endTime[1]))-((parseInt(startTime[0])*60)+parseInt(startTime[1]));
console.log(HoursInMinutes/60);
당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.