JS配列のいくつかの開発テクニック(脱重、フィルタリング、ランダム配列、並べ替え)


1、ランダム配列
function shuffle(arr) {
  var i, j, temp
  for (i = arr.length - 1; i > 0; i--) {
    j = Math.floor(Math.random() * (i + 1))
    temp = arr[i]
    arr[i] = arr[j]
    arr[j] = temp
  }
  return arr
}

2.一意の値
開発者では、重複する値をフィルタする必要があります.ここでは、配列の重複値をフィルタする方法をいくつか提供します.
Setオブジェクトの使用Set()関数を使用します.この関数は、単一の値配列とともに使用できます.配列にネストされたオブジェクト値は、良い選択ではありません.
const numArray = [1,2,3,4,2,3,4,5,1,1,2,3,3,4,5,6,7,8,2,4,6];

//    Array.from   
Array.from(new Set(numArray))

//       
[...new Set(numArray)]

Arrayを使うfilter filterメソッドを使用して、要素がオブジェクトであることをフィルタできます.
const data = [
  {id: 1, name: 'Lemon'},
  {id: 2, name: 'Mint'},
  {id: 3, name: 'Mango'},
  {id: 4, name: 'Apple'},
  {id: 5, name: 'Lemon'},
  {id: 6, name: 'Mint'},
  {id: 7, name: 'Mango'},
  {id: 8, name: 'Apple'},
]

function findUnique(data) {
  return data.filter((value, index, array) => {
    if (array.findIndex(item => item.name === value.name) === index) {
      return value;
    }
  })
}

loadshを使用したlodashメソッド
import {uniqBy} from 'lodash'

const data = [ 
  {id: 1, name: 'Lemon'}, 
  {id: 2, name: 'Mint'}, 
  {id: 3, name: 'Mango'}, 
  {id: 4, name: 'Apple'}, 
  {id: 5, name: 'Lemon'}, 
  {id: 6, name: 'Mint'},
  {id: 7, name: 'Mango'}, 
  {id: 8, name: 'Apple'}, 
] 

function findUnique(data) { 
  return uniqBy(data, e => {
    	return e.name
    })
}

3.属性別 並べ替え
JS配列中のsortメソッドは辞書順に並べ替えられていることがわかりますので、文字列クラスでは正常に動作しますが、データ要素がオブジェクトタイプであるため、あまり使いにくくなります.ここではソートメソッドをカスタマイズする必要があります.
比較関数では、次の条件に従って値を返します.
1.0:A未満Bより前2.0:Bより大きいAより前3.等しい0:AとBは互いに変わらない
const data = [
  {id: 1, name: 'Lemon', type: 'fruit'},
  {id: 2, name: 'Mint', type: 'vegetable'},
  {id: 3, name: 'Mango', type: 'grain'},
  {id: 4, name: 'Apple', type: 'fruit'},
  {id: 5, name: 'Lemon', type: 'vegetable'},
  {id: 6, name: 'Mint', type: 'fruit'},
  {id: 7, name: 'Mango', type: 'fruit'},
  {id: 8, name: 'Apple', type: 'grain'},
]

function compare(a, b) {
  // Use toLowerCase() to ignore character casing
  const typeA = a.type.toLowerCase()
  const typeB = b.type.toLowerCase()

  let comparison = 0
  if (typeA > typeB) {
    comparison = 1
  } else if (typeA < typeB) {
    comparison = -1
  }
  return comparison
}

data.sort(compare)

4.配列を指定記号で区切られた文字列に変換
JSでは,配列中の.join()メソッドを用いて,指定された記号を入力して配列を区切る方法がある.
const data = ['Mango', 'Apple', 'Banana', 'Peach']

data.join(',')
// return "Mango,Apple,Banana,Peach"

5.配列から要素を選択
このタスクについては、forEach組合せif-elseを使用する方法と、filterを使用する方法がありますが、forEachおよびfilterを使用する欠点は、次のとおりです.
1.forEachでは、追加の不要な要素を巡回し、if文を使用して必要な値を抽出します.2.filterメソッドでは、簡単な比較操作がありますが、配列を返します.ただし、与えられた条件に基づいて配列から単一のオブジェクトを取得したいと思っています.
この問題を解決するために、find関数を使用して配列から正確な要素を見つけてオブジェクトを返すことができます.ここでは、if-else文を使用して要素が条件を満たしているかどうかを確認する必要はありません.
const data = [ 
  {id: 1, name: 'Lemon'}, 
  {id: 2, name: 'Mint'}, 
  {id: 3, name: 'Mango'}, 
  {id: 4, name: 'Apple'}
] 

const value = data.find(item => item.name === 'Apple')
// value = {id: 4, name: 'Apple'}