JavaScript程序设计基础教程-第4章-JavaScript对象课件

JavaScript程序设计JavaScript程序设计1第4章JavaScript对象4.1对象简介4.2创建对象4.3对象特性4.4单体内置对象JavaScript程序设计第4章JavaScript对象4.1对象简介4.2创2第4章JavaScript对象4.5实战：产生n个不重复随机数JavaScript程序设计第4章JavaScript对象4.5实战：产生n个不重3

对象

所谓对象，就是一种无序的数据集合，由若干个“键值对”（key-value）构成；varo={p:"HelloWorld"};4.1对象简介第4章JavaScript对象JavaScript程序设计对象4.1对象简介第4章JavaScript对象Jav4

对象属性4.1对象简介第4章JavaScript对象JavaScript程序设计属性属性类型描述Prototype对象对象的原型，用来实现继承功能的关键对象Class字符串描述对象类型的字符串值，使用typeof操作符返回的结果Get函数返回属性值。获取指定属性名的值Put函数设置指定的属性值。为指定的属性赋值CanPut函数返回指定属性是否可用通过Put操作设置值HasProperty函数返回对象是否有指定的属性Delete函数从对象中删除指定属性DefaultValue函数返回对象的默认值，只能是原始值，不能是引用类型Construct函数通过new操作符创建一个对象。实现了这个内部属性的对象被叫做构造函数（可以理解为类）Call函数执行关联在对象上的代码，通过函数表达式调用（也就是通过函数名调用函数），实现了这个内部方法的对象被叫做函数HasInstance函数返回给定的值是否扩展了当前对象的属性和行为（可以理解为给定的对象是否为本类创建的对象），在JavaScript本地对象中，只要Function对象实现了这个属性Scope对象作用域链定义了一个函数的执行环境对象属性4.1对象简介第4章JavaScript对象J5

对象字面量模式创建对象varperson={name:'Nicholas';age:'22';job:"softwareEngineer";sayName:function(){alter(); }}4.2创建对象第4章JavaScript对象JavaScript程序设计对象字面量模式创建对象4.2创建对象第4章JavaSc6

工厂模式创建对象functioncreatePerson(name,age,job){ varo=newObject(); =name; o.age=age; o.job=job; o.sayName=function(){ alert(); }; returno;}varperson1=createPerson("Nicholas",22,"softwareEngineer");varperson2=createPerson("Greg",24,"student");4.2创建对象第4章JavaScript对象JavaScript程序设计工厂模式创建对象4.2创建对象第4章JavaScrip7

构造函数模式创建对象functionPerson(name,age,job){ =name; this.age=age; this.job=job; this.sayName=function(){ alert(); }}//通过new操作符创建Person的实例varperson1=newPerson("Nicholas",22,"softwareEngineer");varperson2=newPerson("Greg",24,"student");person1.sayName();person2.sayName();4.2创建对象第4章JavaScript对象JavaScript程序设计构造函数模式创建对象4.2创建对象第4章JavaScr8

原型模式创建对象functionPerson(){}P="Nicholas";Ptotype.age=22;Ptotype.job="softwareEngineer";Ptotype.sayName(){ alert();};varperson1=newPerson();person1.sayName();//Nicholasalert(person1.sayName==person2.sayName);//true4.2创建对象第4章JavaScript对象JavaScript程序设计原型模式创建对象4.2创建对象第4章JavaScrip9组合使用构造函数模式和原型模式创建对象4.2创建对象第4章JavaScript对象JavaScript程序设计组合使用构造函数模式和原型模式创建对象4.2创建对象第4章10

动态原型模式创建对象functionPerson(name,age){ =name; this.age=age; this.job=job; //方法

if(typeofthis.sayName!='function'){ Ptotype.sayName=function(){ alert(); }; }}varfriend=newPerson('Nicholas','22','SoftwareEngineer');//初次调用构造函数，此时修改了原型varperson2=newPerson('amy','21');//此时sayName()方法已经存在，不会再修改原型4.2创建对象第4章JavaScript对象JavaScript程序设计动态原型模式创建对象4.2创建对象第4章JavaScr11

