面接官はあなたのシリーズを「笑わせる」ことができます:配列はあなたを重くして何種類ができますか?


前言


配列の重さはありふれた話題であり、先端の子供靴が面接時の高周波問題でもある.本文は配列の重み付けの原理と実現を深く探求して、各位の小さい仲間のために “ ”面接官の解決策を提供することができます.
あまり話さないで、上がったらシャトルが...

アレイデマンドコアの原理


100 Wのコア原理であげました...、メモを残してアヒルをほめてください.
  • 一般的には、重複しない要素(配列要素格納またはオブジェクトのキーで格納)を格納する一時変数tmpを作成します.
  • は、重さを除去する配列arrを遍歴し、tmpにその要素が含まれているかどうかを順次判断する.
  • tmpにこの要素が存在しない場合、入れる.そうでなければスキップして処理しません.

  • 基本的にどのような実現でも、その核心はそうである(存在するか否かを判断する).いいえ、伝言を残してください.私たちはできます.battle

    古典的な重み付け案1:


    tmpをオブジェクトとして設定し、オブジェクトのキーは配列要素の値を格納し、最終的にオブジェクトのすべてのキーを返します.
    function array_unique (arr) {
      if (arr.length === 0) {
        return arr
      }
      let tmp = {}
      let len = arr.length
      for (let i = 0; i < len; i++) {
        if (tmp[arr[i]] === undefined) {
          tmp[arr[i]] = i
        }
      }
      return Object.keys(tmp)
    }
    
    //       
    let arr = [1, 2, 3, 1, 2]
    let newArr = array_unique(arr)
    console.log(newArr) // ['1', '2', '3']

    もしあなたがこのような方法で面接官に答えるならば、あなたは彼の心の中で早く設けた罠に陥りました:
  • 数字と文字列を区別できますか?undefined'undefined'を区別できますか?
  • 現在返されているデータ型は、元のデータ型と一致していますか?

  • 面接官の疑問を持って、もう一つの古典的な方法を見てみましょう.

    クラシックな重量除去方法2:


    tmpを配列に設定し、配列に一意の要素を格納し、最終的にtmpを返します.
    function array_unique (arr) {
      let len = arr.length
      if (!len) {
        return []
      }
      let tmp = []
      for (let i = 0; i < len; i++) {
        //     arr        tmp 
        if (tmp.indexOf(arr[i]) === -1) {
          tmp.push(arr[i])
        }
      }
      return tmp
    }
    let arr = [1, 2, 3, '1', 2, undefined, undefined, 'undefined']
    let newArr = array_unique(arr)
    console.log(newArr) // [1, 2, 3, '1', undefined, 'undefined']

    今、心が喜ぶかどうか!
    But、そう考えると、面接官のもう一つの罠に陥ります.
  • NaNをスクリーニングできますか?

  • はい、面接官が一番大きいので、考えてみましょう.

    配列の重量除去方式3:


    原理は同じ重さ除去方式の2つですが、ES 6を使っています.includes置換indexOfメソッド、
    includes()メソッドは、配列に要素が含まれているかどうかを判断し、戻りtrueが含まれている場合はfalseを返します.
    そうなんだよ!
    function array_unique (arr) {
      let len = arr.length
      if (!len) {
        return []
      }
      let tmp = []
      for (let i = 0; i < len; i++) {
        //     arr        tmp 
        if (!tmp.includes(arr[i]) {
          tmp.push(arr[i])
        }
      }
      return tmp
    }
    let arr = [1, 2, 3, '1', 2, undefined, undefined,  'undefined', NaN, NaN]
    let newArr = array_unique(arr)
    console.log(newArr) // [1, 2, 3, '1', undefined, 'undefined', NaN]

    今、终わりだと思ってるの?いいえ、あり得ません.
    面接官の穴はもう前で待っていました.
  • あなたのこのフィルタリング方式は対象を区別できますか?例えば{},{a:1}
  • 自分の40メートルのナイフを出したいかどうか、neng 面接官!(図は似合わないから、自分で頭を補おう...)でも、何もできないから、考え続けよう...

    配列の重量除去方法4:


    原理と同じように、配列に要素が含まれているかどうかを判断する方法を変え続けます.`findIndex findIndexは、配列に要素が含まれているかどうかをクエリーします.返される要素のインデックスがある場合は、-1を返します.indexOfよりも先進的な場所は、callbackに転送され、約束通りに検索できることです.
    function array_unique (arr) {
      let len = arr.length
      if (!len) {
        return []
      }
      let tmp = []
      for (let i = 0; i < len; i++) {
        //     arr        tmp 
        if (tmp.findIndex((v) => JSON.stringify(v) === JSON.stringify(arr[i])) === -1) {
          tmp.push(arr[i])
        }
      }
      return tmp
    }
    let arr = [1, 2, 3, '1', 2, undefined, undefined,  'undefined', NaN, NaN, {}, {}, {a: 1}, {a: 1}]
    let newArr = array_unique(arr)
    console.log(newArr) // [1, 2, 3, '1', undefined, 'undefined', NaN, {}, {a: 1}]

    やっと成功した!さあ、面接官に「まだ質問はありますか?」とスマートに聞くことができます.
    もちろん、面接官を挑発するのは、リスクを負うことですよ.まばたきをしたときに、右目をまばたきして切られる可能性があります.

    配列に要素が含まれているかどうかを判断する方法:


    いくつかの方法の役割を区別するために、表を並べてあげましょう.
    メソッドが検出可能かどうか
    null
    undefined
    NaN
    {}
    コメント
    indexOf
    はい
    はい
    いいえ
    いいえ
    なし
    includes
    はい
    はい
    はい
    いいえ
    なし
    findIndex
    はい
    はい
    はい
    はい
    特定のcallbackに転送する必要があります

    小結


    配列はこの面接問題を重くして、考察の知識点はまだとても多いです.まず、配列の一般的な方法についてよく知っておく必要があります.また、NaNとNaNが等しくない、{}と{}が等しくないなどの知識点や、柔軟で変化の多い思考論理もあります.
    もちろん、配列を重くするには他にも多くの実現方法があります.皆さんのメッセージ交流を歓迎します.

    後記


    以上是胡哥今日皆さん分享的内容,喜欢的小伙伴记得 , 哦,关注胡哥说,学习前端不迷道,欢迎多多留言交流...
    胡兄は言うことがあって、1つの技術があって、気持ちの胡兄があります!現在、京東の先端で城を攻めるライオンが1枚いる.
    胡兄は、大フロントエンド技術分野に専念し、フロントエンドシステムアーキテクチャ、フレームワーク実現原理、最新の最も効率的な技術実践を共有すると述べた.