近期項目總結-2020/6

數組對比

最近項目中涉及到了一個功能，需要將一個新數組和一箇舊數組進行對比，找出新數組相對於就數組刪除和新增了那些數據，思考了一下，覺得下面這麼寫代碼會比較簡潔，效率也比兩個for循環來的稍微好一點：

const oldList = [{id:1}, {id: 2}, {id:3}, {id:4}]
const newList = [{id:1}, {id: 2}, {id:5}, {id:6}] //新增了5、6，刪除了3、4
let oldArr = oldList.map(e => e.id)
let newArr = newList.map(e => e.id)
//過濾出新增了哪些數據
let addArr = newArr.filter(i => {
    return oldIdArr.indexOf(i) === -1
}) //addArr = [5,6]
//過濾出刪除了哪些數據
let delArr = oldArr.filter(i => {
   return newArr.indexOf(i) === -1
}) //delArr = [3, 4]

表格樣式

項目裏UI大開腦洞，將表格樣式改的相當之精彩，在修改表格樣式過程中發現，margin屬性對tr、th都沒有效果，瞭解了下表格的屬性才知道，可以在table、thead、tbody標籤下添加：

border-collapse: separate;
border-spacing: 0px 16px;

這樣每個tr標籤之間的間隔就是16px了。