検索
ホームページウェブフロントエンドjsチュートリアルJavaScript 配列の一般的な API メソッドとトラバーサル メソッドの概要 (例付き)

この記事では、JavaScript 配列の一般的な API メソッドとトラバーサル メソッドの概要を (例とともに) 紹介します。これには一定の参考価値があります。必要な友人は参照できます。お役に立てば幸いです。

Array(配列)

ES5 *

map

構文: [].map(function(item,index,array) {return xxx} )
関数: 配列を走査し、コールバック戻り値で構成される新しい配列を返します。元の配列は変更されず、空の配列は検出されません。

forEach

構文: [].forEach( function(item, Index, array) {})
関数: ブレークできません。元の配列を変更せずに停止するには、try/catch で throw new Error を使用できます

filter

構文: [].filter(function(item,index,array) {})
関数:filter、フィルターされた配列を返します。元の配列は変更せず、空の配列は検出しません配列

例:

const data = [-8, 9, 5, 3];
const res = data.filter(function(item) {
    if (item > 3) {
      return item
    }
});
console.log(res); // [9, 5]

some

文法: [].some(function(item,index,array) {})
関数: 1 つの項目が true を返した場合、全体が true になります。元の配列は変更されません

every

構文: [].every(function( item、index、array) {})
関数: true を返すには、すべての条件が満たされる必要があります。1 つの項目が false を返した場合、全体が false になります。元の配列は変更されません

join

構文: [].join(str)
関数: コネクタ str を指定して、文字列に連結された配列を返します。元の配列を変更します

push / Pop

構文:

[].push(item) / [].pop(item)関数:配列の末尾でpushプッシュとpopポップを実行し、変更された配列の長さ/ポップアップ項目を返します。
元の配列を変更します

unshift/shift

構文:

[].unshift(item) / [].shift(item) 機能: unshift をプッシュして配列の先頭にポップアップ shift し、変更された配列の長さを返します/ポップアウト項目、
元の配列を変更します

sort(fn) / reverse

構文 :

[].sort(fn) [].reverse( )関数: ルールに従って並べ替えおよび反転、
元の配列を変更

splice

構文:

[].splice(start 、number、value1、value2...)関数:
start から始まる、削除された要素で構成される配列を返します。 number の値を削除し、## を挿入します。 #valueN パラメータ リストを配列に追加します。元の配列を変更しますconcat

構文:

[].concat([])

関数: n (n >= 2) 個の配列を接続し、配列接続後に配列のコピーを返します。浅いコピーです。元の配列は変更しません
slice

構文:

[].slice(start, end)

関数: 切り詰められた新しい配列を返します。元の配列は変更しません
#indexOf / lastIndexOf(value, fromIndex)

構文:

[].indexOf(value[, fromIndex])

関数: 配列項目の検索 indexOf starting
fromIndex
(デフォルトは 0) から後方検索
valuelastIndexOf は fromIndex から開始 (デフォルトは -1) 前方検索
value値に対応する添字を返しますreduce /reduceRight

構文:

reduce /reduceRight(callback[,initialValue])

関数: で実行します。ペア、prev は最後の簡略化された関数の戻り値、cur は現在の値 (2 番目の項目から開始) コールバック関数のパラメーター: 以前の値 (previousValue)、現在の値 ( currentValue)、インデックス値 ( currentIndex) と配列自体 (array)initialValue オプションの初期値 (コールバック関数が最初に呼び出されたときにpreviousValue に渡される値として)。つまり、累算などの操作の開始値 (追加ボーナス) を渡します。

reduceRight は配列の末尾から開始します。

isArray *

構文:

Array.isArray(value)

関数: パラメータ値が Array かどうかを判断するために使用されますES6

find *

