Vuejs對象常用操作之取對應(yīng)的值、取key和value值、轉(zhuǎn)數(shù)組及合并等
1. 取得某一個屬性的值
let obj = {'name':'lxc','age':26}
方法一:點號操作符 obj.name
方法二:方括號操作符:obj[name]
方法三:解構(gòu)賦值 let {name} = obj
...
2.取得對象的key和value值
let obj = {'name':'lxc','age':26}
取Object key值
方法一:Object.keys(obj) //['name','age']
返回一個字符串數(shù)組
方法二:for in
for(let i in obj){ console.log(i); //name,age } ...
Object value值
方法一:Object.value(obj) //['lxc',26]
返回一個字符串數(shù)組
方法二:for in
for(let i in obj){ console.log(obj[i]); //lxc,26 }
方法三:map
Object.keys(obj).map((key)=>{ console.log(obj[key])}) //lxc,26
3.對象合并(會將key值相同的進行覆蓋去重操作)
方法一:Object.assign
const a = { a: 1, b: 4 } const b = { b: 2, c: 3 } console.log(Object.assign(a, b));
方法二:擴展運算符
console.log({ ...a, ...b });
注:展開運算符的只進行淺拷貝,不支持深拷貝。Object.assign()
方法會修改目標對象。如果不希望修改原對象,需要提供一個空對象作為目標對象。此外,Object.assign()
方法只能合并頂層的屬性,不支持遞歸地合并嵌套對象。
4.對象轉(zhuǎn)為數(shù)組
方法一:只需要對象的key或value轉(zhuǎn)化為數(shù)組
通過上面的Object.key、value等方法實現(xiàn)
方法二:通過for in 整理成想要的數(shù)組
方法三:object.entries
總結(jié)
到此這篇關(guān)于Vuejs對象常用操作之取對應(yīng)的值、取key和value值、轉(zhuǎn)數(shù)組及合并等的文章就介紹到這了,更多相關(guān)Vuejs對象常用操作內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
VUE 直接通過JS 修改html對象的值導(dǎo)致沒有更新到數(shù)據(jù)中解決方法分析
這篇文章主要介紹了VUE 直接通過JS 修改html對象的值導(dǎo)致沒有更新到數(shù)據(jù)中解決方法,結(jié)合實例形式詳細分析了VUE使用JS修改html對象的值導(dǎo)致沒有更新到數(shù)據(jù)的原因與解決方法,需要的朋友可以參考下2019-12-12Vue實現(xiàn)子組件向父組件傳遞多個參數(shù)的方法
在Vue框架中,組件間的通信是一個常見的需求,特別是在子組件需要向父組件傳遞多個參數(shù)時,合理的通信方式可以顯著提升代碼的可讀性和可維護性,本文將詳細介紹如何在Vue中實現(xiàn)子組件向父組件傳遞多個參數(shù),需要的朋友可以參考下2024-10-10vue框架和react框架的區(qū)別以及各自的應(yīng)用場景使用
這篇文章主要介紹了vue框架和react框架的區(qū)別以及各自的應(yīng)用場景使用,具有很好的參考價值,希望對大家有所幫助。如有錯誤或未考慮完全的地方,望不吝賜教2022-10-10