Vuejs对象常用操作之取对应的值、取key和value值、转数组及合并等
更新时间：2024年01月03日 16:43:36 作者：你好，打工人
最近在学Vue和javascript感觉js的好多方法都不太清楚,这里彻底总结下,这篇文章主要给大家介绍了关于Vuejs对象常用操作之取对应的值、取key和value值、转数组及合并等的相关资料,需要的朋友可以参考下
1. 取得某一个属性的值
let obj = {'name':'lxc','age':26}方法一：点号操作符 obj.name
方法二：方括号操作符：obj[name]
方法三：解构赋值 let {name} = obj
...
2.取得对象的key和value值
let obj = {'name':'lxc','age':26}取Object key值
方法一：Object.keys(obj) //['name','age'] 返回一个字符串数组
方法二：for in
for(let i in obj){
console.log(i); //name,age
}
...Object value值
方法一：Object.value(obj) //['lxc',26] 返回一个字符串数组
方法二：for in
for(let i in obj){
console.log(obj[i]); //lxc,26
}方法三：map
Object.keys(obj).map((key)=>{ console.log(obj[key])}) //lxc,263.对象合并(会将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.对象转为数组
方法一：只需要对象的key或value转化为数组
通过上面的Object.key、value等方法实现
方法二：通过for in 整理成想要的数组
方法三：object.entries
总结
到此这篇关于Vuejs对象常用操作之取对应的值、取key和value值、转数组及合并等的文章就介绍到这了,更多相关Vuejs对象常用操作内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！
相关文章
这篇文章主要介绍了Vuex 使用及简单实例(计数器)，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2018-08-08
VUE 直接通过JS 修改html对象的值导致没有更新到数据中解决方法分析
这篇文章主要介绍了VUE 直接通过JS 修改html对象的值导致没有更新到数据中解决方法,结合实例形式详细分析了VUE使用JS修改html对象的值导致没有更新到数据的原因与解决方法,需要的朋友可以参考下2019-12-12
这篇文章主要介绍了自定义input组件如何实现拖拽文件上传问题，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2023-03-03
在Vue框架中,组件间的通信是一个常见的需求,特别是在子组件需要向父组件传递多个参数时,合理的通信方式可以显著提升代码的可读性和可维护性,本文将详细介绍如何在Vue中实现子组件向父组件传递多个参数,需要的朋友可以参考下2024-10-10
这篇文章主要介绍了vue arco.design锚点Anchor使用方式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教2024-04-04
这篇文章主要介绍了vue框架和react框架的区别以及各自的应用场景使用，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-10-10
Vue基本用法很容易上手,但是有很多优化的写法你就不一定知道了,下面这篇文章主要给大家介绍了关于程序员应该知道的vuex冷门小技巧的相关资料,需要的朋友可以参考下2022-05-05
这篇文章主要介绍了Vue3中的h函数及使用小结,本文通过实例代码给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下2023-03-03
开发中遇到bug是在正常不过了,而程序也基本都是bug堆里爬出来的,对于程序员来说bug调试也是自己工作的重要组成部分,下面这篇文章主要给大家介绍了关于Vue环境搭建报错整理的相关资料,需要的朋友可以参考下2022-08-08
在后台使用过程中经常会因为按钮重复点击,而造成发送多次重复请求 以下方法可以避免这种情况,下面这篇文章主要给大家介绍了关于vue中如何防止用户频繁点击按钮的相关资料,需要的朋友可以参考下2022-09-09
最新评论