《WEB前端开发技术实用教程》课件第06章 Javascript内部对象.pptx

1、1 1目录6.1 对象概述及对象分类6.2 数组对象Array6.3 数学对象Math6.4 字符串对象String6.5 正则表达式6.6 日期对象Date6.1 对象概述及对象分类u 对象是对某一类事物的描述，其成员包括属性和方法。u 对象是属性和和方法的组合u 对象成员：属性、方法 属性：变量，描述对象的特征；方法：对属性进行操作的函数；对象的属性和方法都叫对象的成员例如：汽车Ferrari对象：汽车属性：型号：法拉利颜色：绿色方法：前进、刹车、倒车6.1 对象概述及对象分类u对象实例：一类事物中的具体个例。u构造函数：用来创建对象实例的函数u创建对象实例：使用new关键字和对象的构造函

2、数u语法格式如下：var objInstance=new ObjName(传递给该对象的实际参数列表);u成员的操作：.运算符，表示引用 对象.属性 对象.方法(参数列表)6.1 对象概述及对象分类uJavascript使用对象途径：q三类对象三类对象 浏览器对象浏览器对象 内部对象内部对象 HTML 对象对象 l浏览器窗口windowl文档 documentlurl地址等lString字符串对象lDate日期对象lMath数学对象等 各种HTML标签:l段落l图片l超链接等Javascript内部对象uArray：数组对象uMath:数学对象uDate：日期对象uString：字符串对象uR

3、egExp：正则表达式对象JavaScript 内部对象u内部对象都有自己的方法和属性u访问属性的语法是：“对象名.属性名称”。u访问方法的语法是：“对象名.方法名称（参数表）”u动态对象使用“对象实例名.成员”的格式来访问其属性和方法;引用时必须创建一个实例，如Date对象u静态对象直接使用“对象名.成员”的格式来访问其属性和方法。引用对象的属性或方法时不需要为它创建实例,如String对象6.2 数组对象Arrayu数组是可以记录不同类型数据的集合，主要由数组元素构成，每一个数组元素有对应的下标，不同的数组元素是通过下标来进行区分和使用的。6.2 数组对象Array1、创建Array对象：

4、var arrayObj=new Array();创建一个空数组对象 var arrayObj=new Array(size);创建一个指定长度的数组对象 var arrayObj=new Array(element0,element1,.,elementN);创建一个数组对象，并对各个数组元素进行初始化赋值。var arrayObj=element0,element1,element2,elementN;6.2 数组对象Array2、数组元素的添加（1）在定义Array对象时直接输入数据元素（2）通过赋值语句向每个数组元素输入数据（3）利用for语句向Array对象中输入数据6.2 数组对象

5、Array3.数组元素的访问和输出（1）用下标获取指定元素值（2）用for或forin语句获取数组中的元素值（3）用数组对象名输出所有元素值6.2 数组对象Array4.Array对象的属性length属性：获取数组的长度6.2 数组对象Array5.Array对象的方法方法描述concat()连接两个或更多的数组，并返回结果。join()把数组的所有元素放入一个字符串。元素通过指定的分隔符进行分隔。pop()删除并返回数组的最后一个元素push()向数组的末尾添加一个或更多元素，并返回新的长度。reverse()颠倒数组中元素的顺序。shift()删除并返回数组的第一个元素slice()从某

6、个已有的数组返回选定的元素sort()对数组的元素进行排序splice()删除元素，并向数组添加新元素。toSource()返回该对象的源代码。toString()把数组转换为字符串，并返回结果。toLocaleString()把数组转换为本地数组，并返回结果。unshift()向数组的开头添加一个或更多元素，并返回新的长度。valueOf()返回数组对象的原始值var emp=new Array(3);emp0=Ryan Dias;emp1=Graham Browne;emp2=David Greene;emp.sort();document.write(“排序结果是：);document.

7、write(emp0+);document.write(emp1+);document.write(emp2+);6.2 数组对象Array实例：数组的排序146.3 Math对象uMath对象是一个静态对象，u不能使用new关键字创建对象实例，应直接使用“对象名.成员”的格式访问其属性或方法，例如：var num=Math.random();6.3 Math对象名称 说 明属性PI 的值，约等于 3.1415LN1010 的自然对数的值，约等于 2.302EEuler 的常量的值，约等于 2.718。Euler 的常量用作自然对数的底数abs(y)返回 y 的绝对值sin(y)返回 y 的正

