javascript基础（对象，对象属性，属性基本和引用数据类型，字面量创建对象，垃圾回收，属性的枚举）（十三）

最新推荐文章于 2022-12-06 13:56:36 发布

咸鸭蛋炒饭

最新推荐文章于 2022-12-06 13:56:36 发布

阅读量498

点赞数 1

分类专栏： HTML5基础篇文章标签： javascript 经验对象

本文链接：https://blog.csdn.net/u010853130/article/details/54923676

版权

HTML5基础篇专栏收录该内容

121 篇文章 8 订阅

订阅专栏

1.对象概述：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript">
			/*
			 * JS中一共有6种数据类型
			 * 基本数据类型
			 * 		String Number Boolean Null Undefined	
			 * 引用数据类型
			 * 		Object（对象）
			 * 
			 * 基本数据类型保存的都是一个一个单一的值，值与值之间没有任何的联系，不能表示一些复杂的数据
			 * 	假设需要在程序中来表示一个人的信息（姓名、性别、年龄、住址）：
			 * 	var name = "孙悟空"
			 * 	var age = 18
			 *  var gender = "男"
			 * 	var address = "花果山"
			 * 
			 * 对象是一种复合数据类型，对象就像是一个容器，在它里面可以装任意数据类型的属性
			 * 
			 * 对象的分类：
			 * 	1.内建对象
			 * 		- 内建对象指由ES标准定义的对象，任何对ES标准的实现都可以使用这些对象
			 * 		- 比如：Math String Number Boolean RegExp
			 * 
			 * 	2.宿主对象
			 * 		- 宿主对象指由JS运行环境为我们提供的对象，目前对于我们来说就是指浏览器为我们提供的对象
			 * 		- 比如BOM对象 和 DOM对象
			 * 		- window document console 。。。。。。
			 * 
			 * 	3.自定义对象
			 * 		- 由我们自己定义的对象
			 * 
			 */
			
			//创建对象
			//调用构造函数（constructor）创建一个对象
			//使用new关键字调用的函数称为构造函数
			var obj = new Object();
			
			//使用typeof检查一个对象时，会返回object
			//console.log(typeof obj);
			
			//在对象中可以保存不同类型值，这些值我们称为对象的属性
			//向对象中添加属性
			//语法：对象.属性名 = 属性值
			obj.name = "孙悟空";
			obj.age = 18;
			obj.gender = "男";
			
			//从对象中读取属性
			//语法：对象.属性名
			//console.log(obj.gender);
			
			//如果读取对象中没有的属性，不会报错，而是返回undefined
			//console.log(obj.address);
			
			/*
			 * 修改对象的属性
			 * 	对象.属性名 = 新值
			 */
			
			obj.name = "tom";
			
			/*
			 * 删除对象中的属性
			 * 	语法：delete 对象.属性名
			 */
			
			//删除obj的name属性
			delete obj.name;
			
			//console.log(obj.name);
			
			/*
			 * 检查对象中是否含有某个属性
			 * 	可以使用in运算符
			 * 	语法  "属性名" in 对象
			 * 		检查对象中是否含有指定的属性，如果有则返回true，没有则返回false
			 */
			console.log("name" in obj);
			
			
		</script>
	</head>
	<body>
	</body>
</html>

2.对象属性：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript">
			
			var obj = new Object();
			
			
			//向obj中添加属性
			obj.name = "孙悟空";
			
			/*
			 * 对象的属性名，没有任何要求，也不用遵循的标识符的规范,
			 * 	可以起任何的稀奇古怪的名字，但是如果是一些特别的名字不能使用 对象.属性名 的形式添加
			 * 	而需要采取其他的方式。
			 * 
			 * 虽然可以起任意的名字，但是在开发中属性名尽量还是遵循标识符的规范
			 * 
			 * 
			 * 添加属性的第二种方式
			 * 	 对象["属性名"] = 属性值
			 * 	[]这种方式比我们使用 . 更加灵活，而且[]中可以传变量
			 */
			obj.var = "hello";
			
			//obj.123abc = "你好";
			obj["123abc"] = "你好";
			
			/*
			 * 读取属性：
			 * 	对象["属性名"]
			 */
			//console.log(obj["name"]);
			
			var str = "var";
			
			//console.log(obj[str]);
			
			/*
			 * 属性值
			 * 	- 属性值可以是任意的数据类型（String Number Boolean Null Undefined）
			 * 	- 也可以一个对象
			 * 
			 */
			var obj2 = new Object();
			
			//向obj2中添加一个属性
			obj2.name = "沙和尚";
			
			obj.test = obj2;
			
			console.log(obj.test.name);
			
		</script>
	</head>
	<body>
	</body>
