ホームページ ウェブフロントエンド jsチュートリアル コレクションを使用した JavaScript 配列

コレクションを使用した JavaScript 配列

Mar 14, 2018 am 10:27 AM
javascript js 集める

今回は、JavaScriptで配列を使用する場合のセットと、JavaScriptの配列セットを使用する場合の注意事項について説明します。実際のケースを見てみましょう。

1.join() 配列内のすべての要素を文字列に変換し、結合します。

var a=[1,2,3,4];
a.join(); //"1,2,3,4"
ログイン後にコピー

2.reverser() 配列内の要素の順序を反転し、逆の順序で配列を返します。

var a[1,2,3,4];
a.reverse(); //[4,3,2,1]
ログイン後にコピー

3.sort() 配列内の要素をソートし、ソートされた配列を返します。

引数なしでsort()を呼び出すと、配列要素はアルファベット順にソートされます。

var a=['ant','Bug','cat','Dog'];
a.sort(); //["Bug", "Dog", "ant", "cat"]
a.sort(function(s,t){
   var s1=s.toLowerCase();
   var t1=t.toLowerCase();   if(s1<t1) return -1;   if(s1>t1) return 1;   return 0});//["ant", "BUg", "cat", "Dog"]
ログイン後にコピー

4.concat() は、concat() の呼び出し元の元の配列の要素と concat() の各パラメーターを要素に含む新しい配列を作成して返します。これらの引数のいずれかがそれ自体配列である場合、配列自体ではなく、配列要素が連結されます。

var a=[1,2,3];a.concat(4,5);// [1, 2, 3, 4, 5]a.concat([4,5]);// [1, 2, 3, 4, 5]a.concat([4,5],[6,7]);// [1, 2, 3, 4, 5, 6, 7]a.concat([4,5],[6,[8,7]]);// [1, 2, 3, 4, 5, 6,[8,7]]
ログイン後にコピー

5.slice() は、指定された配列のスライスまたは部分配列を返します。その 2 つのパラメーターは、フラグメントの開始位置と終了位置をそれぞれ指定します。返される配列には、最初の引数で指定された位置と、2 番目の引数で指定された位置を除くすべての位置との間のすべてのデータ要素が含まれます。

パラメータが 1 つだけ指定されている場合、返される配列には、配列の開始位置から終わりまでのすべての要素が含まれます。
パラメータに負の数値が表示される場合、それは配列内の最後の要素に対する相対的な位置を表します。たとえば、パラメータ -1 は最後の要素を指定し、-3 は最後から 3 番目の要素を指定します。
slice() は呼び出し元の配列を変更しないことに注意してください。

var a=[1,2,3,4,5];a.slice(0,2);//[1, 2]a.slice(3);//[4, 5]a.slice(1,-1);//[2, 3, 4]a.slice(-3,-2);//[3]
ログイン後にコピー

6.splice() 配列内の要素を挿入または削除するための一般的なメソッド。 lice() や concat() とは異なり、splice() は呼び出し元の配列を変更します。注: splice() とスライス() は非常によく似た名前ですが、それらの機能は本質的に異なります。

splice() は、配列から要素を削除したり、要素を配列に挿入したり、両方の操作を同時に実行したりできます。挿入ポイントまたは削除ポイントの後の配列要素のインデックス値は必要に応じて増減されるため、配列の残りの部分は連続したままになります。 splice() の最初のパラメータは、挿入および/または削除の開始位置を指定します。 2 番目のパラメータは、配列から削除する要素の数を指定します。2 番目のパラメータを省略すると、配列の開始点から終了までのすべての要素が削除されます。 splice() は、削除された要素の配列を返します。要素が削除されていない場合は空の配列を返します。

var a=[1,2,3,4,5,6,7,8];a.splice(4);//返回[[5, 6, 7, 8]],a是[1, 2, 3, 4]a.splice(1,2)//返回[2, 3],a是[1, 4, 5, 6, 7, 8]a.splice(1,1);//返回[2],a是 [1, 3, 4, 5, 6, 7, 8]
ログイン後にコピー

7.push() と Pop()

push() は、配列の末尾に 1 つ以上の要素を追加します。
pop() は配列の最後の要素を削除します。

8.unshift()とshift()

unshift()は、配列の先頭に1つ以上の要素を追加します。
shift() は配列の最初の要素を削除します。

9.toString() と toLocaleString()

[1,2,3].toString();//"1,2,3"[1,[2,&#39;c&#39;]].toString();//"1,2,c"
ログイン後にコピー

toLocaleString() は、toString() メソッドのローカライズされたバージョンです。要素の toLocaleString() メソッドを呼び出して、各配列要素を文字列に変換し、ローカライズされた区切り文字を使用してこれらの

文字列を連結して、最終的な文字列を生成します。

10.forEach() は配列を最初から最後まで走査し、各要素に対して指定された関数を呼び出します。

