検索
ホームページウェブフロントエンドjsチュートリアルJS 配列操作のプッシュ、ポップ、シフト、アンシフトなどのメソッドは、detail_javascript スキルで紹介されています。

jsにはまだまだたくさんの配列操作のメソッドが存在しますが、過去を振り返り新しいことを学ぶという意味でも、今日はそれらをまとめてみようと思い立ちました。ただし、すべての方法を説明するのではなく、いくつかの方法を選択します。

まず、プッシュ メソッドとポップ メソッドについて説明します。これら 2 つのメソッドは配列を末尾からプッシュまたはポップするだけであり、変更は操作された配列に影響します。 Push(args) は、一度に複数の要素をプッシュし、更新された配列の長さを返すことができます。 Pop() 関数は、毎回最後に最後の要素のみをポップアップし、空の配列で Pop() が呼び出された場合は、未定義を返します。 パラメータが配列の場合、配列全体が 1 つの要素として元の配列にプッシュされます。 concat が配列をマージする場合のような「分割現象」は発生しません。以下の例を見てみましょう。

例 1:
var oldArr=[1,2,3] ;
alert(oldArr.push(4,[5,6]))–>5 (ここでは [5,6] のみが 1 つの要素として計算され、更新された配列の長さ 5 が返されます)
この時点では、oldArr–>[1,2,3,4,[5,6]]
alert(oldArr.pop())–>[5,6](最後の要素 [5,6] ] がここに表示されます。 6)
oldArr–>[1,2,3,4]
oldArr.pop()–>4
oldArr.pop()–>3
oldArr .pop()–>2
oldArr.pop()–>1
oldArr.pop()–>未定義 (空の配列ポップアップ)
プッシュとポップについて話した後、 unshift と SHIFT
を見てみましょう。どちらのメソッドも配列の先頭で動作します。他のメソッドは基本的に Push と Pop に似ていますが、IE では unshift メソッドは未定義の

を返します。 例 2 :
var oldArr2=[1,2];
oldArr2.unshift(3)–>未定義
この時点では、oldArr2 は –>[3,1,2]
oldArr2 .shift()–>3
現時点では、oldArr2 は [1,2]
より強力なスプライスを見てみましょう。これは、配列内のランダムな位置で要素を追加および削除するために使用できます。その動作もオリジナルにあります

配列に対する変更
splice(start,deleteCnt,args) の start は を意味します。開始操作の添字、deleteCnt は開始添字 (要素を含む) から開始して削除することを意味し、要素の数、削除操作は削除された要素を返します。 args は、削除された要素を置き換えるために使用される要素を表します (複数のパラメータを持つことができます)。start および deleteCnt は数値でなければなりません。変換が失敗した場合は、0 として扱われます。スプライスには少なくとも 1 つの開始要素が必要です。そうでない場合、操作は実行されません。 deleteCnt がない場合は、開始要素と後続のすべての要素が削除されることを意味します (IE では 0 は削除されません)。 start には負の数を指定できます。これは、配列の右側の末尾から開始することを意味します。 deleteCnt が負の場合、負の要素を削除することはできないため、削除は実行されません。
説明は終わりましたので、例を見てみましょう。

例 3:
var oldArr3=[ 1,2];
oldArr3.splice()–>””(oldArr3–>[1,2] の操作の後は空の文字列を返し、何も実行しません)
oldArr3.splice( “”)–>[1,2]("" は数値への変換に失敗し、0 を返したので、操作後に 1,2,oldArr3–>[] を削除しますが、IE では少し不快です。何も操作しません)
oldArr3.splice(" 1a")–>同上
odlArr3.splice(0,2)–>[1,2]("添字0の要素から開始、2 つの要素 1,2 を削除するため、削除後は oldArr3–> [])
oldArr3.splice(0,-1)–>””(添字 0 から始まる -1 要素を削除するため、操作は行われません操作後、 oldArr3–>[1,2] )
oldArr3.splice(1,1)–>2 (インデックス 1 から始まる 1 つの要素、つまり 2 を削除します。したがって、削除後、 oldArr3–>[1])
oldArr3.splice(1 ,4)–>2 (添字 1 から始まる 4 つの要素を削除し、1 から始まる要素は 1 つしかないため、2 を削除します。つまり、削除後、 oldArr3–>[1])
oldArr3.splice(-1, 0,3)–>""(要素 2 である添字 -1 から始まる 0 要素を削除し、要素 3 を追加します。操作 oldArr3–>[1,3,2])
oldArr3.splice (-1,1,3)–>2 (添字 -1 から始まる 1 要素 (2 要素) を削除し、追加します要素 3. 操作後は、oldArr3–>[1,3])
OK 次に、concat から始めましょう。このメソッドは、2 つ以上の配列を接続するために使用されます。配列は元の配列を変更しません。接続中にパラメータが配列の場合のみ、新しい配列を返します。この例を直接開始するのは比較的簡単です

: var oldArr4=[1,2];
oldArr4.concat(3,4)–>[1,2 ,3,4]
oldArr4.concat(3,4,[5,6] )–>[1,2,3,4,5,6](ここで追加されるのは[5,6]要素5と要素6です)
oldArr4.concat(3,[4,[5,6] ]])–>[1,2,3,4,[5,6]](ここでは最も内側の層です。要素 [5,6] 全体は分割ではなく追加に使用されます)
について話しましょう配列のソートメソッド sort
sort(function) は元の配列をソートするものであり、新しい配列は生成されません。デフォルトでは、パラメータを指定しない sort() は、比較のために配列内の要素を文字列に変換し、文字は文字エンコーディングの順序に従って並べ替えられます。

