入力フィールドのデータをフィルタリングします。 Javascript配列comparsion？

私は3つの入力フィールドとボタンを持っています。フィールドには数字とカンマしか入力できません。その結果は、3つのフィールドのすべてで、正確に2回発生する数値でなければなりません。例えば。入力フィールドのデータをフィルタリングします。 Javascript配列comparsion？

num_array1 = [1,2,3]; 
num_array2 = [1,2,3,4]; 
num_array3 = [1,5,6];

この例によれば、結果は次のようになりますすべてのアレイはそれを持っているので2,3 実際のトラブルは、番号「1」です。私はそれをすることができないサイクルのための単純な埋め込みと、私はあなたができることを願って:)私は、任意の代替ソリューションを期待しています。

私のコードの一部：

<body> 
 

 
    <form name="numbers" method="post"> 
 
    <input type="text" id="number_1"> 
 
    <input type="text" id="number_2"> 
 
    <input type="text" id="number_3"> 
 
    <button id="evaluate" onclick="myFunction()">Calculate</button> 
 
    </form> 
 
    <p id="error"></p> 
 
    <p id="result"></p> 
 

 
</body> 
 

 
<script> 
 
    var number1 = document.getElementById("number_1").value.replace(/[^\d,.]/g, ''); 
 
    var number2 = document.getElementById("number_2").value.replace(/[^\d,.]/g, ''); 
 
    var number3 = document.getElementById("number_3").value.replace(/[^\d,.]/g, ''); 
 

 
    var error = document.getElementById("error").innerHTML; 
 
    var result = document.getElementById("result").innerHTML; 
 

 
    function myFunction() { 
 
    if (isNaN(number1) || isNaN(number2) || isNaN(number3)) { 
 
     error = "Not legal character"; 
 
    } else {} 
 
    } 
 
</script>

出典

2017-02-07 JustMatthew

ここでは、ソリューションです。まず、をarrayにするには、.split()メソッドを使用する必要があります。

var number1 = document.getElementById("number_1").value.replace(/[^\d,.]/g, '').split(','); 
//number1=[1,2,3]

は、その後、あなたは.concat()メソッドを使用して、すべての3 arrayをCONCATとちょうど2倍occuringしているだけnumberを見つける必要があります。

concatArray=number1.concat(number2,number3); 
//concatArray=[1,2,3,1,2,3,4,1,5,6];

次のステップは、filter()関数を使用して指定elementのoccurencesのnumberを見つけることです。この数は2で、elementがない最終arrayに存在する場合

、我々はfinal配列にそれを追加します、arrと呼ばれます。

arrayにelementが存在するかどうかを調べるには、indexOf()メソッドを使用する必要があります。

var error = document.getElementById("error").innerHTML; 
 
    var result = document.getElementById("result").innerHTML; 
 
    var arr=[]; 
 
    function myFunction() { 
 
     var number1 = document.getElementById("number_1").value.replace(/[^\d,.]/g, '').split(','); 
 
    var number2 = document.getElementById("number_2").value.replace(/[^\d,.]/g, '').split(','); 
 
    var number3 = document.getElementById("number_3").value.replace(/[^\d,.]/g, '').split(','); 
 
     var concatArray=number1.concat(number2,number3); 
 
    console.log(concatArray); 
 
     for(i=0;i<concatArray.length;i++){ 
 
      var length=concatArray.filter(function(item){ 
 
       return item==concatArray[i]; 
 
      }).length; 
 
      if(length==2 && arr.indexOf(concatArray[i])==-1){ 
 
      arr.push(concatArray[i]); 
 
      } 
 
     } 
 
    console.log(arr); 
 
    
 
    }

<body> 
 

 
    <form name="numbers" method="post"> 
 
    <input type="text" id="number_1"> 
 
    <input type="text" id="number_2"> 
 
    <input type="text" id="number_3"> 
 
    <button id="evaluate" onclick="myFunction()">Calculate</button> 
 
    </form> 
 
    <p id="error"></p> 
 
    <p id="result"></p>

出典

2017-02-07 16:39:39

Javascriptを使用してこれを行う1つの方法。私はUIのコードを含まず、Javascriptの部分だけを表示しています。

以下の手順で動作します。

Spread演算子を使用して配列を1つの配列にマージします。
GroupByカスタム関数（here）を使用して、カウント操作を実行できるように数値をグループ化します。これは、Mapオブジェクトを返します。
上記のステップで得られたMapをフィルタリングして、基準（カウント== 2）が満たされた場合。

var num_array1 = [1,2,3]; 
 
var num_array2 = [1,2,3,4]; 
 
var num_array3 = [1,5,6]; 
 
var resultArray = []; 
 

 
// Using the Spread Operator merging the Array into a Single Array. 
 
var combinedNumArray = [...num_array1,...num_array2, ...num_array3]; 
 

 
// Group By number 
 
var groupByNumbers = groupBy(combinedNumArray, i => i); 
 

 
// Filter where count = 2 
 
groupByNumbers.forEach(function(value, key) { 
 
    if(value.length === 2) { 
 
     resultArray.push(key); 
 
    } 
 
}); 
 

 
console.log(resultArray); 
 

 
// Using a GroupBy Function 
 
// Borrowed from https://stackoverflow.com/questions/14446511/what-is-the-most-efficient-method-to-groupby-on-a-javascript-array-of-objects 
 
function groupBy(list, keyGetter) { 
 
    const map = new Map(); 
 
    list.forEach((item) => { 
 
     const key = keyGetter(item); 
 
     if (!map.has(key)) { 
 
      map.set(key, [item]); 
 
     } else { 
 
      map.get(key).push(item); 
 
     } 
 
    }); 
 
    return map; 
 
}

出典

2017-02-07 16:52:31 Agalo

入力フィールドのデータをフィルタリングします。 Javascript配列comparsion？

答えて

関連する問題