検索
ホームページウェブフロントエンドjsチュートリアルjsで配列を操作する方法まとめ(コード)

この記事は、js で配列を操作するためのメソッドの概要 (コード) です。必要な方は参考にしていただければ幸いです。

1. 指定された配列 arr 内の要素 item の位置を検索します

function indexOf(arr, item) {
  if (Array.prototype.indexOf){ //判断原型中是否支持该方法
      return arr.indexOf(item);
  } else {      
  for (var i = 0; i < arr.length; i++){          
  if (arr[i] === item){              
  return i;
          }
      }
  }     
  return -1;
}

2. 指定された配列 arr 内のすべての要素の合計を計算します

//forEach遍历:
function sum(arr) {
    var s = 0;
    arr.forEach(function(val, idx, arr) {
        s += val;
    }, 0);    
    return s;
};
//eval:
function sum(arr) {
    return eval(arr.join("+"));
};

3. 配列 arr 内のすべての値を削除しますおよび item が等しい要素。配列 arr を直接変更しないでください。結果は新しい配列

//splice()
function remove(arr,item){
    var newarr = arr.slice(0);    
    for(var i=0;i<newarr.length;i++){        
    if(newarr[i] == item){
            newarr.splice(i,1);
            i--;
        }
    }    
    return newarr;
}//push()
function remove(arr,item){
    var newarr = [];    
    for(var i=0;i<arr.length;i++){        
    if(arr[i] != item){
            newarr.push(arr[i]);
        }
    }    
    return newarr;
}//Array.prototype.filter()
function remove(arr,item){
    return arr.filter(function(ele){
         return ele != item;
    })
}

として返されます。4. 値が item に等しい配列 arr 内のすべての要素を削除し、指定された arr 配列を直接操作して、結果を返します。

//splice
function removeWithoutCopy(arr, item) {
    for(var i=0; i<arr.length; i++)
    {        
    if(item == arr[i])
        {
            arr.splice(i,1);
            i--;
        }
    }    
    return arr;
}//while
function removeWithoutCopy(arr, item) {
    for(var i in arr){        
    while(arr[i]==item){
            arr.splice(i,1);
        }
    }    
    return arr;
}

5. 配列 arr の最後に要素 item を追加します。配列 arr を直接変更しないでください。結果は新しい配列

//普通的迭代拷贝
var append = function(arr, item) {
    var length = arr.length,
        newArr = [];    
        for (var i = 0; i < length; i++) {
        newArr.push(arr[i]);
    }

    newArr.push(item);    
    return newArr;
};//使用slice浅拷贝+push组合
function append(arr, item) {
    var newArr=arr.slice(0);
    newArr.push(item);    
    return newArr;
}

6 になります。配列 arr の最後の要素を削除します。配列 arr を直接変更しないでください。結果は新しい配列

//利用slice
function truncate(arr) {
    return arr.slice(0,-1);
}
//利用filter
function truncate(arr) {
    return arr.filter(function(v,i,ar) {
        return i!==ar.length-1;
    });
}
//利用push.apply+pop
function truncate(arr) {
    var newArr=[];
    [].push.apply(newArr, arr);
    newArr.pop();    return newArr;
}
//利用join+split+pop    注意!!!:数据类型会变成字符型
function truncate(arr) {
    var newArr = arr.join().split(&#39;,&#39;);
    newArr.pop();    
    return newArr;
}

7. 配列 arr の先頭に要素 item を追加します。配列 arr を直接変更しないでください。結果は新しい配列

//利用concat
function prepend(arr, item) {
    return [item].concat(arr);
}
//使用push.apply
function prepend(arr, item) {
    var newArr=[item];
    [].push.apply(newArr, arr);    
    return newArr;
}
//利用slice+unshift/splice
function prepend(arr, item) {
    var newArr=arr.slice(0);
    newArr.unshift(item);//newArr.splice(0,0,item);
    return newArr;
}

8 になります。配列 arr の最初の要素を削除します。配列 arr を直接変更しないでください。結果は、配列 arr1 と配列 arr2 をマージして、新しい配列

//利用slice
function curtail(arr) {
    return arr.slice(1);
}
//利用filter
function curtail(arr) {
    return arr.filter(function(v,i) {
        return i!==0;
    });
}
//利用push.apply+shift
function curtail(arr) {
    var newArr=[];
    [].push.apply(newArr, arr);
    newArr.shift();    
    return newArr;
}

9 になります。配列 arr を直接変更しないでください。結果は新しい配列

//利用concat
function concat(arr1, arr2) {
    return arr1.concat(arr2);
}
//利用slice+push.apply
function concat(arr1, arr2) {
    var newArr=arr1.slice(0);
    [].push.apply(newArr, arr2);    
    return newArr;
}
//利用slice+push
function concat(arr1, arr2) {
    var newArr=arr1.slice(0);    
    for(var i=0;i<arr2.length;i++){
        newArr.push(arr2[i]);
    }    
    return newArr;
}

10 になります。配列 arr のインデックスに要素 item を追加します。配列 arr を直接変更しないでください。結果は新しい配列になります

//利用slice+splicefunction insert(arr, item, index) {
    var newArr=arr.slice(0);
    newArr.splice(index,0,item);    return newArr;
}//利用push.apply+splicefunction insert(arr, item, index) {
    var newArr=[];
    [].push.apply(newArr, arr);
    newArr.splice(index,0,item);    return newArr;
}

11。 item と等しい値を持つ配列 arr 内の要素が出現する回数を数えます