Look at the following example
var oldArr5=[3,1,5,7,17] Looking at this general concept, when sorting oldArr5, oldArr5.sort() will follow Sorting the numbers from small to large returns [1,3,5,7,17], but if you look at the result, it actually returns [1,17,3,5,7] because they are converted into strings during comparison. Then compare the strings one by one. If the first character is the same, compare the second character. Otherwise, the comparison result will be returned directly. Because "17"
In addition to the default no parameters, the sort(function) method can also pass in a custom sorting method. In this way, the sorting results can be completely controlled by yourself. You can sort them however you want. Isn’t it great? Ah, hehe. Generally, a custom function comparison function contains two parameters representing the left element and the right element used for comparison. Then a result is returned in a certain way. If the return value is greater than 0, it means that the left and right elements are exchanged. If the return value is less than 0 or equal to 0, it means that the left and right elements will not be exchanged. Now look at the example

Example 5:
Arrange the original array according to the numbers from large to small

Copy code The code is as follows:

var oldArr5=[3,1,5,7,17]; //Initial array
function mySort(left,right) {
if(leftreturn 1;}//If the left element is less than the right element, exchange the two numbers
else{
return -1;}//If the left element is greater than or equal to The elements on the right are not exchanged
}

Of course the above method can be simplified to funaction mySort(left,right){ return right-left;}
Copy code The code is as follows:

//Sort by even numbers first and odd numbers last
var oldArr6=[3,6,7, 18];//Initial array
function mySort2(left,right){
if(left%2==0)return -1;//If the left element is an even number, no exchange is done
if(right %2==0)return 1; //If the right element is an even number, exchange
return 0; //Do not exchange
}

I won’t talk much about the last slice, just use To intercept some elements in the original array and return a new array. The original array will not change. Its operation method is similar to the slice of string
Copy code The code is as follows:

var oldArr7=[1,2,3,4];
oldArr7.slice(0)–>[1,2,3,4 ]
oldArr7.slice(0,2)–>[1,2]
oldArr7.slice(0,0)–>[]
oldArr7.slice(0,-1)–> ;[1,2,3]
oldArr7.slice(-3,-1)–>[2,3]
oldArr4.slice(-1,-3)–[]
声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
JavaScriptフレームワーク:最新のWeb開発のパワーJavaScriptフレームワーク:最新のWeb開発のパワーMay 02, 2025 am 12:04 AM

JavaScriptフレームワークのパワーは、開発を簡素化し、ユーザーエクスペリエンスとアプリケーションのパフォーマンスを向上させることにあります。フレームワークを選択するときは、次のことを検討してください。1。プロジェクトのサイズと複雑さ、2。チームエクスペリエンス、3。エコシステムとコミュニティサポート。

JavaScript、C、およびブラウザの関係JavaScript、C、およびブラウザの関係May 01, 2025 am 12:06 AM

はじめに私はあなたがそれを奇妙に思うかもしれないことを知っています、JavaScript、C、およびブラウザは正確に何をしなければなりませんか?彼らは無関係であるように見えますが、実際、彼らは現代のウェブ開発において非常に重要な役割を果たしています。今日は、これら3つの間の密接なつながりについて説明します。この記事を通して、JavaScriptがブラウザでどのように実行されるか、ブラウザエンジンでのCの役割、およびそれらが協力してWebページのレンダリングと相互作用を駆動する方法を学びます。私たちは皆、JavaScriptとブラウザの関係を知っています。 JavaScriptは、フロントエンド開発のコア言語です。ブラウザで直接実行され、Webページが鮮明で興味深いものになります。なぜJavascrを疑問に思ったことがありますか

