2017-02-14 16 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()'不发生变异原。它创建一个新的数组,返回,所以'var newMap = aList.map(...' – 2017-02-14 18:07:03

回答

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; }