JavaScript+jQuery前端开发基础教程（第2版）（微课版）第5章.pptx

JavaScript+jQuery前端开发基础教程微课版

第5章JavaScript的面向对象本章主要内容：对象原型对象和继承内置对象类

5.1对象在JavaScript中，基本类型（number、string、boolean、null、undefined和symbol）本身并不是对象。JavaScript的内置对象（String、Number、Boolean、Object、Function、Array、Date、RegExp和Error等)都是是对象的一个子类型。在面向对象的程序设计中，类封装了对象的共同属性和方法。属性表示对象的特征，方法表示对象的行为。具体的对象称为类的实例对象，继承了类的所有属性和方法。

虽然JavaScript不是纯粹面向对象，但同样支持面向对象的特性。JavaScript的对象同样有属性和方法，也支持继承。一个对象可拥有多个属性和方法，并可继承原型对象的属性和方法。对象的属性可看作一个“键/值”对，键是属性名，值是属性的值。一个对象就是多个属性名到值的映射，这类似于其他程序设计语言中的“映射”“散列”“字典”等概念。对象的属性和方法均通过对象访问。x?=?event.type????????????????//使用事件对象的属性，获得事件类型名称event.preventDefault()????????//调用事件对象的方法，阻止事件默认行为

5.1.1创建对象JavaScript提供了3种创建对象的方法：字面量new关键字Object.create()方法

1．使用字面量创建对象在JavaScript中，花括号括起来的多个“键/值”对是一个对象常量，可将其赋给一个变量。?var?x?=?{}??//创建一个空对象?var?a?=?{?name:?JavaScript程序设计,?price:?25?}?//创建一个有name和price属性的对象

2．使用new关键字创建对象new关键字调用构造函数来创建并初始化一个对象。JavaScript的内置对象都包含内置的构造函数。例如，Object()、Array()、Date()等都是构造函数。var?a?=?new?Object()?????????????????????????????//创建空对象var?b?=?new?Object({?name:?JavaScript程序设计,?price:?25?})????//创建带有属性的对象var?c?=?new?Array(1,?2,?3)????????????????????//创建一个数组对象var?d=new?Date()??????????????????????????????????//创建一个表示当前日期时间的日期对象

在JavaScript中，通过字面量创建的所有对象都有相同的原型对象，对象继承原型对象的属性和方法，可使用Object.prototype属性引用原型对象。使用new关键字和构造函数创建对象时，实质是使用构造函数的prototype属性值作为原型对象。例如，newArray()以Array.prototype属性值作为原型对象，newDate()以Date.prototype属性值作为原型对象

3．使用Object.create()方法创建对象Object.create()方法用指定参数创建对象，参数为null时，创建一个空对象；参数为对象常量或其他对象时，将参数作为原型对象来创建对象，新对象继承原型对象的所有属性和属性值。var?a?=?Object.create(null)?//创建一个空对象var?b?=?Object.create({?name:?jQuery教程,?price:?30?})???//提供原型对象来创建对象

5.1.2使用对象属性对象属性使用“.”运算符来访问，“.”左侧为引用对象的变量名称，右侧为属性名。也可用类似于数组元素的方式来访问属性。var?a?=?{name:C++,price:12}document.write(a.name)document.write(a[name])两条语句中的a.name和a[name]是等价的。如果读取一个不存在或者未赋值的属性，得到的值为undefined。

对象的属性是动态的。在给对象属性赋值时，如果属性存在，则覆盖原来的值，否则会为对象创建新的属性并赋值。var?a?=?{?name:?C++,?price:?12?}a.name?=?HTML??????????????//修改属性值a.nmae?=?JavaScript????????//本意是为name属性赋值，输入错误，这会创建新的nmae属性可使用delete删除对象的属性。delete?a.name可使用for/in