ind(fn)`

関数: 条件を満たす最初の配列要素を返します

item


findIndex *

構文:

[].findIndex(fn)

関数: 条件を満たす最初の配列要素の インデックスを返します
from *

構文:

[].fill(value[, start, end])

関数: 配列のようなオブジェクトとトラバース可能な (反復可能) オブジェクトを実際の配列に変換します
一般的に使用される: <pre class="brush:php;toolbar:false">const set = new Set(3, 8, 9, 0) Array.from(set)</pre>entries *

構文:

[].entries()

関数: 反復子を返す: キーと値のペアを返す[注意]
Object.entries(obj)

このメソッドは、指定されたオブジェクト自身の列挙可能なプロパティのキーと値のペアの配列を返します。この配列は、for...in ループを使用してオブジェクトを走査するときに返される順序と同じ順序で配置されます (違いは、for-in ループであることです)また、プロトタイプ チェーンの属性も列挙します) [MDN]

および [].entries() は、

//数组
const arr = ['a', 'b', 'c'];
for(let v of arr.entries()) {
    console.log(v)
}
// [0, 'a'] [1, 'b'] [2, 'c']

//Set
const arr1 = new Set(['a', 'b', 'c']);
for(let v of arr1.entries()) {
    console.log(v)
}
// ['a', 'a'] ['b', 'b'] ['c', 'c']

//Map
const arr2 = new Map();
arr2.set('a', 'a');
arr2.set('b', 'b');
for(let v of arr2.entries()) {
    console.log(v)
}
// ['a', 'a'] ['b', 'b']
## と同様の Array.prototype keys/values のメソッドです#keys *
構文: [].keys()

#関数: 戻り反復子: 戻りキー key (つまり、上記の各配列の最初の値)

# #values

構文: [].values()

関数: 戻り反復子: 戻り値 value (つまり、上記の各配列の 2 番目の値)

includes *

语法:[].includes(val[, fromIndex])
功能:用于从fromIndex判断数组中是否包含val,可替代ES5中的 indexOf

copyWithin

语法:[].copyWithin(target[, start[, end]])
功能:浅复制数组的一部分(start~end)到同一数组中的另目标位置target,返回改变后的数组,而不修改其大小;start默认为0, end默认为length-1; 改变原数组

of

语法:Array.of()
功能:创建一个具有可变数量参数的新数组实例,而不考虑参数的数量或类型

Array构造函数 & Array.of() 区别
实例说明

Array.of(7);       // [7] 
Array.of(1, 2, 3); // [1, 2, 3]

Array(7);          // [ , , , , , , ]
Array(1, 2, 3);    // [1, 2, 3]

fill

语法:[].fill(value[, start, end])
功能:用指定的元素填充数组,可用于初始化数组,返回改变后的数组,改变原数组
填充值(value),填充起始位置(start,默认为0),填充结束位置(end,默认为数组length)。

遍历

数组

map/forEach/some/every/filter 见上

for

for...in

遍历所有可枚举属性,常用于遍历对象Object

for...of

遍历所有可迭代iterable的对象

对象【属性】

for...in

循环遍历对象自身的和继承的可枚举属性(不含Symbol属性)【可枚举 - Symbol】

Object.keys(obj)

返回一个数组,包括对象自身的(不含继承的)所有可枚举属性(不含Symbol属性)【自身可枚举 - Symbol】

Object.getOwnPropertyNames(obj)

返回一个数组,包含对象自身的所有属性(不含Symbol属性,但是包括不可枚举属性)【自身 - Symbol】

Object.getOwnPropertySymbols(obj)

返回一个数组,包含对象自身的所有Symbol属性【自身的Symbol】

Reflect.ownKeys(obj)

返回一个数组,包含对象自身的所有属性,不管是属性名是Symbol或字符串,也不管是否可枚举  【自身所有】

【相关推荐:JavaScript视频教程

以上がJavaScript 配列の一般的な API メソッドとトラバーサル メソッドの概要 (例付き)の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明
この記事はsegmentfaultで複製されています。侵害がある場合は、admin@php.cn までご連絡ください。
JavaScriptエンジンの理解:実装の詳細JavaScriptエンジンの理解:実装の詳細Apr 17, 2025 am 12:05 AM

JavaScriptエンジンが内部的にどのように機能するかを理解することは、開発者にとってより効率的なコードの作成とパフォーマンスのボトルネックと最適化戦略の理解に役立つためです。 1)エンジンのワークフローには、3つの段階が含まれます。解析、コンパイル、実行。 2)実行プロセス中、エンジンはインラインキャッシュや非表示クラスなどの動的最適化を実行します。 3)ベストプラクティスには、グローバル変数の避け、ループの最適化、constとletsの使用、閉鎖の過度の使用の回避が含まれます。

Python vs. JavaScript:学習曲線と使いやすさPython vs. JavaScript:学習曲線と使いやすさApr 16, 2025 am 12:12 AM

Pythonは、スムーズな学習曲線と簡潔な構文を備えた初心者により適しています。 JavaScriptは、急な学習曲線と柔軟な構文を備えたフロントエンド開発に適しています。 1。Python構文は直感的で、データサイエンスやバックエンド開発に適しています。 2。JavaScriptは柔軟で、フロントエンドおよびサーバー側のプログラミングで広く使用されています。

Python vs. JavaScript:コミュニティ、ライブラリ、リソースPython vs. JavaScript:コミュニティ、ライブラリ、リソースApr 15, 2025 am 12:16 AM

PythonとJavaScriptには、コミュニティ、ライブラリ、リソースの観点から、独自の利点と短所があります。 1)Pythonコミュニティはフレンドリーで初心者に適していますが、フロントエンドの開発リソースはJavaScriptほど豊富ではありません。 2)Pythonはデータサイエンスおよび機械学習ライブラリで強力ですが、JavaScriptはフロントエンド開発ライブラリとフレームワークで優れています。 3)どちらも豊富な学習リソースを持っていますが、Pythonは公式文書から始めるのに適していますが、JavaScriptはMDNWebDocsにより優れています。選択は、プロジェクトのニーズと個人的な関心に基づいている必要があります。

C/CからJavaScriptへ:すべてがどのように機能するかC/CからJavaScriptへ:すべてがどのように機能するかApr 14, 2025 am 12:05 AM

C/CからJavaScriptへのシフトには、動的なタイピング、ゴミ収集、非同期プログラミングへの適応が必要です。 1)C/Cは、手動メモリ管理を必要とする静的に型付けられた言語であり、JavaScriptは動的に型付けされ、ごみ収集が自動的に処理されます。 2)C/Cはマシンコードにコンパイルする必要がありますが、JavaScriptは解釈言語です。 3)JavaScriptは、閉鎖、プロトタイプチェーン、約束などの概念を導入します。これにより、柔軟性と非同期プログラミング機能が向上します。

JavaScriptエンジン:実装の比較JavaScriptエンジン:実装の比較Apr 13, 2025 am 12:05 AM

さまざまなJavaScriptエンジンは、各エンジンの実装原則と最適化戦略が異なるため、JavaScriptコードを解析および実行するときに異なる効果をもたらします。 1。語彙分析:ソースコードを語彙ユニットに変換します。 2。文法分析:抽象的な構文ツリーを生成します。 3。最適化とコンパイル:JITコンパイラを介してマシンコードを生成します。 4。実行:マシンコードを実行します。 V8エンジンはインスタントコンピレーションと非表示クラスを通じて最適化され、Spidermonkeyはタイプ推論システムを使用して、同じコードで異なるパフォーマンスパフォーマンスをもたらします。

ブラウザを超えて:現実世界のJavaScriptブラウザを超えて:現実世界のJavaScriptApr 12, 2025 am 12:06 AM

現実世界におけるJavaScriptのアプリケーションには、サーバー側のプログラミング、モバイルアプリケーション開発、モノのインターネット制御が含まれます。 2。モバイルアプリケーションの開発は、ReactNativeを通じて実行され、クロスプラットフォームの展開をサポートします。 3.ハードウェアの相互作用に適したJohnny-Fiveライブラリを介したIoTデバイス制御に使用されます。

next.jsを使用してマルチテナントSaaSアプリケーションを構築する(バックエンド統合)next.jsを使用してマルチテナントSaaSアプリケーションを構築する(バックエンド統合)Apr 11, 2025 am 08:23 AM

私はあなたの日常的な技術ツールを使用して機能的なマルチテナントSaaSアプリケーション(EDTECHアプリ)を作成しましたが、あなたは同じことをすることができます。 まず、マルチテナントSaaSアプリケーションとは何ですか? マルチテナントSaaSアプリケーションを使用すると、Singの複数の顧客にサービスを提供できます

next.jsを使用してマルチテナントSaaSアプリケーションを構築する方法(フロントエンド統合)next.jsを使用してマルチテナントSaaSアプリケーションを構築する方法(フロントエンド統合)Apr 11, 2025 am 08:22 AM

この記事では、許可によって保護されたバックエンドとのフロントエンド統合を示し、next.jsを使用して機能的なedtech SaaSアプリケーションを構築します。 FrontEndはユーザーのアクセス許可を取得してUIの可視性を制御し、APIリクエストがロールベースに付着することを保証します

See all articles

ホット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ヘンタイを無料で生成します。

ホットツール

SecLists

SecLists

SecLists は、セキュリティ テスターの究極の相棒です。これは、セキュリティ評価中に頻繁に使用されるさまざまな種類のリストを 1 か所にまとめたものです。 SecLists は、セキュリティ テスターが必要とする可能性のあるすべてのリストを便利に提供することで、セキュリティ テストをより効率的かつ生産的にするのに役立ちます。リストの種類には、ユーザー名、パスワード、URL、ファジング ペイロード、機密データ パターン、Web シェルなどが含まれます。テスターはこのリポジトリを新しいテスト マシンにプルするだけで、必要なあらゆる種類のリストにアクセスできるようになります。

WebStorm Mac版

WebStorm Mac版

便利なJavaScript開発ツール

mPDF

mPDF

mPDF は、UTF-8 でエンコードされた HTML から PDF ファイルを生成できる PHP ライブラリです。オリジナルの作者である Ian Back は、Web サイトから「オンザフライ」で PDF ファイルを出力し、さまざまな言語を処理するために mPDF を作成しました。 HTML2FPDF などのオリジナルのスクリプトよりも遅く、Unicode フォントを使用すると生成されるファイルが大きくなりますが、CSS スタイルなどをサポートし、多くの機能強化が施されています。 RTL (アラビア語とヘブライ語) や CJK (中国語、日本語、韓国語) を含むほぼすべての言語をサポートします。ネストされたブロックレベル要素 (P、DIV など) をサポートします。

VSCode Windows 64 ビットのダウンロード

VSCode Windows 64 ビットのダウンロード

Microsoft によって発売された無料で強力な IDE エディター

DVWA

DVWA

Damn Vulnerable Web App (DVWA) は、非常に脆弱な PHP/MySQL Web アプリケーションです。その主な目的は、セキュリティ専門家が法的環境でスキルとツールをテストするのに役立ち、Web 開発者が Web アプリケーションを保護するプロセスをより深く理解できるようにし、教師/生徒が教室環境で Web アプリケーションを教え/学習できるようにすることです。安全。 DVWA の目標は、シンプルでわかりやすいインターフェイスを通じて、さまざまな難易度で最も一般的な Web 脆弱性のいくつかを実践することです。このソフトウェアは、