2016-11-10 5 views
4

私はここで何かを見逃しているかもしれませんが、誰かが壊れてしまうかもしれません。なぜArray.from({length: 5}, (v, k) => k)[0, 1, 2, 3, 4]を返しますか?`Array.from({length:5}、(v、k)=> k)`はどのように動作しますか?

https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/from

これは

+0

あなたはmdnのリンク全体を読んでいますか? – zzzzBov

+0

あなたが提供したリンクはこれを説明しています! –

+0

* Array.from()を使用すると、配列のようなオブジェクト(長さプロパティとインデックス付き要素を持つオブジェクト)*および* mapFnから配列を作成できます。配列のすべての要素を呼び出すマップ関数* – Li357

答えて

6

に動作しますなぜ私はJavascriptがduck-typingを使用して詳細に理解していませんでした。つまり、タイプbarであるオブジェクトからメソッドfooを呼び出すと、このオブジェクトが実際にbarかどうかはチェックされませんが、メソッドfooがあるかどうかがチェックされます。

まとめると:

let fakeArray = {length:5}; 
fakeArray.length //5 
let realArray = [1,2,3,4,5]; 
realArray.length //5 

まず一つは(プロパティlengthを持っている) "フェイク" javascript配列のようなものです。 Array.fromがプロパティーlengthをチェックすると、5が返され、長さ5の実数配列が作成されます。 fakeArrayオブジェクト「arrayLike」を呼び出すことができます。

2番目の部分は、配列の値にインデックス(第2引数)を設定する単なるlambaです。

このテクニックは、テスト用オブジェクトをモックするのに非常に便利です。たとえば:

let ourFileReader = {} 
ourFileReader.result = "someResult" 
//ourFileReader will mock real FileReader 
+1

ありがとう、これは私が探していた答えのようなものです。以前はアヒルのタイプを知らなかった。確かに私の質問はうまく表現されていませんでした。 –

3

var arr1 = Array.from({ 
 
    length: 5 // Create 5 indexes with undefined values 
 
    }, 
 
    function(v, k) { // Run a map function on said indexes using v(alue)[undefined] and k(ey)[0 to 4] 
 
    return k; // Return k(ey) as value for this index 
 
    } 
 
); 
 
console.log(arr1);

+0

'Array.from'のように見えますが、暗黙的な' Array.prototype.fill() 'を呼び出すか、他の魔法もします。なぜなら、 'var arr = [];のような疎な配列を作成すればよいからです。 arr.length = 5; '(理論上の)未定義の値が5つあっても、その配列をマップすることはできませんでした。 – jAndy

2

array.fromについてdeveloper.mozilla.orgページで、誰もが「mapFnは」examle vとkに対して、2つの引数を取ることができることを教えていない:vは現在の要素の値であり、kはインデックスであり、要素の。だからここには取り引きがある。

{length:5}長さが5のオブジェクトを作成します。

(k、k)=> kは、現在の要素のインデックス番号をその要素値に割り当てる矢印関数です。

関連する問題