JS中可以给对象添加属性的方法有很多,但是每种方法都有自己的特点 当然再给说怎么给JS添加属性之前,我们要先知道JS中对象是什么,属性又是什么?

一、先了解一下什么是对象,什么又是属性

1. 什么是对象

对象:一种ES5的一种引用数据类型,可以把对象看做一个容器,里面可以存放普通数据类型,而且需要使用的时候可以通过对象名.属性名来调用这个容器内存放的数据。

2. 什么又是属性

属性:因为对象是一个容器,对象内存放的数据就是一个个的属性,这些属性分了两个部分,分别是 属性名(键)属性值(值) ,又称键值对

//这里总体就是一个对象
var obj={
//而对象内的一条条数据就是属性(键值对)
//属性名(键):属性值(值)
//这里的值可以是ES5的任何数据类型
	name:'张三',
	age:18,
	sex:'男',
	bool:true,
	null:null,
	defined:undefined,
	fun:function(){
		console.log('函数')
	},
	objChild:{
		name:'张四'
	}
}
console.log(obj)//{name: '张三', age: 18, sex: '男', bool: true, null: null, fun:f (),objChild:{...}}
console.log(obj.name)//张三
console.log(obj.fun)//函数
console.log(obj.objChild.name)//张四

二、再来了解一下给对象添加属性的方法

1. 给对添加属性最直接的方法

最简单直接的方法直接对象.属性名然后给一个值即可,这样就可以实现替换和添加属性注意:原对象里面可以没有这个属性名

var obj={
	name:'赵四'
}
console.log(obj)//{name:'赵四'}
//这里有一个人叫赵四,他是一个对象
//就比如说赵四今年28岁了
//就可以直接对象然后直接给一个属性名然后直接赋值即可
//注意:原对象里面可以没有这个属性名
obj.age=28;
console.log(obj)//{name:'赵四',age:28}
//然后赵四过了一年长了一岁
obj.age=29;
console.log(obj)//{name:'赵四',age:29}

这个是方法一

2. 给对象添加属性也算比较直接的

可以直接 对象[属性名] 直接赋值或者替换 注意: 原对象里面可以没有这个属性名,但是括号内的属性名 必须是一个字符串类型,否则会报错

var obj1={
	name:'王五'
}
//这里同样有一个人叫王五,他同样也是一个对象
//就比如说王五的性别是男的
//就可以直接对象[属性名]然后直接赋值即可
//注意:原对象里面可以没有这个属性名,但是括号内的属性名必须是一个字符串类型
obj1['sex']='男';
console.log(obj1)//{name: '赵四', sex: '男'}
//又比如说王五改名叫老六
//也可以替换属性
obj1['name']='老六';
console.log(obj1)//{name: '老六', sex: '男'}

一定要注意:方法二的方括号内属性名一定要字符串扩住

3. 还有一种在vue独有的对象替换和添加属性

vue特有方法 就是 this.$set(对象,属性名,值) 方法 有三个参数 这里的第一个参数是要给哪一个对象添加或替换属性第二个参数是这个要添加或者替换的属性名,是一个字符串第三个参数是要给这个属性名赋的值是什么

data(){
	return {
		obj:{
			name:'李四',
			age:18
		}
	}
}
//这里就比如说李四今年三十岁但是登记信息的时候填写错误了,我们需要一个事件来更改一下
methods:{
	Click(){
		//更改李四的信息
		this.$set(this.obj,'age',30)
		console.log(this.obj)//{name:'李四',age:30}
	}
}

什么是对象和怎么替换和添加对象的属性就先讲这么多