Javascript中Object和Map之間的轉(zhuǎn)換方法
簡(jiǎn)單的區(qū)分Map和Object
Map是ES6退出的一個(gè)類型,特點(diǎn):任何值都可作為屬性名
Object特點(diǎn):屬性名只能是字符串(一開始我也不信,測(cè)試后才發(fā)現(xiàn)的)
代碼

圖片

創(chuàng)建一個(gè)map類型
new Map([ [key, value], [key1, value1] ])
簡(jiǎn)單的介紹下面兩個(gè)方法
- Object.entries()方法返回一個(gè)數(shù)組,成員是參數(shù)對(duì)象自身的(不含繼承的)所有可遍歷(enumerable)屬性的鍵值對(duì)數(shù)組。
- Object.fromEntries()方法是Object.entries()的逆操作,用于將一個(gè)鍵值對(duì)數(shù)組轉(zhuǎn)為對(duì)象。
Object類型 轉(zhuǎn) Map類型
這里主要用到了Object.entries的特性,
Object.entries 返回一個(gè)二維數(shù)組,其中數(shù)組中的第一個(gè)值是key,第二個(gè)值是value
const obj = {
a: '我是obj.a',
b: '我是obj.b',
c: '我是obj.c',
}
console.log(obj)
const map = new Map(Object.entries(obj))
console.log(map)
console.log(map.get('a'), '我是map 屬性名')
console.log(map.get('b'), '我是map 屬性名')
Map類型轉(zhuǎn)Object類型
const arr = [1, 2, 3],
obj = { a: '1', b: 2 },
number = 22
const map = new Map()
map.set(arr, '我是map的第1個(gè)值,我是數(shù)組')
map.set(obj, '我是map的第2個(gè)值,我是對(duì)象')
map.set(number, '我是map的第3個(gè)值, 我是簡(jiǎn)單數(shù)據(jù)類型')
const newObj = Object.fromEntries(map.entries())
console.log(newObj, '我是新對(duì)象')
console.log('新對(duì)象類型', typeof newObj)
總結(jié)
到此這篇關(guān)于Javascript中Object和Map之間的轉(zhuǎn)換方法的文章就介紹到這了,更多相關(guān)js Object和Map轉(zhuǎn)換內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
- JavaScript中利用Array和Object實(shí)現(xiàn)Map的方法
- Springboot通過ObjectMapper配置json序列化詳解
- 使用ObjectMapper把Json轉(zhuǎn)換為復(fù)雜的實(shí)體類
- JavaScript中Object、map、weakmap的區(qū)別分析
- JavaScript 中有了Object 為什么還需要 Map 呢
- JavaScript?Map?和?Object?的區(qū)別解析
- JavaScript中Map與Object應(yīng)用場(chǎng)景
- JS中Map、WeakMap和Object的區(qū)別解析
- 面試常考:js中 Map和 Object 的區(qū)別小結(jié)
相關(guān)文章
javascript實(shí)現(xiàn)數(shù)獨(dú)解法
數(shù)獨(dú)(すうどく,Sūdoku)是一種運(yùn)用紙、筆進(jìn)行演算的邏輯游戲。玩家需要根據(jù)9×9盤面上的已知數(shù)字,推理出所有剩余空格的數(shù)字,并滿足每一行、每一列、每一個(gè)粗線宮內(nèi)的數(shù)字均含1-9,不重復(fù)。2015-03-03
javascript中的toFixed固定小數(shù)位數(shù) 簡(jiǎn)單實(shí)例分享
這篇文章介紹了toFixed固定小數(shù)位數(shù)的簡(jiǎn)單例子,有需要的朋友可以參考一下2013-07-07
Uniapp?實(shí)現(xiàn)全民分銷功能原理解析
這篇文章主要介紹了Uniapp?實(shí)現(xiàn)全民分銷功能,本篇文章主要介紹全民分銷功能實(shí)現(xiàn)原理,本文給大家介紹的非常詳細(xì),需要的朋友可以參考下2022-06-06
webpack自動(dòng)化打包webpack-dev-server的實(shí)現(xiàn)
我們每次改完要打包的資源文件,和配置文件都是是輸入npx webpack命令手動(dòng)打包的,本文就來介紹一下webpack自動(dòng)化打包webpack-dev-server的實(shí)現(xiàn),具有一定的參考價(jià)值,感興趣的可以了解一下2023-07-07
JS中type="button"和type="submit"的區(qū)別
Submit是專門用于提交表單的Button,與Button的區(qū)別主要有兩點(diǎn):type=button 就單純是按鈕功能,type=submit 是發(fā)送表單 。下面通過本文給大家分享JS中type="button"和type="submit"的區(qū)別,感興趣的的朋友一起看看吧2017-07-07
JavaScript中for循環(huán)的幾種寫法與效率總結(jié)
每個(gè)接觸JS的開發(fā)人員都不可避免的與for循環(huán)打交道,畢竟這是遍歷必不可少的工具之一。然而當(dāng)循環(huán)次數(shù)比較大時(shí),效率問題必須重視。下面這篇文章就主要介紹了JavaScript中幾種for循環(huán)的寫法與效率,需要的朋友可以參考借鑒,下面來一起看看吧。2017-02-02
判斷滾動(dòng)條滑到底部觸發(fā)事件(實(shí)例講解)
下面小編就為大家?guī)硪黄袛酀L動(dòng)條滑到底部觸發(fā)事件的實(shí)例講解。具有很好的參考價(jià)值。一起跟隨小編過來看看吧,希望對(duì)大家有所幫助2017-11-11

