2017-02-14 11 views
2

.map()を使用して配列内のオブジェクトにプロパティを条件付きで追加しようとしていますが、何か不足しているようです。私のオブジェクトの配列は、マップの完成後も変更されません。これらのすべては、ESLintエラー 'no-param-reassign'を解決しようとした結果、なぜこれを行うのかを理解するのに役立ちます。.map()を使用して配列に存在するオブジェクトに新しいプロパティを追加する

私はここで達成しようとしているものの基本的な例を作成しました:jsfiddle

var aList = [{ 
    Title: "Enders Game", 
    Rating: 8 
    }, 
    { 
    Title: "Harry Potter", 
    Rating: 10 
    }]; 

console.log('before', aList); 

aList.map(function(book) { 
    if(book.Title == "Enders Game"){ 
    console.log({ ...book, completed: true }) 
    return { ...book, completed: true }; 
    } 
    console.log({ ...book, completed: false }) 
    return { ...book, completed: false }; 
}); 

console.log('after', aList); 
+3

'.MAP()'原を変異ありません。これは新しいArrayを作成します。これは 'var newMap = aList.map(...' –

答えて

4

あなたがArray#mapの結果を使用していないので、あなたは、Array#forEachを使用することができます。すべての新しいアレイの場合

var aList = [{ Title: "Enders Game", Rating: 8 }, { Title: "Harry Potter", Rating: 10 }]; 
 

 
aList.forEach(function(book) { 
 
    book.completed = book.Title == "Enders Game"; 
 
}); 
 

 
console.log(aList);
.as-console-wrapper { max-height: 100% !important; top: 0; }

、あなたは Array#map使用それの結果を使用することができます。オブジェクトに新しいプロパティを追加するには、 Object.assignを使用します。このメソッドは、最初のパラメータでオブジェクトを変更して返します。

var aList = [{ Title: "Enders Game", Rating: 8 }, { Title: "Harry Potter", Rating: 10 }], 
 
    newList = aList.map(book => Object.assign({}, book, {completed: book.Title == "Enders Game"})); 
 

 
console.log(aList); 
 
console.log(newList);
.as-console-wrapper { max-height: 100% !important; top: 0; }

関連する問題