//filter()-->利用指定的函数确定是否在返回的数组中包含某一项
        function count(arr, item) {
            var count = arr.filter(function(a) {
                return a === item;   //返回true的项组成的数组
            });            
            return count.length;
        }  
        //map()-->对数组中的每一项进行给定函数,
  //返回每次函数条用的结果组成的数组;
        function count(arr, item) {
            var count = 0;
            arr.map(function(a) {
                if(a === item) {
                    count++;
                }
            });            
            return count;
        }//forEach()-->对数组中的每一项运行传入的函数
        function count(arr, item) {
            var count = 0;
            arr.forEach(function(a) {
                a === item ? count++ : 0;
            });            
            return count;
        }

12。配列内の要素 arr

//两次遍历
function duplicates(arr) {
     //声明两个数组,a数组用来存放结果,b数组用来存放arr中每个元素的个数
     var a = [],b = [];     
     //遍历arr,如果以arr中元素为下标的的b元素已存在,则该b元素加1,否则设置为1
     for(var i = 0; i < arr.length; i++){         
     if(!b[arr[i]]){
             b[arr[i]] = 1;             
             continue;
         }
         b[arr[i]]++;
     }     
     //遍历b数组,将其中元素值大于1的元素下标存入a数组中
     for(var i = 0; i < b.length; i++){         
     if(b[i] > 1){
             a.push(i);
         }
     }     
     return a;
 }
 //先排序,如果后一个与前一个相等且未保存,则保存。
 function duplicates(arr) {
    var a=arr.sort(),b=[];    
    for(var i in a){        
    if(a[i]==a[i-1] && b.indexOf(a[i])==-1) b.push(a[i]); 
    }    
    return b;
}
//先排序然后再判断function duplicates(arr) {
    var new_arr = arr.sort();//先把arr排序
    var res = [] ;//目标容器
    for( var i = 0 ; i < new_arr.length ; i++){        
    if(new_arr[i] == new_arr[i+1] &&
        new_arr[i] !=new_arr[i-1]){//判断是否重复,是否已经放入容器
            res.push(new_arr[i]);
        }
    }
    return res;

13. 配列 arr 内の各要素の 2 乗を求めます。配列 arr を直接変更しないでください。結果は新しい配列として返されます

function square(arr) {
   //声明一个新的数组存放结果
     var a = [];
     arr.forEach(function(e){
         //将arr中的每一个元素求平方后,加入到a数组中
         a.push(e*e);
     });     
     return a;
 }
 // 使用map
  function square(arr) {
      return arr.map(function(e) {
          return e * e;
      })
  }  
  // ES6箭头函数版
  const square = arr => arr.map(e => e * e);

14. 配列 arr 内で、値が item に等しい要素が出現するすべての位置を検索します

//forEach
function findAllOccurrences(arr, target) {
    var a=[];
    arr.forEach(function(e,index){
        if(e==target)
            a.push(index);
    })    
    return a;
}
function findAllOccurrences(arr, target) {
var temp = [];
    arr.forEach(function(val,index){
        val !== target ||  temp.push(index);
    });    
    return temp;
}//filter
function findAllOccurrences(arr, target) {
    var result=[];
    arr.filter(function(item,index){
        return item===target&&result.push(index);
    });    
    return result;
}

関連する推奨事項:

jsの配列操作方法まとめ(必読記事)

Jsの配列操作の基本的な方法を解説します

以上がjsで配列を操作する方法まとめ(コード)の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
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リクエストがロールベースに付着することを保証します

JavaScript:Web言語の汎用性の調査JavaScript:Web言語の汎用性の調査Apr 11, 2025 am 12:01 AM

JavaScriptは、現代のWeb開発のコア言語であり、その多様性と柔軟性に広く使用されています。 1)フロントエンド開発:DOM操作と最新のフレームワーク(React、Vue.JS、Angularなど)を通じて、動的なWebページとシングルページアプリケーションを構築します。 2)サーバー側の開発:node.jsは、非ブロッキングI/Oモデルを使用して、高い並行性とリアルタイムアプリケーションを処理します。 3)モバイルおよびデスクトップアプリケーション開発:クロスプラットフォーム開発は、反応および電子を通じて実現され、開発効率を向上させます。

JavaScriptの進化:現在の傾向と将来の見通しJavaScriptの進化:現在の傾向と将来の見通しApr 10, 2025 am 09:33 AM

JavaScriptの最新トレンドには、TypeScriptの台頭、最新のフレームワークとライブラリの人気、WebAssemblyの適用が含まれます。将来の見通しは、より強力なタイプシステム、サーバー側のJavaScriptの開発、人工知能と機械学習の拡大、およびIoTおよびEDGEコンピューティングの可能性をカバーしています。

javascriptの分解:それが何をするのか、なぜそれが重要なのかjavascriptの分解:それが何をするのか、なぜそれが重要なのかApr 09, 2025 am 12:07 AM

JavaScriptは現代のWeb開発の基礎であり、その主な機能には、イベント駆動型のプログラミング、動的コンテンツ生成、非同期プログラミングが含まれます。 1)イベント駆動型プログラミングにより、Webページはユーザー操作に応じて動的に変更できます。 2)動的コンテンツ生成により、条件に応じてページコンテンツを調整できます。 3)非同期プログラミングにより、ユーザーインターフェイスがブロックされないようにします。 JavaScriptは、Webインタラクション、シングルページアプリケーション、サーバー側の開発で広く使用されており、ユーザーエクスペリエンスとクロスプラットフォーム開発の柔軟性を大幅に改善しています。

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

ホットツール

SublimeText3 中国語版

SublimeText3 中国語版

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

SublimeText3 Mac版

SublimeText3 Mac版

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

SAP NetWeaver Server Adapter for Eclipse

SAP NetWeaver Server Adapter for Eclipse

Eclipse を SAP NetWeaver アプリケーション サーバーと統合します。

EditPlus 中国語クラック版

EditPlus 中国語クラック版

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

DVWA

DVWA

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