मानव-हितैषी रिश्तेदार तिथि प्रारूपण के लिए जावास्क्रिप्ट पुस्तकालय [बंद]

94

बन्द है। यह प्रश्न स्टैक ओवरफ्लो दिशानिर्देशों को पूरा नहीं करता है । यह वर्तमान में उत्तर स्वीकार नहीं कर रहा है।

इस प्रश्न को सुधारना चाहते हैं? सवाल को अपडेट करें ताकि यह स्टैक ओवरफ्लो के लिए विषय पर हो ।

4 साल पहले बंद हुआ ।

मैं वर्तमान तिथि के सापेक्ष कुछ तिथियों को मानव-अनुकूल प्रारूप में प्रदर्शित करना चाहता हूं।

मानव-अनुकूल सापेक्ष तिथियों के उदाहरण:

10 सेकंड पहले
अब से 20 मिनट
1 दिन पहले
5 सप्ताह पहले
दो महीने पहले

मूल रूप से ईमानदारी से परिमाण के उच्चतम क्रम को संरक्षित करना (और वरीयता द्वारा, केवल इकाइयों को स्थानांतरित करना जब 2 इकाइयों को पारित करना - 1 महीने के बजाय 5 सप्ताह)।

हालाँकि मैं एक ऐसे पुस्तकालय के साथ रह सकता था जिसका नियंत्रण कम था और यहाँ तक कि अधिक दोस्ताना तारीखें भी:

बिता कल
आने वाला कल
पिछले सप्ताह
कुछ क्षणों पहले
एक दो घंटे में

इसके लिए कोई लोकप्रिय पुस्तकालय?

javascript date formatting

— rampion
स्रोत

केवल वास्तविक तिथि और समय प्रस्तुत करने की तुलना में "1 दिन पहले" अधिक "मानव अनुकूल" क्यों है?

— रॉब

5

@RobG मैं कहूंगा कि यह संदर्भों जैसे पृष्ठ पर स्विच करने से बचने के बारे में अधिक है जो कि ज्यादातर पाठ है और पढ़ा जा रहा है, संदर्भ स्विच को उदाहरण के लिए mm / dd / yy ठहराव का कारण बन सकता है। डेटा तालिका में, उस प्रारूप का उपयोग करना अधिक पठनीय हो सकता है। यह इस बात पर भी निर्भर करता है कि पाठक को तारीख के साथ क्या करना है जैसे कि "यह n दिन पहले हुआ था" या "1/1/1972 से पहले ऐसा हुआ" पाठक के संदर्भ में उचित या अन्यथा उचित है।

— '16

शायद, लेकिन यह "कल ... 3 दिन पहले ... 10 / मई ..." के रूप में घटनाओं की एक सूची को देखने के लिए भ्रमित कर रहा है। मुझे अभी भी उन सभी को मेरे सिर में तारीखों में बदलने की जरूरत है, जब वे हुईं। तिथियां संक्षिप्त और सटीक हैं, "समय से पहले" मूल्य संवादी हैं, सटीकता की कमी है और आमतौर पर केवल संबद्ध तिथि के साथ सहायक होते हैं। शायद वह सिर्फ मैं ही हूं, लेकिन शायद नहीं। :-)

— रोबग

6

मैं कहूंगा कि यह संदर्भ पर निर्भर करता है। आखिरकार, आप यह नहीं कहेंगे कि "मैं 17 फरवरी 2014 को मछली पकड़ने गया था" यदि वह वास्तव में कल था। वहाँ बहुत अधिक मस्तिष्क विराम है। इस तरह का पाठ हाल की घटनाओं की सूची के लिए एकदम सही है।

— साइमन विलियम्स

2

@RobG केवल हम जैसे नॉर्मल लोगों की तरह सोचते हैं।

92

जब से मैंने यह उत्तर लिखा है, एक अच्छी तरह से ज्ञात पुस्तकालय उपलब्ध है । क्षण ।

कर रहे हैं उपलब्ध पुस्तकालयों , लेकिन यह यह अपने आप को लागू करने के लिए तुच्छ है। बस कुछ शर्तों का उपयोग करें।

मान लें dateकि Dateआप जिस समय के खिलाफ तुलना करना चाहते हैं उसके लिए एक त्वरित वस्तु है।

// Make a fuzzy time
var delta = Math.round((+new Date - date) / 1000);