任务1.任务介绍定义一个Person对象，对象包括属性姓名，并获取实例化对象Person的姓名信息。2.任务目标学会JavaScript几种创建对象模式及全局变量的存储机制。3.实现思路1）选用构造函数模式创建对象，并且将属性为方法的属性定义到函数之外。2）全局变量是绑定在window对象上的，是window对象的属性。4.2创建对象第4章JavaScript对象JavaScript程序设计任务4.2创建对象第4章JavaScript对象Jav12

对象的四种特性

抽象性封装性继承性多态性4.3对象特性第4章JavaScript对象JavaScript程序设计对象的四种特性4.3对象特性第4章JavaScript13

任务1.任务介绍定义一个Student类作为Person类的子类，在Student类中继承父类的walk()方法、重新定义父类的sayHello()方法并添加Student类自己的sayGoodBye()方法。2.任务目标理解JavaScript面向对象的四大特性并掌握创建对象的方法。3.实现思路1）选用构造函数模式创建对象，并且将属性为方法的属性定义到函数之外。2）全局变量是绑定在window对象上的，是window对象的属性。4.3对象特性第4章JavaScript对象JavaScript程序设计任务4.3对象特性第4章JavaScript对象Jav14

Global对象

Global对象是JavaScript中最特别的对象，因为实际上它根本不存在。Global对象在某种意义上是作为一个终极的「兜底儿对象」来定义的。换句话说，不属于任何其他对象的属性和方法，最终都是它的属性和方法。所有在全局作用域中定义的属性和函数，都是Global对象的属性。4.4单体内置对象第4章JavaScript对象JavaScript程序设计Global对象4.4单体内置对象第4章JavaScr15

Global对象常用内置方法（1）URI编码方法（2）eval()方法4.4单体内置对象第4章JavaScript对象JavaScript程序设计Global对象常用内置方法4.4单体内置对象第4章J16

Global对象的属性4.4单体内置对象第4章JavaScript对象JavaScript程序设计属性释义undefined特殊值undefinedNaN特殊值NaNInfinity特殊值InfinityObject构造函数ObjectArray构造函数ArrayFunction构造函数FunctionBoolean构造函数BooleanString构造函数StringNumber构造函数NumberDate构造函数DateRegExp构造函数RegExpError构造函数ErrorEvalError构造函数EvalErrorRangeError构造函数RangeErrorReferenceError构造函数ReferenceErrorSyntaxError构造函数SyntaxErrorTypeError构造函数TypeErrorURIError构造函数URIErrorGlobal对象的属性4.4单体内置对象第4章Java17

Math对象属性4.4单体内置对象第4章JavaScript对象JavaScript程序设计属性释义Math.E自然对数的底数，即常量e的值Math.LN1010的自然对数Math.LN22的自然对数Math.LOG2E以2为底e的对数Math.LOG10E以10为底e的对数Math.PIπ的值Math.SQRT1_21/2的平方根（即2的平方根的倒数）Math.SQRT22的平方根Math对象属性4.4单体内置对象第4章JavaScr18

Math对象方法（1）min()和max()方法；（2）舍入方法：Math.ceil()、Math.floor()和Math.round()；

（3）random()方法；（4）其他方法；4.4单体内置对象第4章JavaScript对象JavaScript程序设计属性释义Math.abs(num)返回num的绝对值Math.asin(x)返回x的反正弦值Math.exp(num)返回Math.E的num次幂Math.atan(x)返回x的反正切值Math.log(num)返回num的自然对数Math.atan2(y,x)返回y/x的反正切值Math.pow(num,power)返回num的power次幂Math.cos(x)返回x的余弦值Math.sqrt(num)返回num的平方根Math.sin(x)返回x的正弦值Math.acos(x)返回x的反余弦值Math.tan(x)返回x的正切值Math对象方法4.4单体内置对象第4章JavaScr19

