reduce（）メソッドでインデックスが予期せず動作することがあるのはなぜですか？

Question

私は.reduce()を試しています。下のテストコードでは、accumulator.key[index]に値1を設定しようとしています。console.logを使用すると、インデックスは0から3まで正しく循環しています。ただし、コードではaccumulator.key[3]に値1.最初の3つはaccumulator.key[index]未定義として残します。これは私には完全に不愉快です。私は4つのキーすべてを1に設定しない理由がわかりません。何か助けてくれてありがとう！

"use strict"; 
 

 
var testArray = ['fe', 'fi', 'fo', 'fum']; 
 
var output; 
 
\t 
 
output = testArray.reduce((accumulator, currentValue, index) => { 
 
    accumulator.key = []; 
 
    console.log(index); 
 
    accumulator.key[index] = 1; 
 
    return accumulator; 
 
}, []); 
 

 
console.log(output.key);

Answer 1

あなたのすべての反復でこの文accumulator.key = []と、前の配列参照を削除しkeyプロパティ新しい[]に割り当てます。配列の代わりにオブジェクトを渡し、配列としてkeyプロパティを定義します。

var testArray = ['fe', 'fi', 'fo', 'fum']; 
 
var output; 
 
\t 
 
output = testArray.reduce((accumulator, currentValue, index) => { 
 
    console.log(index); 
 
    accumulator.key[index] = 1; 
 
    return accumulator; 
 
}, { key: [] }); 
 

 
console.log(output.key);

Answer 2

は、私は、アレイ上.keyを使用するようにユースケースについてはよく分からないですが、それはあなたが決めたものであれば、単に各反復上のアレイにそれを初期化しないでください。そして、最初の反復で未定義を得ることを恐れている場合は、代替の空の配列を使用します。

accumulator.key = (accumulator.key || []); 

"use strict"; 
 

 
var testArray = ['fe', 'fi', 'fo', 'fum']; 
 
var output; 
 
\t 
 
output = testArray.reduce((accumulator, currentValue, index) => { 
 
    accumulator.key = (accumulator.key || []); 
 
    console.log(index); 
 
    accumulator.key[index] = 1; 
 
    return accumulator; 
 
}, []); 
 

 
console.log(output.key);