var minute = 60,
    hour = minute * 60,
    day = hour * 24,
    week = day * 7;

var fuzzy;

if (delta < 30) {
    fuzzy = 'just then.';
} else if (delta < minute) {
    fuzzy = delta + ' seconds ago.';
} else if (delta < 2 * minute) {
    fuzzy = 'a minute ago.'
} else if (delta < hour) {
    fuzzy = Math.floor(delta / minute) + ' minutes ago.';
} else if (Math.floor(delta / hour) == 1) {
    fuzzy = '1 hour ago.'
} else if (delta < day) {
    fuzzy = Math.floor(delta / hour) + ' hours ago.';
} else if (delta < day * 2) {
    fuzzy = 'yesterday';
}

भविष्य की तारीखों को संभालने के लिए आपको इसे अनुकूलित करने की आवश्यकता होगी।

— एलेक्स
स्रोत

9

कल अंतिम आधी रात से पहले है, 24 घंटे से 48 घंटे पहले के बीच नहीं।

— mxcl

@mmaclaurin खदान कभी भी पूर्ण समाधान नहीं था, बस सही दिशा में एक संकेतक था। मैं इसे बाद में अपडेट करने के लिए एक नोट करूंगा, या यदि आप चाहें, तो उत्तर को संपादित करने के लिए स्वतंत्र महसूस करें।

— एलेक्स

कृपया तारीख-fns पर भी नज़र डालें ! यदि आप अपने कोड आधार को छोटा रखना पसंद करते हैं तो यह एक महान पुस्तकालय है, क्योंकि इसमें क्षणिकाओं की तुलना में बहुत कम पदचिह्न हैं!

— mesqueeb

1

मैंने एक ट्विटर स्टाइल getTimeAgoफंक्शन gist.github.com/pomber/6195066a9258d1fb93bb59c206345b38

— pomber

85

मैंने क्षण लिखा। js , एक तारीख पुस्तकालय जो ऐसा करता है। यह ~~5KB (2011)~~ 52KB (2019) के बारे में है, और ब्राउज़रों और नोड में काम करता है। यह शायद जावास्क्रिप्ट के लिए सबसे लोकप्रिय और प्रसिद्ध तिथि पुस्तकालय भी है।

यह टाइमगो, फ़ॉर्मेटिंग, पार्सिंग, क्वेरी, मैनिपुलेटिंग, i18n, आदि का समर्थन करता है।

अतीत में तारीखों के लिए टिम्गो (सापेक्ष समय) के साथ किया जाता है moment().fromNow()। उदाहरण के लिए, 1 जनवरी 2019 को टैम्गो प्रारूप में प्रदर्शित करने के लिए:

let date = moment("2019-01-01", "YYYY-MM-DD");
console.log(date.fromNow());

<script src="https://momentjs.com/downloads/moment.min.js"></script>

स्निपेट का विस्तार करें

टाइमगो स्ट्रिंग्स के साथ अनुकूलन योग्य हैं moment.updateLocale(), इसलिए आप उन्हें बदल सकते हैं कि आप कैसे फिट देखते हैं।

कटऑफ वह नहीं है जो प्रश्न अनुरोध करता है ("5 सप्ताह" बनाम "1 महीने"), लेकिन यह प्रलेखित किया जाता है कि किस समय सीमा के लिए तार का उपयोग किया जाता है।

— timrwood
स्रोत

1

ब्राउज़र और नोड में काम करने के लिए यश !!!!

— '16

48

हा आकार अद्यतन हालांकि!

— अक्सेडेनिग्नेर्स

1

कृपया तारीख-fns पर भी नज़र डालें ! यदि आप अपने कोड आधार को छोटा रखना पसंद करते हैं तो यह एक महान पुस्तकालय है, क्योंकि इसमें क्षणिकाओं की तुलना में बहुत कम पदचिह्न हैं!

— mesqueeb

यह पुस्तकालय जितना अच्छा है, उत्तर में इसका उपयोग करने के बारे में स्पष्टीकरण शामिल नहीं है कि किसी संख्या को मानव-अनुकूल तरीके से कैसे प्रारूपित किया जाए

— कोड व्हिस्परर

16

यहाँ जॉन रेजिग से कुछ है - http://ejohn.org/blog/javascript-pretty-date/

