JavaScript 組み込みオブジェクトの概要

JavaScript 組み込みオブジェクトの概要

1. 組み込みオブジェクト

組み込みオブジェクトとは、JS 言語に付属するいくつかのオブジェクトを指します。これらのオブジェクトは開発者が使用するためのもので、一般的に使用される、または最も基本的で必要な機能 (プロパティとメソッド) を提供します。組み込みオブジェクトの最大の利点は、迅速な開発に役立つことです。 JavaScriptには、 MathDateArrayStringなど、複数の組み込みオブジェクトが用意されています。

2. 数学オブジェクト

Mathオブジェクトはコンストラクターではなく、数学定数と関数のプロパティとメソッドを持ちます。数学演算 (絶対値、整数の丸め、最大値など) では、Math のメンバーを使用できます。

1. Mathオブジェクトの使用

       Math.abs(x): xの絶対値を返します。Math.pow(x,y): xのy乗を返します。Math.sqrt(x): xの平方根を返します。Math.random(): 疑似乱数(0.0~1.0)を返します。
    
    Math.round(x): x を四捨五入した後の最も近い整数を返します。Math.floor(x): x 以下の最大の整数を返します。 (切り捨て)
    
    Math.ceil(x): この関数は、x 以上の最小の整数を返します (切り上げ)
    
    Math.max(): パラメータの最大値を返します。Math.min(): パラメータの最小値を返します。

注:上記のメソッドは括弧で囲む必要があります

以下のように表示されます。

console.log('Math.abs(-2)='+Math.abs(-2));
        console.log('Math.ceil(1.7)='+Math.ceil(1.7));
        console.log('Math.floor(1.7)='+Math.floor(1.7));
        console.log('Math.pow(2,3)='+Math.pow(2,3));
        console.log('Math.sqrt(3)='+Math.sqrt(3));
        console.log('Math.round(3.4)='+Math.round(3.4));
        console.log('Math.round(3.6)='+Math.round(3.6));
        console.log('Math.max(1,2)='+Math.max(1,2));
        console.log('Math.min(1,2)='+Math.min(1,2));

印刷結果は次のとおりです。

2. 指定された範囲内で乱数を生成する

1 から 10 までの乱数を生成する関数をカプセル化します。

コードは次のとおりです。

