JavaScript基础对象和事件_javascript事件对象-CSDN博客

本文链接：https://blog.csdn.net/XSL_HR/article/details/126905969

JavaScript 内容总结对象与事件

- 6JavaScript的对象与事件

6JavaScript的对象与事件

学习目标：

JavaScript对象概念（了解）
如何定义对象（理解）
JavaScript内置对象（理解）
浏览器对象(了解)
DOM对象(重点)
JavaScript事件(重点)

6.1 JavaScript对象

6.1.1 概念

客观世界中真实存在的事物叫做对象。

例如：学生“张三”，学生“李四”，他们都是学生对象。

对象由属性和方法组成。
属性用来描述对象的静态特征，用变量表示。

例如：每个学生都有姓名，那么姓名就是学生对象的一个属性。

方法用来描述对象的动态行为，通常用函数表示。

例如：每个学生都有学习的方法。
在这里插入图片描述

对象由属性(特征)和方法(行为)组成

属性可以使用变量定义(名词)，方法使用function函数定义(动词)

在这里插入图片描述

对象的方法
在这里插入图片描述

6.1.2 对象的定义

案例：使用定义函数的方式来定义对象。Student是一个学生对象，它由两个属性(学生姓名和年龄)。

	<script type="text/javascript">
		// 自定义对象
		function Student(stuName,stuAge) {
            // 将参数赋值给对象的属性，this表示当前对象(此时当前对象是Student)
			this.stuName = stuName;
			this.stuAge = stuAge;
			this.study = function() {
				alert(this.stuName +"正在学习");
			}
		}
	</script>

6.1.3 对象的创建

JavaScript使用new关键字来创建对象，“关键字”是具有特殊意义的单词。new是JavaScript的运算符，表示创建一个新的对象。对象创建之后可以调用对象的属性和方法。

注意： 使用new创建对象，对象创建成功之后才可以调用对象的属性和方法。

调用对象属性语法如下：对象名.属性名。 . dot 的

调用对象方法语法如下：对象名.方法名。

案例：使用new关键字创建“学生”对象，然后调用对象的属性和方法。

<!DOCTYPE html>
<html>
<head>
	<title></title>
</head>
<body>
	<script type="text/javascript">
		// 自定义对象
		function Student(stuName,stuAge) {
			this.stuName = stuName;
			this.stuAge = stuAge;
			this.study = function() {
				alert(this.stuName +"正在学习");
			}
		}
		// 创建学生对象张三
		let zhangSan = new Student("张三",20);
		// 调用stuName属性
		alert(zhangSan.stuName);
		// 调用study方法(函数)
		zhangSan.study();
	</script>
</body>
</html>