古い話をしていますが、Javascriptでは、行列はどうやって重いですか?

与えられた配列の重複をどのように除去するかについては、Javascript面接で最も一般的な問題です.最も一般的な方法は3つあります.SetArray.prototype.filter及びArray.prototype.reduce簡単なデータのみの配列にとって、私は好きです.

const originalArray = [1, 2, ' ', 1, 'Super Ball', ' ', ' ', 'Super Ball', 4]

const bySet = [...new Set(originalArray)]

const byFilter = originalArray.filter((item, index) => originalArray.indexOf(item) === index)

const byReduce = originalArray.reduce((unique, item) => unique.includes(item) ? unique : [...unique, item], [])

使用Setまず見てみます.Set一体何ですか?Setオブジェクトは、元の値または対象の参照にかかわらず、任意のタイプの一意の値を格納することができます.
https://developer.mozilla.org...

まず、Set中には唯一の値しか認められていない

一意性は、元の値または対象に対して参照

Setこの部分の動作を分割してみます.

const originalArray = [1, 2, ' ', 1, 'Super Ball', ' ', ' ', 'Super Ball', 4]

const uniqueSet = new Set(originalArray)
//    Set(5) [ 1, 2, " ", "Super Ball", 4 ]

const bySet = [...uniqueSet]
//    Array(5) [ 1, 2, " ", "Super Ball", 4 ]

const bySet = [...new Set(originalArray)]Setに変更した場合にも使用可能Array.
使用Array.from(set)理解Array.prototype.filter方法はなぜ重いのか、もう一つの方法filterindexOf方法は配列に戻り、与えられた要素の最初のインデックスが見つかります.存在しない場合は、戻ります.indexOf()https://developer.mozilla.org...

const beasts = ['ant', 'bison', 'camel', 'duck', 'bison'];

console.log(beasts.indexOf('bison'));
// expected output: 1

// start from index 2
console.log(beasts.indexOf('bison', 2));
// expected output: 4

console.log(beasts.indexOf('giraffe'));
// expected output: -1

-1方法は、提供された関数によって実現されるテストのすべての要素を含む新しい配列を作成する.
https://developer.mozilla.org... filter()方法は2つのパラメータを受け入れる:

1つ目のパラメータ:1つのコールバック関数、filterデータのそれぞれをこの関数に渡し、その関数が真の値に戻るとデータが保存され、偽の値に戻ると、データは新たに生成されたデータには現れない

2番目のパラメータ:コールバック関数filterの指向

上記のように重量除去の方法を下記のように書き直したら、全体thisの実行過程がよく分かります.

const originalArray = [1, 2, ' ', 1, 'Super Ball', ' ', ' ', 'Super Ball', 4]

const table = []

const byFilter = originalArray.filter((item, index) => {
  //               ，     
  const shouldKeep = originalArray.indexOf(item) === index
  table.push({
      : index,
     : item,
          : shouldKeep ? '  ' : '  '
  })
  return shouldKeep
})

console.log(byFilter)
console.table(table)

番号付け
値
保留するべきですか
を選択します.
0
1
保留
初登場
1
2
保留
初登場
2
メー
保存
初登場
3
1
削除
二回目の出現
4
スーパーボール
保留
初登場
5
メー
削除
二回目の出現
6
メー
削除
三度目の出現
7
スーパーボール
削除
二回目の出現
8
4
保留
初登場
使用filterArray.prototype.reduce配列の各要素に対して、方法が提供されるreduce()関数(昇順実行)は、その結果を単一の戻り値にまとめます.
https://developer.mozilla.org... reducer方法は2つのパラメータを受け入れる:

Array.prototype.reduce:コールバック関数は、4つのパラメータを受け取ることができます.

Callback:積算器は、実は多くの人が見落としている点です.つまり、積算器はどんな種類のデータでもいいです.

Accumulator:現在値

Current Value:現在値の索引

Current Index:ソース配列

Source Array:積算器の初期値は積算器と同じで、このパラメータも常に圧倒的多数の人に無視されている

Initial Valueチャプタのように、私達は見に来ました.filter実行過程:

const originalArray = [1, 2, ' ', 1, 'Super Ball', ' ', ' ', 'Super Ball', 4]

const byReduce = originalArray.reduce((unique, item, index, source) => {
  const exist = unique.includes(item)
  const next = unique.includes(item) ? unique : [...unique, item]
  console.group(`    ${index}   `)
  console.log('     ：', unique)
  console.log('   ：', item)
  console.log('         ？', exist)
  console.log('  ', next)
  console.groupEnd()
  return next
}, [])