实战

（1）案例描述

用JavaScript产生n个[min,max]区间内的不重复随机数。

（2）实现思路1）运用Math对象的random()方法生成一个[min,max]区间内的随机数；

2）生成n个[min,max]区间内的不重复随机数，生成第i个[min,max]区间的随机数时，与之前i-1个数比较，如有重复，令i=i-1;重复生成第i个随机数。确保每次生成的随机数都不重复。4.5实战：产生n个不重复随机数第4章JavaScript对象JavaScript程序设计实战4.5实战：产生n个不重复随机数第4章JavaSc20

对象简介

创建对象

对象特性

单体内置对象总结第4章JavaScript对象JavaScript程序设计对象简介总结第4章JavaScript对象JavaScr21谢谢观看谢谢观看22JavaScript程序设计JavaScript程序设计23第4章JavaScript对象4.1对象简介4.2创建对象4.3对象特性4.4单体内置对象JavaScript程序设计第4章JavaScript对象4.1对象简介4.2创24第4章JavaScript对象4.5实战：产生n个不重复随机数JavaScript程序设计第4章JavaScript对象4.5实战：产生n个不重25

对象

所谓对象，就是一种无序的数据集合，由若干个“键值对”（key-value）构成；varo={p:"HelloWorld"};4.1对象简介第4章JavaScript对象JavaScript程序设计对象4.1对象简介第4章JavaScript对象Jav26

对象属性4.1对象简介第4章JavaScript对象JavaScript程序设计属性属性类型描述Prototype对象对象的原型，用来实现继承功能的关键对象Class字符串描述对象类型的字符串值，使用typeof操作符返回的结果Get函数返回属性值。获取指定属性名的值Put函数设置指定的属性值。为指定的属性赋值CanPut函数返回指定属性是否可用通过Put操作设置值HasProperty函数返回对象是否有指定的属性Delete函数从对象中删除指定属性DefaultValue函数返回对象的默认值，只能是原始值，不能是引用类型Construct函数通过new操作符创建一个对象。实现了这个内部属性的对象被叫做构造函数（可以理解为类）Call函数执行关联在对象上的代码，通过函数表达式调用（也就是通过函数名调用函数），实现了这个内部方法的对象被叫做函数HasInstance函数返回给定的值是否扩展了当前对象的属性和行为（可以理解为给定的对象是否为本类创建的对象），在JavaScript本地对象中，只要Function对象实现了这个属性Scope对象作用域链定义了一个函数的执行环境对象属性4.1对象简介第4章JavaScript对象J27

对象字面量模式创建对象varperson={name:'Nicholas';age:'22';job:"softwareEngineer";sayName:function(){alter(); }}4.2创建对象第4章JavaScript对象JavaScript程序设计对象字面量模式创建对象4.2创建对象第4章JavaSc28

工厂模式创建对象functioncreatePerson(name,age,job){ varo=newObject(); =name; o.age=age; o.job=job; o.sayName=function(){ alert(); }; returno;}varperson1=createPerson("Nicholas",22,"softwareEngineer");varperson2=createPerson("Greg",24,"student");4.2创建对象第4章JavaScript对象JavaScript程序设计工厂模式创建对象4.2创建对象第4章JavaScrip29

构造函数模式创建对象functionPerson(name,age,job){ =name; this.age=age; this.job=job; this.sayName=function(){ alert(); }}//通过new操作符创建Person的实例varperson1=newPerson("Nicholas",22,"softwareEngineer");varperson2=newPerson("Greg",24,"student");person1.sayName();person2.sayName();4.2创建对象第4章JavaScript对象JavaScript程序设计构造函数模式创建对象4.2创建对象第4章JavaScr30