node.jsは、型を使用してストリーミングしますnode.jsは、型を使用してストリーミングしますApr 30, 2025 am 08:22 AM

node.jsは、主にストリームのおかげで、効率的なI/Oで優れています。 ストリームはデータを段階的に処理し、メモリの過負荷を回避します。大きなファイル、ネットワークタスク、リアルタイムアプリケーションの場合。ストリームとTypeScriptのタイプの安全性を組み合わせることで、パワーが作成されます

Python vs. JavaScript:パフォーマンスと効率の考慮事項Python vs. JavaScript:パフォーマンスと効率の考慮事項Apr 30, 2025 am 12:08 AM

PythonとJavaScriptのパフォーマンスと効率の違いは、主に以下に反映されています。1)解釈された言語として、Pythonはゆっくりと実行されますが、開発効率が高く、迅速なプロトタイプ開発に適しています。 2)JavaScriptはブラウザ内の単一のスレッドに限定されていますが、マルチスレッドおよび非同期I/Oを使用してnode.jsのパフォーマンスを改善でき、両方とも実際のプロジェクトで利点があります。

JavaScriptの起源:その実装言語の調査JavaScriptの起源:その実装言語の調査Apr 29, 2025 am 12:51 AM

JavaScriptは1995年に発信され、Brandon Ikeによって作成され、言語をCに実現しました。 2。JavaScriptのメモリ管理とパフォーマンスの最適化は、C言語に依存しています。 3. C言語のクロスプラットフォーム機能は、さまざまなオペレーティングシステムでJavaScriptを効率的に実行するのに役立ちます。

舞台裏:JavaScriptをパワーする言語は何ですか?舞台裏:JavaScriptをパワーする言語は何ですか?Apr 28, 2025 am 12:01 AM

JavaScriptはブラウザとnode.js環境で実行され、JavaScriptエンジンに依存してコードを解析および実行します。 1)解析段階で抽象的構文ツリー(AST)を生成します。 2)ASTをコンパイル段階のバイトコードまたはマシンコードに変換します。 3)実行段階でコンパイルされたコードを実行します。

PythonとJavaScriptの未来:傾向と予測PythonとJavaScriptの未来:傾向と予測Apr 27, 2025 am 12:21 AM

PythonとJavaScriptの将来の傾向には、1。Pythonが科学コンピューティングの分野での位置を統合し、AI、2。JavaScriptはWebテクノロジーの開発を促進します。どちらもそれぞれのフィールドでアプリケーションシナリオを拡大し続け、パフォーマンスをより多くのブレークスルーを行います。

Python vs. JavaScript:開発環境とツールPython vs. JavaScript:開発環境とツールApr 26, 2025 am 12:09 AM

開発環境におけるPythonとJavaScriptの両方の選択が重要です。 1)Pythonの開発環境には、Pycharm、Jupyternotebook、Anacondaが含まれます。これらは、データサイエンスと迅速なプロトタイピングに適しています。 2)JavaScriptの開発環境には、フロントエンドおよびバックエンド開発に適したnode.js、vscode、およびwebpackが含まれます。プロジェクトのニーズに応じて適切なツールを選択すると、開発効率とプロジェクトの成功率が向上する可能性があります。

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衣類リムーバー

Video Face Swap

Video Face Swap

完全無料の AI 顔交換ツールを使用して、あらゆるビデオの顔を簡単に交換できます。

ホットツール

MinGW - Minimalist GNU for Windows

MinGW - Minimalist GNU for Windows

このプロジェクトは osdn.net/projects/mingw に移行中です。引き続きそこでフォローしていただけます。 MinGW: GNU Compiler Collection (GCC) のネイティブ Windows ポートであり、ネイティブ Windows アプリケーションを構築するための自由に配布可能なインポート ライブラリとヘッダー ファイルであり、C99 機能をサポートする MSVC ランタイムの拡張機能が含まれています。すべての MinGW ソフトウェアは 64 ビット Windows プラットフォームで実行できます。

EditPlus 中国語クラック版

EditPlus 中国語クラック版

サイズが小さく、構文の強調表示、コード プロンプト機能はサポートされていません

AtomエディタMac版ダウンロード

AtomエディタMac版ダウンロード

最も人気のあるオープンソースエディター

メモ帳++7.3.1

メモ帳++7.3.1

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

SublimeText3 英語版

SublimeText3 英語版

推奨: Win バージョン、コードプロンプトをサポート!