Vue中对象如何新增、修改、删除、筛选属性key值

1、新增属性以及修改value值
方法：this.$set(this.obj,‘key’,value)
或
var vm = new Vue({…})
vm.set(this.obj, “key”, value)

var demo={a:"1",b:"2"}
this.$set(demo,"c","3")
console.log(demo)//{a:"1",b:"2",c:"3"}
//如果对象中存在该key值，那么就不是新增属性，而是修改该key值的value值
this.$set(demo,"c","4")
console.log(demo)//{a:"1",b:"2",c:"4"}
//扩展数组的
this.$set(arr, index,  value)
或者
var vm = new Vue({..})
vm.set(arr, index, value)
案例：
var a=["1","2","3"]
this.$set(a,2,"4")
console.log(a)//["1","2","4"]
this.$set(a,3,"5")
console.log(a)//["1","2","4","5"]

2、修改属性key值

//案例：把selected改为checkAll
var demo={selected:false}
// 复制原来的值
demo['checkAll'] = demo[ 'selected' ]
//删除原来的key
this.$delete(demo,'selected')
console.log(demo)//{checkAll:false}

3、删除属性
this.$delete(obj,‘key’)

//案例 删除属性name
var data = {name: 'xxx', status: 0}
this.$delete(data,'name')
console.log(data)//{status:0}

4、筛选属性
Object.keys() 返回一个表示给定对象的所有可枚举属性的字符串数组

var obj = { foo: 'bar', baz: 42 };
console.log(Object.keys(obj)); // ['foo', 'baz']

//案例：筛选出对象的第一个属性
var list = [
	{ melonbody: 8.4, strName: '损伤程度', level: '一等品' },
	{ colorvalue: 8.42, strName: '颜色', level: '一等品' },
	{ diameter: 8.4, strName: '直径', level: '一等品' },
	{ melonbody: 6.41, strName: '损伤程度', level: '二等品' },
	{ colorvalue: 6.4, strName: '颜色', level: '二等品' },
	{ diameter: 6.42, strName: '直径', level: '二等品' },
	{ melonbody: 4.41, strName: '损伤程度', level: '三等品' },
	{ colorvalue: 4.41, strName: '颜色', level: '三等品' },
	{ diameter: 4.42, strName: '直径', level: '三等品' }
];
var demo2=[]
for (var i in list){
	demo2.push(Object.keys(list[i]))
}
var demo3 = []
for(var i in demo2){
	demo3.push(demo2[i][0])
}
var demo4=[...new Set(demo3)]			
console.log(demo4)//['melonbody','colorvalue','diameter']

方法有很多，持续补充