原型模式创建对象functionPerson(){}P="Nicholas";Ptotype.age=22;Ptotype.job="softwareEngineer";Ptotype.sayName(){ alert();};varperson1=newPerson();person1.sayName();//Nicholasalert(person1.sayName==person2.sayName);//true4.2创建对象第4章JavaScript对象JavaScript程序设计原型模式创建对象4.2创建对象第4章JavaScrip31组合使用构造函数模式和原型模式创建对象4.2创建对象第4章JavaScript对象JavaScript程序设计组合使用构造函数模式和原型模式创建对象4.2创建对象第4章32

动态原型模式创建对象functionPerson(name,age){ =name; this.age=age; this.job=job; //方法

if(typeofthis.sayName!='function'){ Ptotype.sayName=function(){ alert(); }; }}varfriend=newPerson('Nicholas','22','SoftwareEngineer');//初次调用构造函数，此时修改了原型varperson2=newPerson('amy','21');//此时sayName()方法已经存在，不会再修改原型4.2创建对象第4章JavaScript对象JavaScript程序设计动态原型模式创建对象4.2创建对象第4章JavaScr33

任务1.任务介绍定义一个Person对象，对象包括属性姓名，并获取实例化对象Person的姓名信息。2.任务目标学会JavaScript几种创建对象模式及全局变量的存储机制。3.实现思路1）选用构造函数模式创建对象，并且将属性为方法的属性定义到函数之外。2）全局变量是绑定在window对象上的，是window对象的属性。4.2创建对象第4章JavaScript对象JavaScript程序设计任务4.2创建对象第4章JavaScript对象Jav34

对象的四种特性

抽象性封装性继承性多态性4.3对象特性第4章JavaScript对象JavaScript程序设计对象的四种特性4.3对象特性第4章JavaScript35

任务1.任务介绍定义一个Student类作为Person类的子类，在Student类中继承父类的walk()方法、重新定义父类的sayHello()方法并添加Student类自己的sayGoodBye()方法。2.任务目标理解JavaScript面向对象的四大特性并掌握创建对象的方法。3.实现思路1）选用构造函数模式创建对象，并且将属性为方法的属性定义到函数之外。2）全局变量是绑定在window对象上的，是window对象的属性。4.3对象特性第4章JavaScript对象JavaScript程序设计任务4.3对象特性第4章JavaScript对象Jav36

Global对象

Global对象是JavaScript中最特别的对象，因为实际上它根本不存在。Global对象在某种意义上是作为一个终极的「兜底儿对象」来定义的。换句话说，不属于任何其他对象的属性和方法，最终都是它的属性和方法。所有在全局作用域中定义的属性和函数，都是Global对象的属性。4.4单体内置对象第4章JavaScript对象JavaScript程序设计Global对象4.4单体内置对象第4章JavaScr37

Global对象常用内置方法（1）URI编码方法（2）eval()方法4.4单体内置对象第4章JavaScript对象JavaScript程序设计Global对象常用内置方法4.4单体内置对象第4章J38

Global对象的属性4.4单体内置对象第4章JavaScript对象JavaScript程序设计属性释义undefined特殊值undefinedNaN特殊值NaNInfinity特殊值InfinityObject构造函数ObjectArray构造函数ArrayFunction构造函数FunctionBoolean构造函数BooleanString构造函数StringNumber构造函数NumberDate构造函数DateRegExp构造函数RegExpError构造函数ErrorEvalError构造函数EvalErrorRangeError构造函数RangeErrorReferenceError构造函数ReferenceErrorSyntaxError构造函数SyntaxErrorTypeError构造函数TypeErrorURIError构造函数URIErrorGlobal对象的属性4.4单体内置对象第4章Java39

Math对象属性4.4单体内置对象第4章JavaScript对象JavaScript程序设计属性释义Math.E自然对数的底数，即常量e的值Math.LN1010的自然对数Math.LN22的自然对数Math.LOG2E以2为底e的对数M