関数ランダム(最小値,最大値){
    Math.floor(Math.random()*(max-min+1))+min を返します。
}
(var i =1;i<=10;i++){
    console.log('+i+'番目の出力の結果は: '+random(1,10));
}

ランダムプリントアウトの結果は次のとおりです。

このうち、 minmax生成される乱数の範囲です。

3. 日付オブジェクト

  • DateオブジェクトはMathオブジェクトとは異なります。これはコンストラクターなので、使用する前にインスタンス化する必要があります。
  • Dateインスタンスは日付と時刻を処理するために使用されます

1. Date() メソッドの使用

現在の時刻を取得するには、以下をインスタンス化する必要があります。

var now = 新しい Date();
console.log(現在);

Date() コンストラクターのパラメーター:

  • 括弧内に時間がある場合は、パラメータ内の時間が返されます。たとえば、日付のフォーマット文字列が「2019-5-1」の場合、new Date('2019-5-1')またはnew Date('2019/5/1')と記述できます。
  • Date()がパラメータを書き込まない場合は、現在の時刻を返します。
  • Date() にパラメータを記述すると、括弧内に入力された時刻が返されます。

例えば:

       var date1 = 新しい日付()
        コンソールログ('date1='+date1);
        var date2 = 新しい日付(2021,11,08,20,51);
        コンソールログ('date2='+date2);
        date3 = 新しい日付('2021-11-08 20:54')
        コンソールログ('date3='+date3);

出力は次のようになります。

2. 日付オブジェクトの使用

get メソッドの使用:

例えば:

 var date1 = 新しい日付()
        コンソールログ('date1='+date1);
        console.log('今年は:' + date1.getFullYear() + 'year');
        console.log('今月は:' + date1.getMonth() + '月');
        console.log('今日は:' + date1.getDate() + 'number');
        console.log('現在は: '+date1.getHours()+'');
        console.log('現在は:' + date1.getMinutes() + '分');

結果は次のとおりです。

set メソッドの使用:

例えば:

 var date1 = 新しい日付()
        コンソールログ(日付1);
        date1.setFullYear(2020)
        コンソールログ(日付1);

印刷された結果は次のとおりです。

3. タイムスタンプを取得する

日付オブジェクトの valueof() または getTime() メソッドを通じて:

var date1 = 新しい Date();
コンソールにログ出力します。 
コンソールにログ出力します。 

数値型に変換するには、「+」演算子を使用します。

var date2 = +新しい日付();
コンソールログ(日付2); 

HTML5 の新しい Date.now() メソッドを使用します

コンソールにログ出力します。

4. 配列オブジェクト

1. 配列オブジェクトの作成

配列オブジェクトを作成するには 2 つの方法があります。

  • リテラルメソッド
  • 新しい配列()

2. 配列かどうか確認する

instanceof演算子は、オブジェクトが特定の型であるかどうかを判断できます。
Array.isArray()オブジェクトが配列であるかどうかを判断するために使用されます。isArray isArray()HTML5で提供されているメソッドです。

以下のように表示されます。

 var arr = [1,2,3,4];
        var obj = {};
        console.log(arr 配列のインスタンス);
        console.log(obj インスタンスの配列);
        console.log(Array.isArray(arr));
        console.log(Array.isArray(obj));

3. 配列要素の追加と削除の方法

注: push()unshift()メソッドの戻り値は新しい配列の長さですが、pop() メソッドと shift() メソッドは移動された配列要素を返します。

例えば:
配列 [1500, 1200, 2000, 2100, 1800] があります。配列内の 2000 を超える項目を削除し、残りの項目を新しい配列に配置する必要があります。コードは次のとおりです。

var arr = [1500、1200、2000、2100、1800];
        var newArr = [];
        for(var i=0;i<arr.length;i++){
            もしarr[i]<2000であれば
                新しいArr.push(arr[i]);
            }
        }
        コンソールにログ出力します。

印刷された結果は次のとおりです。

4. 配列のソート

方法機能説明
逆行する()配列内の要素の位置を反転します。このメソッドは元の配列を変更し、新しい配列を返します。
選別()配列の要素をソートします。このメソッドは元の配列を変更し、新しい配列を返します。

例えば:

配列を反転します。

var arr = [1500、1200、2000、2100、1800];
        コンソールにログ出力します。
        コンソールにログ出力します。

配列をソートする:

