脚本之家 服务器常用软件
快捷导航
您的位置：首页 → 网络编程 → JavaScript → javascript技巧 → js Object和Map转换

Javascript中Object和Map之间的转换方法

 更新时间：2023年06月21日 08:46:50   作者：tookingHome  
在许多编程语言中,Object和Map都是用于存储键值对的数据结构,下面这篇文章主要给大家介绍了关于Javascript中Object和Map之间的转换方法,文中通过实例代码介绍的非常详细,需要的朋友可以参考下

简单的区分Map和Object

Map是ES6退出的一个类型，特点：任何值都可作为属性名

Object特点：属性名只能是字符串(一开始我也不信，测试后才发现的)

代码

Object 属性名只能是string类型 代码

图片

创建一个map类型

new Map([
	[key, value],
	[key1, value1]
])

简单的介绍下面两个方法

Object类型 转 Map类型

这里主要用到了Object.entries的特性，
Object.entries 返回一个二维数组，其中数组中的第一个值是key，第二个值是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类型转Object类型

const arr = [1, 2, 3],
  obj = { a: '1', b: 2 },
  number = 22
const map = new Map()
map.set(arr, '我是map的第1个值，我是数组')
map.set(obj, '我是map的第2个值，我是对象')
map.set(number, '我是map的第3个值, 我是简单数据类型')
const newObj = Object.fromEntries(map.entries())
console.log(newObj, '我是新对象')
console.log('新对象类型', typeof newObj)

总结

到此这篇关于Javascript中Object和Map之间的转换方法的文章就介绍到这了,更多相关js Object和Map转换内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！

您可能感兴趣的文章:

相关文章

  • javascript实现数独解法

    javascript实现数独解法

    数独（すうどく，Sūdoku）是一种运用纸、笔进行演算的逻辑游戏。玩家需要根据9×9盘面上的已知数字，推理出所有剩余空格的数字，并满足每一行、每一列、每一个粗线宫内的数字均含1-9，不重复。
    2015-03-03
  • JavaScript表格常用操作方法汇总

    JavaScript表格常用操作方法汇总

    这篇文章主要介绍了JavaScript表格常用操作方法,实例汇总了javascript中表格操作的创建、添加、删除、遍历等常用操作技巧,具有一定参考借鉴价值,需要的朋友可以参考下
    2015-04-04
  • javascript中的toFixed固定小数位数 简单实例分享

    javascript中的toFixed固定小数位数 简单实例分享

    这篇文章介绍了toFixed固定小数位数的简单例子，有需要的朋友可以参考一下
    2013-07-07
  • JS组件系列之MVVM组件构建自己的Vue组件

    JS组件系列之MVVM组件构建自己的Vue组件

    这篇文章主要介绍了JS组件系列之MVVM组件构建自己的Vue组件,需要的朋友可以参考下
    2017-04-04
  • Uniapp 实现全民分销功能原理解析

    Uniapp 实现全民分销功能原理解析

    这篇文章主要介绍了Uniapp 实现全民分销功能,本篇文章主要介绍全民分销功能实现原理，本文给大家介绍的非常详细，需要的朋友可以参考下
    2022-06-06
  • JavaScript 中的行继续符操作

    JavaScript 中的行继续符操作

    JavaScript 中的字符串操作可能很复杂， 尽管字符串操作易于掌握，但实施起来却具有挑战性，其中一个相关领域是添加新行，这篇文章主要介绍了JavaScript中的行继续符操作,需要的朋友可以参考下
    2023-06-06
  • webpack自动化打包webpack-dev-server的实现

    webpack自动化打包webpack-dev-server的实现

    我们每次改完要打包的资源文件，和配置文件都是是输入npx webpack命令手动打包的，本文就来介绍一下webpack自动化打包webpack-dev-server的实现，具有一定的参考价值，感兴趣的可以了解一下
    2023-07-07
  • JS中type=

    JS中type="button"和type="submit"的区别

    Submit是专门用于提交表单的Button，与Button的区别主要有两点：type=button 就单纯是按钮功能，type=submit 是发送表单 。下面通过本文给大家分享JS中type="button"和type="submit"的区别，感兴趣的的朋友一起看看吧
    2017-07-07
  • JavaScript中for循环的几种写法与效率总结

    JavaScript中for循环的几种写法与效率总结

    每个接触JS的开发人员都不可避免的与for循环打交道，毕竟这是遍历必不可少的工具之一。然而当循环次数比较大时，效率问题必须重视。下面这篇文章就主要介绍了JavaScript中几种for循环的写法与效率,需要的朋友可以参考借鉴，下面来一起看看吧。
    2017-02-02
  • 判断滚动条滑到底部触发事件(实例讲解)

    判断滚动条滑到底部触发事件(实例讲解)

    下面小编就为大家带来一篇判断滚动条滑到底部触发事件的实例讲解。具有很好的参考价值。一起跟随小编过来看看吧，希望对大家有所帮助
    2017-11-11

最新评论