8、弦，返回值以弧度为单位。cos(y)返回 y 的余弦，返回值以弧度为单位tan(y)返回 y 的正切，返回值以弧度为单位 min(x,y)返回 x 和 y 两个数中较小的数 max(x,y)返回 x 和 y 两个数中较大的数 random()返回0-1的随机数方法round(y)四舍五入取整ceil(y)进一取整floor(y)舍去取整sqrt(y)返回 y 的平方根6.3 Math对象获得某个范围内随机数的公式：number=Math.floor(Math.random()*total_number_of_choices+first_possible_value);例如：希望取值的随机数范围

9、在299之间，有98个数字，第一个值为2，则公式应用如下：var iNum=Math.floor(Math.random()*98+2);6.3 Math对象uuvar i=Math.floor(Math.random()*10+1);udocument.write();案例：每隔案例：每隔5秒随机显示十张图中的任意一张秒随机显示十张图中的任意一张实例：双色球u“双色球”每注投注号码由6个红色球号码和1个蓝色球号码组成。u红色球号码从1-33中选择；蓝色球号码从1-16中选择。6.4 String 对象创建字符串有两种不同方法：u使用 var 语句 varvar newstrnewstr=“=

10、“这是我的字符串这是我的字符串”；u创建 String 对象varvar newstrnewstr=new Stringnew String(“这是我的字符串这是我的字符串”)6.4 String 对象名 称说 明属性length返回字符串的长度 方法big()增大字符串文本 blink()使字符串文本闪烁（IE 浏览器不支持）bold()加粗字符串文本 fontcolor()确定字体颜色 italics()用斜体显示字符串 indexOf(“子字符串”，起始位置)查找子字符串的位置strike()显示加删除线的文本 sub()将文本显示为下标 toLowerCase()将字符串转换成小写 t

11、oUpperCase()将字符串转换成大写 6.4 String 对象名 称说 明方法charAt(索引)返回索引位置的字符indexOf(字串,索引)返回字串在对象中的索引位置lastIndexOf(字串,索引)返回字串在对象中的索引位置（反向搜索）search(字串)返回字串在对象中的索引位置replace(字串1,字串2)字串2替换字串1substr(start,length)返回特定长度的字串substring(索引i,索引j)返回索引i倒索引j-1的子串案例：获取文件名uufunction getfilename()uvar path=document.f.file1.value;u

12、var pos=path.lastIndexOf();uvar filename=path.substr(pos+1);uvar pos1=filename.indexOf(.);uvar houzhui=filename.substr(pos1+1);uwindow.alert(文件名：+filename+后缀：+houzhui);uuuuuuuu请选择文件：u练习：u1、取出EMAIL中的用户名u2、取出路径中的文件名和扩展名(注意路径符号需要转义)u3、定义一字符串：var s=“我喜欢玩游戏，游戏的名字叫游戏人生！”;，将其中的“游戏”全部替换为“网游”。6.5 正则表达式6.5.1

13、正则表达式介绍6.5.2 正则表达式语法6.5.3 RegExp对象6.5.1 正则表达式介绍u规则（regular）和表达式（expression），定义了某些字符的特殊语义和使用规则，组合形成相应表达式，执行字符串的操作功能。u作用主要有：验证格式 替换 分割6.5.2 正则表达式语法u1、组成 原子：正则表达式最基本组成单位 元字符：修饰原子，限定原子的重复次数 模式修正符：扩展了正则表达式在字符匹配、替换操作时的某些功能u2、定界符：一对斜线/，其他可作为定界符的字符，如#,!,|等；字母、数字、不作为定界符。6.5.2 正则表达式语法u3.正则表达式分类符号 边界：b,B,$量词：*

14、,+,?,n,n,n,m,?全局匹配：.选择符：|原子表：,-特殊字符：d,D,w,W,s,S,xn,un6.5.3 RegExp对象u1、创建RegExp对象u（1）直接量语法 u var patt1=/pattern/attributesu（2）创建 RegExp 对象 u var patt1=new RegExp(pattern,attributes);6.5.3 RegExp对象u2、RegExp对象的属性属性描述globalRegExp 对象是否具有标志 g。布尔值，若全局选项g已设置则返回true，否则返回falseignoreCaseRegExp 对象是否具有标志 i。布尔值，若