var arr = [1500、1200、2000、2100、1800];
        コンソールにログ出力します。
        var newArr = arr.sort(関数(a,b){
            return ab; // 昇順 return ba; // 降順 })
        コンソールにログ出力します。

印刷された結果は次のとおりです。

5. 配列のインデックス方法

メソッド名例示する戻り値
インデックス()配列内の指定された要素の最初のインデックスを見つける存在する場合はインデックス番号を返し、存在しない場合は-1を返します。
最後のインデックス()配列の最後のインデックス存在する場合はインデックス番号を返し、存在しない場合は-1を返します。

例えば:

var arr = [1500, 1200, 2000,1500, 2100, 1500,1800];
        console.log('arr.indexOf(1500):' + arr.indexOf(1500));
        コンソールログ('arr.lastIndexOf(1500):'+arr.lastIndexOf(1500));

印刷された結果は次のとおりです。

アレイ重複排除の例:

配列 ['c', 'a', 'z', 'a', 'x', 'a', 'x', 'c', 'b'] が与えられた場合、配列から重複する要素を削除する必要があります。
ケーススタディ:
目標:古い配列内の重複していない要素を選択して新しい配列に配置し、重複する要素を 1 つだけ保持して新しい配列に配置し、重複を削除します。
コア アルゴリズム:古い配列を走査し、古い配列の要素を使用して新しい配列を照会します。要素が新しい配列に表示されない場合は追加し、表示される場合は追加しません。

コードは次のとおりです。

 var arr = ['c', 'a', 'z', 'a','x', 'a', 'x', 'c', 'b'];
        var newArr = [];
        for(var i =0;i<arr.length;i++){
            (newArr.indexOf(arr[i]) === -1 の場合)
            {
                新しいArr.push(arr[i]);
            }    
        }
        コンソールにログ出力します。

印刷された結果は次のとおりです。

6. 配列から文字列への変換

メソッド名例示する戻り値
文字列を変換する()配列を文字列に変換し、各項目をカンマで区切ります。文字列を返します
join('区切り文字')メソッドは、配列内のすべての要素を文字列に変換するために使用されます。文字列を返します

例えば:

var arr = ['a', 'b', 'c'];
コンソールにログ出力します。
console.log(arr.toString()); // 出力: a,b,c
// join() を使用する
console.log(arr.join()); // 出力: a,b,c
console.log(arr.join('')); // 出力: abc
console.log(arr.join('-')); // 出力: abc

5. 文字列オブジェクト

1. 文字に応じて位置を返す

メソッド名例示する
インデックス()元の文字列内の指定されたコンテンツの位置を返します。見つからない場合は -1 を返します。開始位置はインデックス番号です。
最後のインデックス()後ろから前へ検索し、最初に一致するものだけを見つける

たとえば、文字列セット内の指定されたすべての要素の位置と出現回数を見つける必要があります。文字列は「Hello World, Hello JavaScript」です。

コードは次のとおりです。

var str = 'Hello World、Hello JavaScript';
コンソールログ(str);
var index = str.indexOf('o');
var 数値 = 0;
while (インデックス != -1) {
  console.log(index); // 順番に出力: 4、7、17
  インデックス = str.indexOf('o', インデックス + 1);
  数値++;
}
console.log('o の出現回数: ' + num); // o の出現回数: 3

印刷された結果は次のとおりです。

2. 位置によって文字を返す

例えば:

var str = 'Apple';
console.log(str.charAt(3)); // 出力: 1
console.log(str.charCodeAt(0)); // 出力: 65 (文字 A の ASCII コードは 65 です)
console.log(str[0]); // 出力: A

例えば、 charAt()メソッドを使用して、プログラムを通じて文字列内の最も一般的な文字と回数をカウントします。

var str = 'Apple';
// ステップ 1、各文字の出現回数をカウントします var o = {};
(var i = 0; i < str.length; i++) の場合 {
  var chars = str.charAt(i); // chars を使用して文字列内の各文字を保存します if (o[chars]) { // オブジェクトのプロパティを使用して要素の検索を容易にします o[chars]++;
  } そうでない場合 { o[chars] = 1; }
}
コンソールにログ出力します。 

印刷結果は次のとおりです。

3. 文字列操作メソッド

var str = 'HelloWorld';
str.concat('!'); // 文字列の末尾の文字を連結します。結果: HelloWorld!
str.slice(1, 3); // 位置1から位置3までのコンテンツを抽出します。結果: el
str.substring(5); // 位置5から末尾までの内容を抽出します。結果: World
str.substring(5, 7); // 位置5から位置7までのコンテンツをインターセプトします。結果: Wo
str.substr(5); // 位置5から文字列の末尾までの内容をインターセプトします。結果: World
str.toLowerCase(); // 文字列を小文字に変換します。結果: helloworld
str.toUpperCase(); // 文字列を大文字に変換します。結果: HELLOWORLD
str.split('l'); // "l" を使用して文字列を分割します。結果: ["He", "", "oWor", "d"]
str.replace('World', '!'); // 文字列を置換、結果: "Hello!"

4. split() メソッド

split()メソッドは文字列を分割するために使用されます。文字列を配列に分割できます。セグメンテーションが完了すると、新しい配列が返されます。
例えば:

var str = 'a,b,c,d';
コンソールログ(str);
console.log(str.split(',')); // 配列 [a, b, c, d] を返します

JavaScript組み込みオブジェクトに関するこの記事はこれで終わりです。JavaScript 組み込みオブジェクトに関するより詳しい情報は、123WORDPRESS.COM の過去の記事を検索するか、以下の関連記事を引き続きご覧ください。今後とも 123WORDPRESS.COM をよろしくお願いいたします。

以下もご興味があるかもしれません:
  • 組み込みオブジェクトに関するJavascriptの基礎
  • JavaScriptは組み込みオブジェクトのプロトタイプメソッド実装を追加します
  • JavaScript における一般的な組み込みオブジェクトの使用法の分析
  • JavaScript 組み込みオブジェクトの計算、グローバル関数、使用例の分析
  • JavaScriptの組み込みオブジェクトの詳細な説明
  • js でよく使われる組み込みメソッドとオブジェクトについての簡単な説明
  • JavaScriptの単一組み込みオブジェクトに関する詳細な理解
  • JavaScript組み込みオブジェクト操作の詳細な説明
  • JSP 組み込みオブジェクトとメソッドの詳細な紹介
  • JavaScript 組み込みオブジェクトのプロパティとメソッドのコレクション
  • 組み込みオブジェクトの使用方法 JavaScript オブジェクトの Math
  • JavaScript の組み込みオブジェクトの概要

<<:  優れたウェブワイヤーフレーム設計・制作ツール13選を紹介

>>:  CSS3で線形グラデーションを実装するためのコードの詳細な説明

推薦する

MySQLバックアップとリカバリの実践に関する詳細な説明

1. mysqlbackup の紹介mysqlbackup は、MySQL Enterprise B...

Dockerデータストレージの概要

この記事を読む前に、ボリューム、バインドマウント、tmpfs マウントの基本を理解しておいてください...

Linuxにおけるselinuxの基本設定チュートリアルの詳細な説明

selinux ( Security-Enhanced Linux)は、Linux カーネル モジュ...

CentOS7 は Docker のバージョン 19 をデプロイします (簡単なので、従ってください)

1. 依存パッケージをインストールする [root@localhost ~]# yum insta...

MySQL 上級学習ノート (パート 3): MySQL 論理アーキテクチャの紹介、MySQL ストレージ エンジンの詳細な説明

MySQL 論理アーキテクチャの概要他のデータベースと比較すると、MySQL は、そのアーキテクチャ...

CentOS 7 構成 Tomcat9+MySQL ソリューション

Tomcatの設定まずTomcatをインストールするTomcatのインストールは、Tomcatのイン...

Linux または Windows 環境での pytorch のインストールと検証 (runtimeerror 問題の解決)

1. pytorch公式サイトから対応するインストールファイルをダウンロードします。 https:...

すべてのホストがmysqlにアクセスできるようにする方法

1. MySQLデータベースのユーザーテーブルのレコードのHostフィールド値を%に変更します。奇妙...

MySQL のデータベース パフォーマンスに影響を与える要因の説明

データベースのパフォーマンスに関する話面接では、「データベースにどのくらい精通していますか?」など、...

HTML Webページ作成チュートリアル iframeタグを慎重に使用してください

iframe を使用すると、他の Web サイトのページを簡単に呼び出すことができますが、注意して使...

WeChat アプレット wxss で外部 CSS ファイルとアイコンフォントを参照する方法

原因外部ファイルをミニプログラムにインポートする方法は次のとおりです: @import "...

検索テキストボックスがフォーカスを外れたときにテキストの位置がジャンプする問題の解決方法

検索テキストボックスにテキストを設定すると、フォーカスを外すと位置がジャンプしますコードをコピーコー...

MySQL エラー: ロックを取得しようとしたときにデッドロックが見つかりました。トランザクションの解決策を再起動してください

問題を見つける最近、以前のデータを入力していたときに、プログラムが突然次のエラーを報告しました。 [...

int(3)とint(10)の値の範囲はmysqlで同じですか?

目次質問:答え:現実:知識ポイント結論は:要約する質問: MySQLフィールド、unsigned i...

Vue 仮想リストの実例

目次序文デザイン成し遂げるまとめ序文最近は、いつも延々とスワイプしています。 Weibo をチェック...