js中如何往對象中添加屬性
往對象中添加屬性
首先,定義一個要添加進去的屬性及屬性值;
let obj = {'a':123};
將要被添加的對象:
let obj1 = {'c':1,'d':2};
使用Object.assign()將兩個對象合并
let twoobj = Object.assign(obj1,obj); //兩個注意的點: //用一個新的名稱來接受Object.assign的值;不要用obj1來接受,會報錯 //第一個參數(shù)是原來的對象,第二個是要添加進去的對象;
給對象動態(tài)添加屬性的2種方法
需求
要給每個課程添加一個判斷鼠標是否hover
分析
因為數(shù)據(jù)是動態(tài)渲染的,所以需要動態(tài)的給他添加一個flag標記,就得在數(shù)據(jù)渲染之前先拿到,然后再添加一個自己需要的比如isHover屬性,然后就渲染處理之后的數(shù)據(jù),從而就能夠判斷是否顯示鼠標選中的效果。
下面是2中方法給對象動態(tài)添加屬性
for of
遍歷對象,得到對象for in
遍歷對象 ,得到對象的下標
補充:
this.videoList = [] const data = await this.$http.post('Course/shows', { type: nedCuriculums.type, grade: nedCuriculums.grade, classtype: nedCuriculums.classtype, subject: nedCuriculums.subject, term: term }).catch(err => err) this.term = term var videoList = data.data ----------------------------------------------------------- // 假如數(shù)據(jù)是這樣: videoList = [ { id: 1 type: "同步課程", grade: "一年級", classtype: "xxx", subject: "數(shù)學(xué)", term: "上" }, { id: 2 type: "同步課程", grade: "一年級", classtype: "xxx", subject: "數(shù)學(xué)", term: "上" } ]
// 第一種方法,給對象動態(tài)添加屬性 for of 根據(jù)對象 var newvideoList = {} for (var item of videoList) { newvideoList = { isHover: false, dirname: item.dirname, id: item.id, resourceId: item.resourceId } this.videoList.push(newvideoList) }
// 第2種方法 for in 根據(jù)下標 for (var index in videoList) { videoList[index].isHover = false this.videoList.push(videoList[index]) console.log(index) this.videoList.push(videoList[index]) }
以上為個人經(jīng)驗,希望能給大家一個參考,也希望大家多多支持腳本之家。
相關(guān)文章
JavaScript 阻止超鏈接跳轉(zhuǎn)的操作方法(多種寫法)
很多朋友問小編能否通過JavaScript來阻止超鏈接的跳轉(zhuǎn)呢,今天給大家通過多種寫法來實現(xiàn)這一功能,具體實例代碼跟隨小編一起看看吧2021-06-06使用JS在瀏覽器中判斷當前網(wǎng)絡(luò)連接狀態(tài)的幾種方法
本篇文章主要介紹了使用JS在瀏覽器中判斷當前網(wǎng)絡(luò)狀態(tài)的幾種方法,非常具有實用價值,需要的朋友可以參考下2017-05-05JavaScript中如何使用cookie實現(xiàn)記住密碼功能及cookie相關(guān)函數(shù)介紹
cookie是網(wǎng)站設(shè)計者放置在客戶端(瀏覽器)的小文本文件,cookie不僅能夠?qū)崿F(xiàn)保存密碼功能,還可以通過cookie保存最近瀏覽記錄增加用戶體驗。本文給大家介紹js使用cookie實現(xiàn)記住密碼功能及cookie相關(guān)函數(shù)講解,感興趣的朋友一起看看吧2016-11-11JavaScript函數(shù)式編程(Functional Programming)聲明式與命令式實例分析
這篇文章主要介紹了JavaScript函數(shù)式編程(Functional Programming)聲明式與命令式,結(jié)合實例形式分析了JS聲明式與命令式相關(guān)概念、原理、定義及使用方法,需要的朋友可以參考下2019-05-05用JS將搜索的關(guān)鍵字高亮顯示實現(xiàn)代碼
這篇文章介紹了JS將搜索的關(guān)鍵字高亮顯示實現(xiàn)代碼,有需要的朋友可以參考一下2013-11-11JavaScript使用replace函數(shù)替換字符串的方法
這篇文章主要介紹了JavaScript使用replace函數(shù)替換字符串的方法,涉及javascript中replace函數(shù)的使用技巧,非常具有實用價值,需要的朋友可以參考下2015-04-04使用typescript+webpack構(gòu)建一個js庫的示例詳解
這篇文章主要介紹了typescript+webpack構(gòu)建一個js庫,本文主要記錄使用typescript配合webpack打包一個javascript library的配置過程,需要的朋友可以參考下2022-07-07