JavaScript对象及初识面向对象.pptx

第四章 JavaScript对象及初识面向对象预习检查集中测试简述创建对象的两种方法，以及两者的区别简述使用构造函数创建实例的步骤简述原型链在继承中的作用在原型链中什么指向构造函数？/44回顾与作业点评使用层次关系访问节点的属性有哪些？举例说明如何把一个新建节点插在网页中某节点的后面？页面中有一个ID为book的<p>元素，当鼠标移至其上时，使用两种方法使字体大小由原来的12px变为20px，背景颜色由原来的白色变为浅灰色点评作业的提交情况和共性问题提问作业点评/44本章任务创建person对象创建Person构造函数创建Person对象并画原型链图创建继承Person的Student子类/44本章目标了解什么是对象和面向对象会创建对象理解什么是构造函数和对象原型理解什么是原型链并且使用对象继承，会画原型链图/44回顾JavaScript数据类型/44JavaScript中的基本数据类型number(数值类型)string(字符串类型)boolean(布尔类型)null(空类型)undefined(未定义类型)object字符串对象是什么对象是包含相关属性和方法的集合体属性方法…...数字对象什么是面向对象面向对象仅仅是一个概念或者编程思想通过一种叫做原型的方式来实现面向对象编程日期数组/44创建对象/44自定义对象内置对象自定义对象2-1基于Object对象的方式创建对象var 对象名称=new Object( );通过 . 添加属性和方法语法示例var flower=new Object(); flower.name="长春花"; flower.genera="夹竹桃科 长春花属"; flower.area="非洲、亚热带、热带以及中国大陆的华东、西南、中南等地"; flower.uses="观赏或用药等"; flower.showName=function(){alert(this.name);} flower.showName();演示示例1：创建对象/44自定义对象2-2使用字面量赋值方式创建对象var flower={ name:"长春花", genera:"夹竹桃科 长春花属", area:"非洲、亚热带、热带以及中国大陆的华东、西南、中南等地", uses:"观赏或用药等", showName:function(){ alert(this.name); } } flower.showName();示例演示示例2：字面量创建对象/44内置对象2-1常见的内置对象String（字符串）对象Date（日期）对象Array（数组）对象Boolean（逻辑）对象Math（算数）对象RegExp对象/44内置对象2-2Array（数组）对象length属性sort( )、concat( )、join( )方法Math（算数）对象round( )、max( )、min( )方法……String（字符串）对象length属性indexOf( )方法、replace( )方法RegExp对象RegExp是正则表达式的缩写Boolean（逻辑）对象true或者falsetoString( )方法Date（日期）对象get×××：获取年、月、日、时、分、秒等等set×××：设置年、月、日、时、分、秒等等/44学员操作—创建person对象练习需求说明基本Object对象的方式创建person对象使用“.”为对象person添加属性name、age、job和address添加方法intro( )，在页面上显示对象属性name、age、job和address的值/44学员操作—创建person对象2-2练习实现思路使用new创建对象person var person=new Object();使用“.”添加属性 person.name="朗晓明"; person.age="38";使用+把各属性的值拼接起来，使用innerHTML为页面元素赋值 var str="姓名："+this.name+"<br/>年龄："+this.age+"……; document.getElementById("intro").innerHTML=str;完成时间：20分钟/44共性问题集中讲解常见问题及解决办法代码规范问题调试技巧共性问题集中讲解/44构造函数和原型对象问题如何解决使用同一个接口不需要创建很多对象，减少产生大量的重复代码？构造函数原型对象/44构造函数构造函数创建特定类型的对象this变量new操作符/44创建构造函数function Flower(name,genera,area,uses){ this.name=name; ……. this.showName=function(){ alert(this.name); } } var