object.entries()
转换一个objec为array。但是,如果你想做相反的事情怎么办?不用再想了!使用Object.fromEntries()
来把array转换为object?。
constkeyValuePair=[['cow','?'],['pig','?'],];Object.fromEntries(keyValuePair);//{cow:'?',pig:'?'}
Object.fromEntries我们先指出对象的解剖方法,对象是有一个键和一个值的东西。
constobject={key:'value',};
如果我们想将某物转换为对象,我们需要传递具有这两个要求的东西:key
和value
。
满足这些要求的参数有两种:
- 具有嵌套键值对的数组
- Map对象
这是带有键值对的嵌套数组
constnestedArray=[['key1','value1'],['key2','value2'],];
当我们将Object.fromEntries
应用于它时,我们可以从中获取对象。
Object.fromEntries(nestedArray);//{key1:"value1",key2:"value2"}
用Object.fromEntries将Map转为对象JavaScriptES6为我们带来了一个名为map的新对象,它与对象非常相似。
让我们创建新的Map对象
//使用构造函数constmap=newMap([['key1','value1'],['key2','value2'],]);//或者我们可以使用实例方法,"set"constmap=newMap();map.set('key1','value1');map.set('key2','value2');//结果//Map(2){"key1"=>"value1","key2"=>"value2"}
现在,我们使用Object.fromEntries
将Map转换为对象
Object.fromEntries(map);//{key1:"value1",key2:"value2"}
Object.fromEntries与其他类型的类型错误当你试图将其他数据类型传递到Object.fromEntries
时,请小心,所有这些都会抛出一个错误?
确保只传递键值对?
Object.fromEntriesvsObject.entriesObject.fromEntries
与Object.entries
的效果相反。所以Object.entries
将转换我们的数组并返回一个新的嵌套的键值对数组。而Object.fromEntries
将把这个数组转回一个对象。
constobject={key1:'value1',key2:'value2'};constarray=Object.entries(object);//[["key1","value1"],["key2","value2"]]Object.fromEntries(array);//{key1:'value1',key2:'value2'}
Object到Object的转换如果你阅读了原始的TC39提案,这就是引入此新方法的原因。随着Object.entries
的引入,没有一种简单的方法可以将结果转换回对象。
通常,当我们选择使用Object.entries
时,是因为它使我们可以访问许多漂亮的数组方法,例如filter
。但是在完成转换之后,我们有点被该数组所困扰。
constfood={meat:'?',broccoli:'?',carrot:'?'};//?StuckinArraylandconstvegetarian=Object.entries(food).filter(([key,value])=>key!=='meat',);//[["broccoli","?"],["carrot","?"]]
我们可以利用所有这些有用的数组方法,但仍然可以找回我们的对象,最后,从对象到对象的转换?。
constfood={meat:'?',broccoli:'?',carrot:'?'};//?Yay,stillinObjectlandconstvegetarian=Object.fromEntries(Object.entries(food).filter(([key,value])=>key!=='meat'),);//{broccoli:'?',carrot:'?'}
浏览器支持除了InternetExplorer,大多数主流浏览器都支持此方法?。
本文首发于公众号《前端全栈开发者》ID:by-zhangbing-dev,第一时间阅读最新文章,会优先两天发表新文章。关注后私信回复:大礼包,送某网精品视频课程网盘资料,准能为你节省不少钱!