関数は最初の引数として forEach() に渡され、forEach() は 3 つの引数 (配列要素、要素のインデックス、配列自体) を指定して関数を呼び出します。

var data=[1,2,3,4,5];//计算数组元素的和值var sum=0;
data.forEach(function(value){
sum+=value
});  
sum //15//每个数组元素的值加1data.forEach(function(value,index,arr){
arr[index]=value+1;
});
data  //[2, 3, 4, 5, 6]
ログイン後にコピー

11.map() は、呼び出された配列の各要素を指定された関数に渡し、

関数の戻り値を含む配列を返します。 注: mao() に渡される関数には戻り値が必要です。 map() は新しい配列を返しますが、元の配列は変更されません。元の配列がスパース配列の場合、返されるスパース配列は同じ長さで同じ欠落要素を持ちます。

var a=[1,2,3];var b=a.map(function(value){return value*value;
});
b// [1, 4, 9]
ログイン後にコピー

12 filter()は条件を満たす配列要素を返します

var a=[1,2,3,5];var b=a.filter(function(value){return value>2;
});
b  // [3, 5]
ログイン後にコピー

13.every()とsome()

配列の論理判定を行い、判定する配列要素に指定された関数を適用してtrueまたはを返します。間違い。
every() は、配列内のすべての要素がフィルタリング条件を満たし、その後 true を返すことを意味します。
some() は、フィルタリング条件を満たす要素が配列内に存在することを意味し、その後、true を返します。 ()
指定された関数を使用します。配列要素を結合して単一の値を生成します。

reduce() には 2 つのパラメータが必要です。

最初のものは、単純化演算を実行する関数です。 simplify 関数のタスクは、2 つの値を何らかの方法で 1 つの値に結合または簡略化し、簡略化された値を返すことです。 2 番目 (オプション) パラメーターは、関数に渡される初期値です。
reduceRight() は、配列のインデックスに従って配列を上位から下位 (右から左) に処理することを除いて、reduce() と同じ方法で使用されます。

var a =[1,2,3,4,5];
a.every(function(value){return value<10;
})  //true a中所有元素都小于10a.every(function(value){return value%2===0;
});//false a中不是所有元素都是偶数a.some(function(value){return value%2===0;
})//true a中存在偶数
ログイン後にコピー

indexOf() と lastIndexOf()
indexOf()最初の条件を満たす値のインデックスは、そうでない場合は -1 を返します

lastIndexOf()最後の条件を満たす値のインデックスは、そうでない場合は -1 を返します


私は信じていますこの記事の事例を読んだ後は、その方法を習得したことになります。さらに興味深い情報については、php 中国語 Web サイトの他の関連記事に注目してください。

推奨読書:

Require.js の詳細な説明

mysqlへのノード接続の実装方法

JS正規表現の使い方

Javascriptシングルトンモード

以上がコレクションを使用した JavaScript 配列の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

ホットAIツール

Undresser.AI Undress

Undresser.AI Undress

リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover

AI Clothes Remover

写真から衣服を削除するオンライン AI ツール。

Undress AI Tool

Undress AI Tool

脱衣画像を無料で

Clothoff.io

Clothoff.io

AI衣類リムーバー

AI Hentai Generator

AI Hentai Generator

AIヘンタイを無料で生成します。

ホットツール

メモ帳++7.3.1

メモ帳++7.3.1

使いやすく無料のコードエディター

SublimeText3 中国語版

SublimeText3 中国語版

中国語版、とても使いやすい

ゼンドスタジオ 13.0.1

ゼンドスタジオ 13.0.1

強力な PHP 統合開発環境

ドリームウィーバー CS6

ドリームウィーバー CS6

ビジュアル Web 開発ツール

SublimeText3 Mac版

SublimeText3 Mac版

神レベルのコード編集ソフト(SublimeText3)

推奨: 優れた JS オープンソースの顔検出および認識プロジェクト 推奨: 優れた JS オープンソースの顔検出および認識プロジェクト Apr 03, 2024 am 11:55 AM

顔の検出および認識テクノロジーは、すでに比較的成熟しており、広く使用されているテクノロジーです。現在、最も広く使用されているインターネット アプリケーション言語は JS ですが、Web フロントエンドでの顔検出と認識の実装には、バックエンドの顔認識と比較して利点と欠点があります。利点としては、ネットワーク インタラクションの削減とリアルタイム認識により、ユーザーの待ち時間が大幅に短縮され、ユーザー エクスペリエンスが向上することが挙げられます。欠点としては、モデル サイズによって制限されるため、精度も制限されることが挙げられます。 js を使用して Web 上に顔検出を実装するにはどうすればよいですか? Web 上で顔認識を実装するには、JavaScript、HTML、CSS、WebRTC など、関連するプログラミング言語とテクノロジに精通している必要があります。同時に、関連するコンピューター ビジョンと人工知能テクノロジーを習得する必要もあります。 Web 側の設計により、次の点に注意してください。

