vue遍历对象的几种方式

在vue项目开发中,我们需要对对象进行处理等问题,这里简单记录遍历对象的几种方法

一、for in 这是遍历对象的基本方法,其中key代表键,值可以通过Object[key]进行获取,

let obj1 = {
				name: '张三',
				age: '18',
				height: '180'
			}
			for (let key in obj2) {
				console.log('key', key)
				console.log('value', obj1[key])
			}

衍生:obj2中部分key与obj1相同,这是需要将obj1与obj2中key相同的进行赋值,代码如下

let obj2 = {
				name: '',
				age: '',
			}
			let obj1 = {
				name: '张三',
				age: '18',
				height: '180'
			}
			for (let key in obj2) {
				obj2[key] = obj1[key]
			}
			console.log(obj2)

二、Object.keys(),ES5新增的对象方法,该方法会返回自身属性名组成的数组

let obj1 = {
				name: '张三',
				age: '18',
				height: '180'
			}
			let a = Object.keys(obj1)
			console.log(a) //输出['name', 'age', 'height']

衍生:obj2中部分key与obj1相同,这是需要将obj1与obj2中key相同的进行赋值,代码如下

let obj2 = {
				name: '',
				age: '',
			}
			let obj1 = {
				name: '张三',
				age: '18',
				height: '180'
			}
			Object.keys(obj2).forEach(item => {
				obj2[item] = obj1[item]
			})
			console.log(obj2) //输出{name: '张三', age: '18'}

三、Object.getOwnPropertyNames(),该方法也是ES5新增的,返回一个自身属性名的数组,包括不可枚举的属性

let obj1 = {
				name: '张三',
				age: '18',
				height: '180'
			}
			let a = Object.getOwnPropertyNames(obj1)
			console.log(a) //['name', 'age', 'height']

你可能感兴趣的:(vue.js,javascript,前端)