EDIT (6/27/2014): सुमुरै 8 की टिप्पणी के बाद - हालांकि लिंक किया हुआ पेज अभी भी काम कर रहा है, यहाँ pretty.jsऊपर दिए गए लेख से लिंक के लिए अंश है:

pretty.js

/*
 * JavaScript Pretty Date
 * Copyright (c) 2011 John Resig (ejohn.org)
 * Licensed under the MIT and GPL licenses.
 */

// Takes an ISO time and returns a string representing how
// long ago the date represents.
function prettyDate(time) {
    var date = new Date((time || "").replace(/-/g, "/").replace(/[TZ]/g, " ")),
        diff = (((new Date()).getTime() - date.getTime()) / 1000),
        day_diff = Math.floor(diff / 86400);

    if (isNaN(day_diff) || day_diff < 0 || day_diff >= 31) return;

    return day_diff == 0 && (
    diff < 60 && "just now" || diff < 120 && "1 minute ago" || diff < 3600 && Math.floor(diff / 60) + " minutes ago" || diff < 7200 && "1 hour ago" || diff < 86400 && Math.floor(diff / 3600) + " hours ago") || day_diff == 1 && "Yesterday" || day_diff < 7 && day_diff + " days ago" || day_diff < 31 && Math.ceil(day_diff / 7) + " weeks ago";
}

// If jQuery is included in the page, adds a jQuery plugin to handle it as well
if (typeof jQuery != "undefined") jQuery.fn.prettyDate = function() {
    return this.each(function() {
        var date = prettyDate(this.title);
        if (date) jQuery(this).text(date);
    });
};

उपयोग:

prettyDate("2008-01-28T20:24:17Z") // => "2 hours ago"
prettyDate("2008-01-27T22:24:17Z") // => "Yesterday"
prettyDate("2008-01-26T22:24:17Z") // => "2 days ago"
prettyDate("2008-01-14T22:24:17Z") // => "2 weeks ago"
prettyDate("2007-12-15T22:24:17Z") // => undefined

उपयोग पर लेख से अंश:

उदाहरण उपयोग

निम्नलिखित उदाहरणों में मैं साइट पर सभी एंकरों को बनाता हूं, जिनके पास एक तारीख है, जिसमें उनके आंतरिक पाठ के रूप में एक सुंदर तारीख है। इसके अतिरिक्त, मैं पेज लोड होने के बाद हर 5 सेकंड में लिंक अपडेट करता रहता हूं।

जावास्क्रिप्ट के साथ:

function prettyLinks(){
    var links = document.getElementsByTagName("a");
    for ( var i = 0; i < links.length; i++ )
        if ( links[i].title ) {
            var date = prettyDate(links[i].title);
            if ( date )
                links[i].innerHTML = date;
        }
}
prettyLinks();
setInterval(prettyLinks, 5000);

JQuery के साथ:

$("a").prettyDate();
setInterval(function(){ $("a").prettyDate(); }, 5000);

फ़ैज़: मूल कोड, बग फिक्स और सुधारों में कुछ बदलाव किए।

function prettyDate(time) {
    var date = new Date((time || "").replace(/-/g, "/").replace(/[TZ]/g, " ")),
        diff = (((new Date()).getTime() - date.getTime()) / 1000),
        day_diff = Math.floor(diff / 86400);
    var year = date.getFullYear(),
        month = date.getMonth()+1,
        day = date.getDate();

    if (isNaN(day_diff) || day_diff < 0 || day_diff >= 31)
        return (
            year.toString()+'-'
            +((month<10) ? '0'+month.toString() : month.toString())+'-'
            +((day<10) ? '0'+day.toString() : day.toString())
        );

    var r =
    ( 
        (
            day_diff == 0 && 
            (
                (diff < 60 && "just now")
                || (diff < 120 && "1 minute ago")
                || (diff < 3600 && Math.floor(diff / 60) + " minutes ago")
                || (diff < 7200 && "1 hour ago")
                || (diff < 86400 && Math.floor(diff / 3600) + " hours ago")
            )
        )
        || (day_diff == 1 && "Yesterday")
        || (day_diff < 7 && day_diff + " days ago")
        || (day_diff < 31 && Math.ceil(day_diff / 7) + " weeks ago")
    );
    return r;
}

— हरि पचुवेतिल
स्रोत

1

हाय फ्लोयड, मैंने आपके उत्तर में कुछ बदलाव (बग फिक्स, सुधार) जोड़े हैं। आशा है कि आप बुरा न मानें

