コミュニティ 学ぶ ツールライブラリ レジャー
検索
日本語
ホームページ > ウェブフロントエンド > jsチュートリアル > jsで配列を操作する方法まとめ（コード）

jsで配列を操作する方法まとめ（コード）

不言
リリース： 2018-08-23 15:16:21
オリジナル
1776 人が閲覧しました

この記事は、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 サイトの他の関連記事を参照してください。

関連ラベル：
配列
ソース：php.cn
前の記事：JSイベントバインディング、イベントリスニング、イベントデリゲーションの間のコンテンツの簡単な分析 次の記事：jsでの数値演算のまとめ（コード）
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
最新の問題
function_exists() はカスタム関数を決定できません Function test () {return true;} if (function_exists ('test')) {echo "テストは関数です";
から 2024-04-29 11:01:01
0
2
1429
URL パラメータから取得した PHP 配列が期待どおりに動作しない カテゴリ ID を含む URL パラメータがあり、それを次のような配列として扱いたいと考えています: http://example.com?cat[]=3,9,13 PHP では、...
から 2024-04-06 22:09:02
0
1
1428
戻り値の変数の形式は何ですか? 私はphpの初心者です。コードを見つけました: if($x<time()){return[false,'error'];} ロジックや変数は重要ではありませんが、[false...
から 2024-04-06 21:55:20
0
1
778
Reactのsortメソッドでレンダリング(フィルターとページネーションを使用)をトリガーするにはどうすればよいですか? これが私の Sort.js スタイル コンポーネントです: <SortWrapper><SortText>SortBy</SortText>&l...
から 2024-04-06 21:28:37
0
1
2257
クラスのプライベート メンバーをコンストラクター パラメーターとして設定する classFoo{#one#two#three#four#five#six#seven#eight#nine#ten#eleven#twelve#thirteen#fourteen...
から 2024-04-06 21:48:47
0
1
637
関連トピック
詳細>
人気のおすすめ
人気のチュートリアル
詳細>
関連するチュートリアル
人気のおすすめ
最新のコース
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート