面向对象简介
面向对象:可以创建自定义的类型,很好的支持继承和多态。
面向对象的特征:封装、继承、多态。
对象的概念
在 JavaScript 中,对象是一组无序的相关属性和方法的集合。
对象的作用是:封装信息,比如Student类里可以封装学生的姓名、年龄、成绩等
对象具有属性和方法
对象的分类
内置对象:
- 由ES标准中定义的对象,在任何的ES的实现中都可以使用
- 比如:Object、Math、Date、String、Array、Number、Boolean、Function等。
宿主对象:
- 由JS的运行环境提供的对象,目前来讲主要指由浏览器提供的对象。
- 比如 BOM DOM。比如
console
、document
。
自定义对象:
- 由开发人员自己创建的对象
通过 new 关键字创建出来的对象实例,都是属于对象类型,比如Object、Array、Date等。
创建对象
使用构造函数创建
- 使用new关键字调用的函数,是构造函数,构造函数是专门用来创建对象的函数
- 这种方式只能先创建对象,然后再向对象里添加属性
// 创建对象
var obj = new Object();
// 添加属性
obj.name = 'zy';
使用对象字面量创建
- 字面量创建和构造函数创建本质上是一样的,这种写法更简便
- 字面量创建对象可以在创建时,直接指定对象的属性
- 语法:{属性名:属性值,属性名:属性值…}
var obj2 = {
name: "猪八戒",
age: 13,
gender: "男",
test: {
name: "沙僧"
},
sayName: function(){
console.log(this.name);
}
};
obj2.sayName(); // 猪八戒
对象属性
属性创建方式
对象.属性名 = 属性值
,该方式对象的属性名要求遵循标识符规范对象["属性名"] = 属性值
,该方式对象的属性名无要求,甚至可以是一个变量
var obj = {};
obj.name = 'zy';
obj['age'] = 18;
obj['hobby'] = '篮球';
n = 'name';
console.log(obj[n]);
in 检查属性是否存在
- 语法:
属性名 in 对象
- 该运算符可以检查一个对象中是否含有某个属性
- 如果有则返回
true
没有则返回false
var obj1 = new Object();
obj1.name = '八戒';
console.log('name' in obj1); // true
console.log('age' in obj1); // false
属性值可以是任意数据类型
var obj1 = new Object();
obj1.name = '八戒';
var obj2 = new Object();
obj2.test1 = function() {
return 'hello';
};
obj2.test2 = obj1;
console.log(obj2.test1()); // hello
console.log(obj2.test2.name); // 八戒
属性的增删改查
var obj = new Object();
// 向obj对象添加属性
obj.name = 'zy';
obj.age = 18;
console.log(obj);
// 读取对象中的属性
// 如果没有该属性 不会报错而是返回undefined
// obj[] 里面带引号是属性名,不带引号是变量
console.log(obj.name);
console.log(obj['name']);
// 修改对象的属性
obj.name = 'tom';
// 删除对象的属性
delete obj.age;
对象方法
- 对象的属性值可以是任意数据类型,当属性值为函数时,我们可以称该函数是对象的方法
- 此时调用对象中的函数就可以说是调用该对象的方法
var obj = {
name:'zy',
sayName:function () {
console.log(obj.name);
}
};
// 调用对象onj的sayName方法
obj.sayName();
// 调用xxx的方法就是xxx.xxx()
// 调用console对象的log方法
console.log();
// 调用hello对象的toString方法
'hello'.toString()
遍历对象
for...in
语句,对象中有几个属性,循环体就会执行几次- 每次执行时,会将对象中的一个属性赋值给变量
var obj = {
name:'zy',
age:'18',
sayName:function () {
console.log(obj.name);
},
wife:{name:'xx'}
};
obj.hobby = '画画';
// 两种属性查询方式
console.log(obj.name);
console.log(obj['name']);
for (var i in obj){
console.log(i); // 属性名
// i是变量 obj.i 是在obj中找属性i 这种查询方式不行
// obj[] 里面带引号是属性名,不带引号是变量
console.log(obj[i]) // 属性值
}