对象是JavaScript中的基本数据类型之一，是一种复合的数据类型。对象将多种数据类型集中在一个数据单元中，通过对象可以存取这些数据的值。
1，对象简介
1.1 对象的概念
Js 中对象有两个钥匙：
1，属性
2，方法
属性和方法。通过访问或设置对象的属性，并且调用对象的方法，可以对对象进行各种操作，从而获得需要的功能。
Js 中对象就是属性和方法的集合，这些属性和方法也叫作对象的成员。方法是对象成员的函数，表明对象所具有的行为；而属性是对象成员的变量，表明对象的状态。
1.2 对象的创建
创建对象的格式：
var 对象名 = {属性名1:属性值1,属性名2:属性值2,属性名3:属性值3...}var person = {name: '张三',age: 18,sex: '男'
}2，操作对象
2.1 访问属性
-
Js 中访问属性的方式有两种：
- 1，
对象名.属性名 - 2，
对象名[属性名]
- 1，
var person = {name: '张三',age: 18,sex: '男'
}alert(person.name+' '+person.age+' '+person["sex"])2.2 添加属性
var person = {name: '张三',age: 18,sex: '男'
}person.country = "中国"alert(person.country)2.3 删除属性
var person = {name: '张三',age: 18,sex: '男'
}delete person.namealert(person.name)2.4 添加方法
var person = {name: '张三',age: 18,sex: '男',show: function () {alert(this.name + ',' + this.age + ',' + this.sex)}
}person.show()var person = {name: '张三',age: 18,sex: '男',show: function (x) {alert(x)}
}person.show(1)2.5 遍历对象
在 js 中，
for…in循环语句是专门用于遍历对象的语句。for…in循环语句和for循环语句十分相似，用来遍历对象的所有属性，每次都将属性名作为字符串，保存到变量中。for…in循环语句的语法格式如下。for(variable in object ) {
…statement
}var person = {sex: '男',show: function (x) {alert(x)}
}for (x in person) {alert(typeof person[x])
}3，javascript 内部对象
-
js 内部的对象可分为静态对象和动态对象
- 1，首先必须使用new关键字创建一个对象实例，然后才能使用“对象实例名.成员”。
- 2，当引用静态对象的属性和方法时，不需要用new关键字创建对象实例，直接使用“对象名.成员”的方式来访问其属性和方法即可。
3.1 Math 对象
Math是静态对象，可以直接使用Math.PI获取相关内容alert(Math.random())alert(Math.max(x,y))3.2 Date 对象
var number = Date.now();
console.log(typeof number)
console.log(number.toString())
var date = new Date();
console.log(date)console.log(date.getFullYear())
console.log(date.getMonth())因为使用getMonth()方法获取的月份比系统中实际月份的值小1，所以在使用getMonth()方法获取当前月份的值时要加上1。代码如下。
var date = new Date();
console.log(date)console.log(date.getFullYear())
console.log(date.getMonth())
console.log(date.getMonth()+1)3.3 Event 对象
Js 的 Event 对象用来描述 js 的事件。Event 对象代表时间状态，如事件发生元素、键盘状态、鼠标位置、鼠标状态等。一旦事件发生，就会发生 Event 对象。
例如，单击一个按钮，浏览器的内存中就会产生相应的Event对象。
用法
1，传统方式
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title><script>function testA(event) {alert(typeof event)}</script>
</head>
<body>
<h1 onclick="testA(event)">aaaaaaa</h1>
</body>
</html>2，纯 js 代码
- 方式一：
document.addEventListener('click',function (e){alert(e.target)
})- 方式二：
document.addEventListener('click',(e)=>{
alert(e.button)
})- 方式三
document.getElementsByName('h1')[0].addEventListener('click', function (e) {alert('22')
})