</html>

3.基本和引用数据类型：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript">
			/*
			 * 基本数据类型
			 * 	String Number Boolean Null Undefined
			 * 
			 * 引用数据类型
			 * 	Object
			 * 
			 * 程序在运行时，内存分为两种结构栈内存、堆内存
			 * 	基本数据类型的值是直接保存到栈内存中的
			 * 		基本数据类型的值都是互相独立的，修改一个不会影响到其他的值
			 *  引用数据类型对象是保存在堆内存中的，而在变量中保存的是对象的引用（内存地址）
			 * 		我们是通过引用来操作对象的，当修改一个对象时有可能影响到其他的变量	
			 * 
			 * 	对基本数据类型相等比较时，比较的是数据的值
			 * 		而两个引用数据类型进行比较时，比较的是对象的地址，如果两个对象一模一样，但是地址不同也会返回false
			 * 
			 */
			
			var a = 1;
			
			//创建一个变量b
			var b = a;
			
			//修改a的值
			b++;
			
			/*console.log("a = "+a);
			console.log("b = "+b);*/
			
			var obj = new Object();
			
			//向对象中添加属性
			obj.name = "孙悟空";
			
			//创建一个obj2
			var obj2 = obj;
			
			//修改obj的name属性
			obj.name = "沙和尚";
			
			/*console.log(obj.name);
			console.log(obj2.name);*/
			
			var c = 10;
			var d = 10;
			
			var obj3 = new Object();
			var obj4 = new Object();
			
			//console.log(c == d);
			//console.log(obj3 == obj4);
			
			var obj5 = new Object();
			obj5.name = "猪八戒";
			var obj6 = obj5;
			//设置obj5为null
			obj5 = null;
			
			console.log(obj6.name);
			
			
			
		</script>
	</head>
	<body>
	</body>
</html>

4.使用字面量创建对象：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript">
			
			//var obj = new Object();
			
			//使用对象字面量来创建对象
			var obj = {};
			
			obj.name = "孙悟空";
			
			
			/*
			 * 创建对象的同时为其添加属性
			 * 	对象字面量的语法：
			 * 		{属性名:属性值,属性名:属性值,属性名:属性值...}
			 * 		对于特殊的属性名，可以通过双引号引起来
			 */
			var obj2 = {
							name:"孙悟空",
							age:18,
							address:"花果山",
							"123":"hello",
							test:{
								name:"猪八戒",
								age:28,
								address:"高老庄"
							}
						};
			
			console.log(obj2.test.address);
			
			
		</script>
	</head>
	<body>
	</body>
</html>

5.垃圾回收：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript">
			/*
			 * 垃圾回收（GC）
			 * 	- 当一个对象没有任何的变量对其引用时，
			 * 		此时我们将无法在获取到该对象，也无法在对该对象做任何的操作
			 * 		但是这种对象依然会占用内存空间，这种垃圾过多以后会浪费大量的内存
			 * 		导致程序运行变慢。向这种对象我们必须进行回收，使其不占用内存空间。
			 * 
			 *  - 在JS中有自动的垃圾回收机制，浏览器会自动将没有被引用的对象清除出内存。
			 * 		回收的工作由浏览器自动完成，而我们只需要将一些不再使用的对象设置为null即可
			 * 		
			 * 
			 */
			
			var obj = new Object();
			
			//将obj设置null
			obj = null;
			
			
		</script>
	</head>
	<body>
	</body>
</html>

6.属性的枚举：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript">
			
			//创建一个对象
			var obj = {
						name:"猪八戒",
						age:28,
						address:"高老庄"
					};
					
			
			//对obj中的属性进行枚举
			/*
			 * 使用 for...in 语句对一个对象中的属性进行枚举
			 * 语法：
			 * 		for(变量 in 对象){
			 * 			
			 * 		}
			 * 
			 * 	对象中有几个属性，循环体就会执行几次，
			 * 		每次执行时都会将一个对象中的属性名赋值给变量
			 */
			
			for(var n in obj){
				console.log(n + " : " +obj[n]);
			}
					
			
		</script>
	</head>
	<body>
	</body>
</html>