15、忽略大小写选项i已设置则返回true，否则返回falselastIndex一个整数，标示开始下一次匹配的字符位置。multilineRegExp 对象是否具有标志 m。布尔值，表示多行模式选项m是否设置，若设置则返回true，否则返回falsesource正则表达式的源文本。6.5.3 RegExp对象u3、RegExp对象的方法方法描述compile编译正则表达式。exec检索字符串中指定的值。返回找到的值，并确定其位置。test检索字符串中指定的值。返回 true 或 false。6.5.3 RegExp对象utest()方法验证邮箱function chkemail()var email

16、=document.getElementById(email).value;var mode=/w+(-+.w+)*w+(-.w+)*.w+(-.w+)*$/;/第一种定义正则方法/var mode=new RegExp(/w+(-+.w+)*w+(-.w+)*.w+(-.w+)*$/);/第二种定义正则方法if(mode.test(email)alert(邮箱格式正确);elsealert(邮箱格式错误);6.6 日期对象（Date）u在web开发过程中，Date对象用来实现对日期和时间的控制。u如果想在页面上显示计时时钟，就得重复生成新的Date对象来获取计算机的当前时间。uDate 对象

17、存储的日期为自 1970 年 1 月 1 日 00:00:00 以来的毫秒数。6.6 日期对象（Date）Date 对象的创建：语法格式如下：1.返回当前的日期和时间，代码如下：如：var today=new Date()；2.用年、月、日来创建日期对象 如：var newDate=new Date(2010,10,1);3.用年、月、日、小时、分钟、秒来创建日期对象：var newDate=new Date(2010,10,1,8,20,50);4.以字符串形式创建日期对象：var mydate=new Date(“July 29,1998 10:30:00”)var mydate=new

18、Date(July 29,1998)6.6 日期对象（Date）Get 方法：方法说明getDate返回 Date 对象中月份中的天数，其值介于 1 至 31 之间getDay返回 Date 对象中的星期几，其值介于 0 至 6 之间getHours返回 Date 对象中的小时数，其值介于 0 至 23 之间getMinutes返回 Date 对象中的分钟数，其值介于 0 至 59 之间getSeconds返回 Date 对象中的秒数，其值介于 0 至 59 之间getMonth返回 Date 对象中的月份，其值介于 0 至11 之间getYear返回 Date 对象中的年份，其值为两位或四位

19、数；getFullYear返回Date对象中的四位年份，一般代替getYear()getTime返回自某一时刻（1970 年 1 月 1 日）以来的毫秒数6.6 日期对象（Date）用作 Date 方法的参数的整数：值整 数 Seconds和 minutes0 至 59 Hours0 至 23 Day0 至 6（星期几,0表示星期天）Date1 至 31（月份中的天数）Months0 至 11（一月至十二月）6.6 日期对象（Date）Set 方法：方法说明setDate设置 Date 对象中月份中的天数，其值介于 1 至 31 之间。setHours设置 Date 对象中的小时数，其值介于

20、0 至 23 之间。setMinutes设置 Date 对象中的分钟数，其值介于 0 至 59 之间。setSeconds设置 Date 对象中的秒数，其值介于 0 至 59 之间。setTime设置 Date 对象中的时间值。setMonth设置 Date 对象中的月份，其值介于 1 至 12 之间。6.6 日期对象（Date）u var curr=new date();document.write(今天是);switch(curr.getday()case 0:document.write(周日,休息了！);break;case 1:document.write(周一,需要工作！);bre

21、ak;case 2:document.write(周二,需要工作！);break;case 3:document.write(周三,需要工作！);break;case 4:document.write(周四,需要工作！);break;case 5:document.write(周五,需要工作！);break;case 6:document.write(周六,休息了！);break;案例案例1：var now=new date();var hour=now.gethours();if(hour=0&hour 12&hour18&hour 24)document.write(晚上好!);docum

22、ent.write(今天日期:+now.getyear()+年“+(now.getmonth()+1)+月+now.getdate()+日);document.write(现在时间:+now.gethours()+点+now.getminutes()+分);6.6 日期对象（Date）获得当前日期和时间获得小时，即当前是几点判断上午、下午还是晚上月份数字011，注意1392.2.4 日期对象（Date）usetTimeout的用法：setTimeout（“调用的函数”,”定时的时间”）例：var myTimesetTimeout（”disptime()”,1000）;clearTimeout（myTime）;隔1000毫秒调用函数disptime()执行关闭定时器本例的时间可以采用定时显示，使用定时器函数，隔1秒调用disptime()函数显示时间课后思考u如何显示当前日期，时间和中文的星期几？u做一个会走动的时钟显示传道，授业，解惑