Go 言語でコレクションのような関数を実装するのはなぜ難しいのでしょうか? Go 言語でコレクションのような関数を実装するのはなぜ難しいのでしょうか? Mar 24, 2024 am 11:57 AM

Go 言語ではコレクションのような関数を実装するのが難しく、多くの開発者を悩ませている問題です。 Python や Java などの他のプログラミング言語と比較して、Go 言語には set や map などの組み込みのコレクション型が存在しないため、コレクション関数を実装する際に開発者にいくつかの課題が生じます。まず、コレクションのような機能を Go 言語で直接実装することがなぜ難しいのかを見てみましょう。 Go 言語で最も一般的に使用されるデータ構造はスライスとマップであり、コレクションのような関数を完成させることができますが、

PHP および JS 開発のヒント: 株価ローソク足チャートの描画方法をマスターする PHP および JS 開発のヒント: 株価ローソク足チャートの描画方法をマスターする Dec 18, 2023 pm 03:39 PM

インターネット金融の急速な発展に伴い、株式投資を選択する人がますます増えています。株式取引では、ローソク足チャートは一般的に使用されるテクニカル分析手法であり、株価の変化傾向を示し、投資家がより正確な意思決定を行うのに役立ちます。この記事では、PHP と JS の開発スキルを紹介し、株価ローソク足チャートの描画方法を読者に理解してもらい、具体的なコード例を示します。 1. 株のローソク足チャートを理解する 株のローソク足チャートの描き方を紹介する前に、まずローソク足チャートとは何かを理解する必要があります。ローソク足チャートは日本人が開発した

簡単な JavaScript チュートリアル: HTTP ステータス コードを取得する方法 簡単な JavaScript チュートリアル: HTTP ステータス コードを取得する方法 Jan 05, 2024 pm 06:08 PM

JavaScript チュートリアル: HTTP ステータス コードを取得する方法、特定のコード例が必要です 序文: Web 開発では、サーバーとのデータ対話が頻繁に発生します。サーバーと通信するとき、多くの場合、返された HTTP ステータス コードを取得して操作が成功したかどうかを判断し、さまざまなステータス コードに基づいて対応する処理を実行する必要があります。この記事では、JavaScript を使用して HTTP ステータス コードを取得する方法を説明し、いくつかの実用的なコード例を示します。 XMLHttpRequestの使用

jsとvueの関係 jsとvueの関係 Mar 11, 2024 pm 05:21 PM

js と vue の関係: 1. Web 開発の基礎としての JS、2. フロントエンド フレームワークとしての Vue.js の台頭、3. JS と Vue の補完関係、4. JS と Vue の実用化ビュー。

Laravel コレクションの Where メソッドの実践ガイド Laravel コレクションの Where メソッドの実践ガイド Mar 10, 2024 pm 04:36 PM

Laravel コレクションの Where メソッドに関する実践ガイド Laravel フレームワークの開発中、コレクションは、データを操作するための豊富なメソッドを提供する非常に便利なデータ構造です。中でも、Where メソッドは、指定した条件に基づいてコレクション内の要素をフィルタリングできる、一般的に使用されるフィルタリング メソッドです。この記事では、Laravel コレクションでの Where メソッドの使用法を紹介し、特定のコード例を通じてその使用法を示します。 1. Whereメソッドの基本的な使い方

JavaScript で HTTP ステータス コードを簡単に取得する方法 JavaScript で HTTP ステータス コードを簡単に取得する方法 Jan 05, 2024 pm 01:37 PM

JavaScript で HTTP ステータス コードを取得する方法の紹介: フロントエンド開発では、バックエンド インターフェイスとの対話を処理する必要があることが多く、HTTP ステータス コードはその非常に重要な部分です。 HTTP ステータス コードを理解して取得すると、インターフェイスから返されたデータをより適切に処理できるようになります。この記事では、JavaScript を使用して HTTP ステータス コードを取得する方法と、具体的なコード例を紹介します。 1. HTTP ステータス コードとは何ですか? HTTP ステータス コードとは、ブラウザがサーバーへのリクエストを開始したときに、サービスが

Java Iterator と Iterable: エレガントなコードを書くためのステップ Java Iterator と Iterable: エレガントなコードを書くためのステップ Feb 19, 2024 pm 02:54 PM

Iterator インターフェイス Iterator インターフェイスは、コレクションを走査するために使用されるインターフェイスです。 hasNext()、next()、remove() などのいくつかのメソッドが提供されます。 hasNext() メソッドは、コレクション内に次の要素があるかどうかを示すブール値を返します。 next() メソッドは、コレクション内の次の要素を返し、それをコレクションから削除します。 Remove() メソッドは、コレクションから現在の要素を削除します。次のコード例は、Iterator インターフェイスを使用してコレクションを反復処理する方法を示しています。 Listnames=Arrays.asList("John","Mary","Bob");Iterator

See all articles