如何在JavaScript中格式化日期值

在JavaScript中获取日期，要么使用当前日期或特定日期的新Date()或Date()函数Object（）{ [native code] }。

虽然Date()函数Object()生成一个包含当前日期和时间的字符串，但新的Date()函数Object()创建一个新的Date对象。让我们深入了解如何在JavaScript中格式化日期值的文章。

如何在JavaScript中格式化日期？

日期格式取决于您和您的要求。在一些国家，年份（06/22/2022）最先，然后是月份。在其他情况下，天在月份之前，年份（22.06.2022）等等。

无论格式如何，您需要解析日期对象值以检索您在Web页面上所需的详细信息。

为了更好地了解如何在JavaScript中格式化日期值，让我们看一下以下示例。

示例

考虑以下示例，这里我们正在运行脚本以在Web页面中显示日期格式。

<!DOCTYPE html>
<html>
   <body>
      <p id="tutorial"></p>
      <script>
         var tutorial = {
            year: 'numeric',
            month: 'long',
            day: 'numeric',
            weekday: 'long'
         };
         var local = new Date();
         document.getElementById("tutorial").innerHTML = (local.toLocaleDateString("en-US", tutorial));
      </script>
   </body>
</html>

当脚本执行时，它将在网页上生成由日，月和年格式组成的输出。

示例

执行下面的脚本并检查它如何在格式化日期方面工作。

<!DOCTYPE html>
<html>
   <body>
      <div id="tutorial"></div>
      <script>
         function dateformat() {
            var y = new Date();
            var day = y.getDate();
            var x = y.toDateString().substr(4, 3);
            var year = y.getFullYear();
            document.querySelector("#tutorial").innerHTML = day + '-' + x + '-' + year;
         }
         window.onload = dateformat;
      </script>
   </body>
</html>

运行上面的脚本时，输出窗口将弹出，在Web页面上以日期-月份-年份格式显示日期。

使用JavaScript map()

使用map()函数调用一个函数生成新的数组的每个元素。对于数组中的每个元素，Map()只调用一次不同的方法。Map()不执行空元素的方法。原始数组未被改变。

语法

以下是map()的语法

array.map(function(currentValue, index, arr), thisValue)

示例

在以下示例中，我们正在使用map()运行脚本来格式化日期值。

<!DOCTYPE html>
<html>
   <body>
      <script>
         function join(A, tutorials, point) {
            function format(x) {
               let f = new Intl.DateTimeFormat('en', x);
               return f.format(A);
            }
            return tutorials.map(format).join(point);
         }
         let tutorials = [{
            day: 'numeric'
         }, {
            month: 'short'
         }, {
            year: 'numeric'
         }];
         let point = join(new Date, tutorials, '-');
         document.write(point);
      </script>
   </body>
</html>