JavaScript——对象详解及操作(创建对象，属性，方法，遍历对象中属性(for...in循环))

---

对象基本概况

---

对象是什么

在JavaScript中，对象可以被看作是一组属性的集合，在对象中可以保存多个不同数据类型的属性，可以这么理解除了JS中基本数据类型就是对象

为什么要引入对象

基本数据类型不足之处：

基本数据都是单一的值"hello"123 true,值和值之间没有联系

比如，表示一个人的信息（name gender age）

var name="孙悟空";
var gender='男';
var age=18;

创建的变量都是独立，不能成为一个整体，比如，gender也可以表示猪八戒的性别，下面有举例

对象的分类

• 1.内建对象

          由ES标准中定义的对象，在任何的ES的实现中都可以使用

• 2.宿主对象

          由JS的运行环境提供对象，主要指浏览器提供的对象，比如BOM，DOM

• 3.自定义对象

          由开发人员自己创建的对象

 

---

对象操作

---

创建对象

new运算符创建

var obj = new Object();

添加对象属性

obj.name="孙悟空";
obj.gender='男';
obj.age=18;

对比之前就可以看出对象表示一个人的信息有整体性，相当于把多个变量放到一个箱子中

读取对象属性——语法：对象.属性名

console.log(obj.gender);

修改对象属性——语法：对象.属性名=新值

obj.name="tom";

删除对象属性——语法：delete 对象.属性名

delete obj.name;

判断对象是否含有某个属性——in 运算符

语法："属性名" in 对象

如：判断obj中是否含有test2属性

console.log("test2" in obj);

//有 返回true
//无 返回false

---

另一方式创建对象——字面量

---

语法：{属性名:属性值,属性名:属性值......}

var obj1={
   
   name:"孙悟空",
   age:18,
   test:{name:"沙和尚"},
   
};
console.log(obj1);

输出结果：

字面量中的属性名可以加引号也可以不加，属性名本质就是一个字符串，建议不加，这里这与JSON区别，JSON是必选要加的

---

属性名与属性值

---

属性名

使用[]形式操作属性，可以在[]中直接传递一个变量

var obj = new Object();
obj.name="孙悟空";
var x="name";

下面两种方式输出值一样

console.log(obj.name);
console.log(obj[x]);

结果：

 

属性值——任意数据类型，可以是对象，也可以是函数

属性值为对象

如：为上面obj添加一个test属性，属性值为对象

var obj2 = new Object();
obj2.name="猪八戒";

obj.test=obj2;

console.log(obj.test);

输出结果

属性值为函数——方法

函数也是一个对象，详见此博客

var obj ={
	name:"孙悟空",
	age:18,
	sayName:function(){
	console.log(obj.name);
	}
};

//调function函数
obj.sayName();

 此时sayName的属性值就是一个函数，而对于是属性值的函数，我们称之为方法，调用这个函数就说调用对象的方法

---

遍历对象中属性(for...in循环)

---

语法

for(var 变量 in 对象){
	
}

对象有几个属性，循环体就会执行几次

每次执行时，会将对象中的一个属性的名字赋值给变量

举例：遍历下面对象中的属性

var obj={
		name:"孙悟空",
		age:18,
		gender:"男",
		address:"花果山"
	   }

for ...in循环遍历

for(var n in obj){
   console.log("属性名:"+n);
   console.log("属性值:"+obj[n]);
}

此时就用到了obj[n]取出属性值

---

总结

---