— Faiz

अच्छा था! लेकिन टाइमस्टैम्प संख्यात्मक प्रकार के साथ काम न करें, शायद एक बेहतर फिल्टर की आवश्यकता है जैसे कि (टाइपोफ़ टाइम == 'स्ट्रिंग') {समय = time.replace (/ - / g, "/").replace(/ "TTades/ जी, "")); }

— आर्थर अरोजो

15

sugar.js में महान दिनांक स्वरूपण कार्य हैं।

इतना ही नहीं, यह सामान्य सामान्य प्रयोजन के कार्य भी प्रदान करता है जैसे कि स्ट्रिंग प्रारूपण, संख्या स्वरूपण, आदि जो उपयोग करने के लिए सुविधाजनक हैं।

— हेंडी इरावन
स्रोत

1

सहमत हूँ, sugar.js यहाँ अधिक ध्यान देने योग्य हैं।

— शहरकीड

5

चीनी बनाम पल का एक उदाहरण यहां: एक कैलेंडर के लिए जो सप्ताह प्रदर्शित करता है, मुझे आखिरी सोमवार के मूल्य की आवश्यकता थी:

moment.js

var m = moment().subtract("days", 1).sod().day(1) // returns a "moment"

sugar.js

var d = Date.past("monday") // returns a js Date object

मैं बहुत अधिक चीनी पसंद करता हूं और कुछ महीनों के बाद क्षण के साथ आता हूं। यह स्पष्ट है और Javascripts 'तिथि वर्ग के साथ अच्छी तरह से एकीकृत करता है।

ओपी के मामले दोनों लिबास द्वारा कवर किए जाते हैं, शुगर के लिए। http://sugarjs.com/dates देखें

— citykid
स्रोत

4

यह js स्क्रिप्ट बहुत अच्छी है। आपको बस इसे निष्पादित करना है। सभी <time>टैग को रिश्तेदार तिथियों में बदल दिया जाएगा और हर कुछ मिनटों में अपडेट किया जाएगा, इसलिए सापेक्ष समय हमेशा अद्यतित रहेगा।

http://timeago.yarp.com/

— boreq
स्रोत

1

मुझे लगता है कि यह सबसे अच्छा समाधान है। पुस्तकालय बहुत सक्रिय रूप से बनाए रखा जाता है, यह रेजिग के कोड से प्रेरित / प्रेरित है, यह बहुत छोटा है, इसमें कई स्थानीयकरण हैं, यह एकीकृत करने के लिए तुच्छ है।

— जॉन बाचिर

4

लगता है कि आप http://www.datejs.com/ का उपयोग कर सकते हैं

उनके पास मुख्य पृष्ठ पर एक उदाहरण है जो आपको बता रहा है कि वास्तव में क्या करता है!

संपादित करें: वास्तव में, मुझे लगता है कि मैंने आपके प्रश्न को अपने सिर में उलट दिया है। किसी भी मामले में, मुझे लगता है कि आप इसे देख सकते हैं क्योंकि यह वास्तव में एक महान पुस्तकालय है!

संपादित करें X2: मैं यह कहने जा रहा हूं कि दूसरों ने क्या कहा है http://momentjs.com/ शायद अभी सबसे अच्छा विकल्प उपलब्ध है।

संपादित करें X3: मैंने एक वर्ष से अधिक समय में तारीखों का उपयोग नहीं किया है। मैं अपनी सभी संबंधित तारीखों के लिए विशेष रूप से क्षणिका का उपयोग कर रहा हूं।

— RoboKozo
स्रोत

अच्छा कामगार सुझाव है। अंतर्राष्ट्रीयकरण निश्चित रूप से एक प्लस है।

— स्टीफन

Date.js मेरा पहला विचार भी था, लेकिन मुझे इसके साथ प्रारूप से संख्या पर जाने का कोई रास्ता नहीं दिखता है - हालांकि यह डॉक्स में कहीं छिपा हो सकता है।

— प्राचीर

Date.js को गंभीर बग के रूप में जाना जाता है, और उत्पादन वातावरण में भरोसा नहीं किया जा सकता है। Date.js से लेकर Moment.js

— John Zabroski

मैंने कठिन तरीका सीखा है कि खजूर लिनक्स पर काम नहीं करता है :(

— वसा