JavaScript の toLocaleString() での時間フォーマットに関する新しいアイデア

JavaScript の toLocaleString() での時間フォーマットに関する新しいアイデア

Objectオブジェクトを勉強しているときに、時間のフォーマットを簡単に実装できるtoLocaleString()メソッドを見つけました。

1. 時刻表示に関する従来の考え方

通常のアイデアは、簡単な書式設定の例のように、Date インスタンスを通じて年、月、日などを順番に取得することです。

Date.prototype.format = function(dateStr) {
    date = new Date();
    年 = date.getFullYear();
    月 = date.getMonth() + 1 とします。
    day = date.getDate().toString().padStart(2, "0"); とします。
    時間 = date.getHours();
    分を date.getMinutes() とします。
    秒を date.getSeconds() とします。
    dateStr = dateStr.replace("年", year)
        .replace("月", 月)
        .replace("日", day)
        .replace("時間", 時間)
        .replace("分", 分)
        .replace("秒", second);
    dateStr を返します。
};
 
// 上記の方法を使用する console.log(new Date().format("year-month-day")); // 2021-11-04

2. 時刻の書式設定 toLocaleString()

toLocaleString() 、オブジェクトの文字列を返すという点でtoString()に似ていますが、ローカライズされた実行環境に従って処理されます。特に、時間オブジェクトをサポートしており、特定の形式に変換できます。

// 日付、現在の時刻を出力 let date = new Date();
// これはグリニッジ標準時の形式です console.log(date.toString()); // 2021 年 11 月 4 日木曜日 10:11:35 GMT+0800 (中国標準時)
// これはローカルタイム形式です console.log(date.toLocaleString()); // 2021/11/4 10:18:08 AM


新しいブラウザ バージョンでは、ロケールとオプション パラメータがサポートされます。

date = new Date();
// 24時間制 let options = {
    年: '数値'、月: '数値'、日: '数値'、
    時間: '数値'、分: '数値'、秒: '数値'、
    時間12: 偽
};
console.log(date.toLocaleString("zh-CN", オプション)); // 2021/11/4 10:33:01


曜日を取得します:

date = new Date();
オプション = {
    平日:「長い」
};
console.log(date.toLocaleString("zh-CN", options)); // 木曜日

その他のoptionsパラメータについては、記事の最後に記載されているリンクを参照してください。

欠陥:

x 年 x 月 x 日の形式で表示したい場合、現時点では適切な記述方法はありません。比較的、toLocaleString() 関数の方が制限が厳しいと言えます。

これで、 JavaScript toLocaleString() JavaScript toLocaleString()に関するより関連性の高いコンテンツについては、123WORDPRESS.COM の過去の記事を検索するか、以下の関連記事を引き続き参照してください。今後とも 123WORDPRESS.COM をよろしくお願いいたします。

以下もご興味があるかもしれません:
  • JavaScript の isPrototypeOf 関数
  • JavaScriptプロトタイプチェーンの詳細な説明
  • JavaScript の構成と継承の説明
  • jsイベント委譲の詳細な説明
  • nuxt.js 複数の環境変数の設定
  • JS における for、for...in、for...of、forEach の違いと使用例
  • Javascriptはセキュリティ検証に整合性属性を使用します

<<:  HTML の空リンク href="#" と href="javascript:void(0)" の違い

>>:  CSSを使用してAndroidシステムの読み込みアニメーションを実装する

推薦する

Alibaba Cloudのセキュリティルール設定の詳細な説明

2日前、ダブル11ショッピングフェスティバルを利用して、Alibaba CloudでECS(サーバー...

VMware esxi6.5 のインストールと使用の詳細な手順

目次導入建築ESXIの利点vSphere とは何ですか? 2. 仮想マシンの利点3. 仮想マシンを使...

JavaScript の navigator.userAgent がブラウザ情報を取得するケースの説明

ブラウザはおそらく私たちにとって最も馴染みのあるツールです。 Firefox、Opera、Safar...

Vue3 ページ、メニュー、ルートの使用

目次1. メニューをクリックしてジャンプ1. ページ名の統一2. 管理ページを追加3. ルートを追加...

Eclipse は Tomcat を構成しますが、Tomcat には無効なポート解決策があります

目次1. EclipseがTomcatを構成する2. Tomcat の無効なポートの解決方法方法1:...

Idea で Docker を使用して SpringBoot プロジェクトをデプロイする詳細な手順

序文プロジェクト要件: Dockeridea に Docker プラグインをインストールし、Dock...

ウェブページの広告デザインにおけるウェブデザインの寸法とルール

1. 800*600 未満の場合、Web ページの幅が 778 以内であれば、水平スクロール バーは...

Vueはシンプルな計算機能を実装します

この記事では、参考までに、簡単な計算機機能を実現するためのVueの具体的なコードを紹介します。具体的...

MySQL パラメータ関連の概念とクエリ変更方法

序文:以前の記事では、特定のパラメータの機能についてよく紹介してきました。しかし、MySQL パラメ...

DockerでGDBを使用するときにブレークポイントを入力できない問題を解決する

質問docker で gdb を実行すると、ブレークポイントに到達しますが、ブレークポイントに入るこ...

1つの記事でTypeScriptのデータ型について学ぶ

目次基本タイプあらゆるタイプ配列タプルインタフェース関数自己推論を入力する結合タイプ(1つ以上選択)...

Win10 への MySQL 5.7 のインストール MSI 版のチュートリアル(画像とテキスト付き)

主にインストール後に my.ini ファイルを確認するために、msi 形式でインストールしました。フ...

Tomcat で server.xml と content.xml を変更した後の自動復元の問題の解決方法

設定ファイルを server.xml と content.xml に書き込みます。サーバーを再起動す...

SQL Server 2019 Always On クラスターの Docker デプロイメントの実装

目次Docker デプロイメント Always on クラスターDockerをインストールする建築関...