JavaScript程序设计完整版课件全套ppt最全电子教案整书教案教学设计教学教程.pptx

JavaScript程序设计程序设计第第1章章 JavaScript简介简介1.1 什么是JavaScript1.2 JavaScript与Java区别1.3 JavaScript能做什么1.4 JavaScript实现JavaScript程序设计程序设计第第1章章 JavaScript简介简介1.5 JavaScript环境搭建1.6 编写第一个JavaScript程序JavaScript程序设计程序设计什么是JavaScript特点：简单性简单性 动态性动态性 跨平台性跨平台性 节省服务器的开销节省服务器的开销 JavaScript是一种基于对象(Object)和事件驱动(EventDriven)并具有安全性能的脚本语言。1.1 1.1 什么是什么是JavaScriptJavaScript第1章 JavaScript简介JavaScript程序设计程序设计基于对象和面向对象 解释和编译强变量和弱变量代码格式不一样嵌入方式不一样 静态联编和动态联编1.2 JavaScript1.2 JavaScript与与JavaJava区别区别第1章 JavaScript简介JavaScript程序设计程序设计JavaScript能做什么与用户交互与用户交互 提供反馈提供反馈 创建自定义创建自定义Web界面界面 处理表单处理表单 设置设置cookie1.3 JavaScript1.3 JavaScript能做什么能做什么第1章 JavaScript简介JavaScript程序设计程序设计JavaScript不能做什么（1）JavaScript不允许写服务器机器上的文件。（2）JavaScript不能关闭不是由它自己打开的窗口。（3）JavaScript不能从来自另一个服务器的已经打开的网页中读取信息。1.3 JavaScript1.3 JavaScript能做什么能做什么第1章 JavaScript简介JavaScript程序设计程序设计JavaScript实现1.4 JavaScript1.4 JavaScript实现实现第1章 JavaScript简介JavaScript程序设计程序设计文档对象模型DOMSamplePagehelloworld!1.4 JavaScript1.4 JavaScript实现实现第1章 JavaScript简介JavaScript程序设计程序设计浏览器对象模型BOMBOM主要处理浏览器窗口和框架，不过通常浏览器特定的JavaScript扩展都被看做BOM的一部分:（1）弹出新的浏览器窗口;（2）移动、关闭浏览器窗口以及调整窗口大小;（3）提供 Web浏览器详细信息的定位对象;（4）提供用户屏幕分辨率详细信息的屏幕对象;（5）对 cookie的支持;（6）IE扩展了 BOM，加入了 ActiveXObject类，可以通过 JavaScript实例化 ActiveX对象;1.4 JavaScript1.4 JavaScript实现实现第1章 JavaScript简介JavaScript程序设计程序设计环境搭建 （1）浏览器;（2）Web服务器（wamp）;http:/ JavaScript1.5 JavaScript环境搭建环境搭建第1章 JavaScript简介JavaScript程序设计程序设计示例代码/JavaScriptAppearsherealert(这是第一个JavaScript例子!);alert(欢迎你进入JavaScript世界!);1.6 1.6 编写第一个编写第一个JavaScriptJavaScript程序程序第1章 JavaScript简介JavaScript程序设计程序设计什么是JavaScriptJavaScript与Java区别JavaScript能做什么JavaScript实现JavaScript环境搭建编写第一个JavaScript程序总结总结第1章 JavaScript简介JavaScript程序设计程序设计JavaScript程序设计程序设计第第2章章 JavaScript基本语法基本语法2.1 JavaScript在HTML中的使用2.2 JavaScript代码调试方式2.3 语句2.4 变量JavaScript程序设计程序设计第第2章章 JavaScript基本语法基本语法2.5 数据类型2.6 表达式和运算符2.7 关键字及保留字2.8 正则表达式JavaScript程序设计程序设计第第2章章 JavaScript基本语法基本语法2.9 注释2.10 实战：加减运算JavaScript程序设计程序设计2.1 JavaScript2.1 JavaScript在在HTMLHTML中的使用中的使用两种方式使用 （1）直接在页面上嵌入JavaScript代码；（2）引用独立的js文件；第2章 JavaScript基本语法JavaScript程序设计程序设计2.2 JavaScript2.2 JavaScript代码调试方式代码调试方式三种代码调试方式 （1）使用alert()弹出警告框；（2）使用document.write()方法将内容写到HTML文档中；（3）使用console.log()写入到浏览器控制台；第2章 JavaScript基本语法JavaScript程序设计程序设计2.2 JavaScript2.2 JavaScript代码调试方式代码调试方式三种代码调试方式比较 （1）如果在文档已完成加载后执行document.write，整个HTML页面将被覆盖，对程序执行造成不便；（2）alert()函数会阻断JavaScript程序的执行，从而造成副作用，而且使用alert()方法需要点击弹窗的确认按钮操作麻烦，最重要的是alert()只能输出字符串；（3）console.log()仅在控制台打印相关信息，不会对JavaScript程序执行造成阻隔，此外，console.log()可以接受任何字符串、数字和JavaScript对象，可以看到清楚的对象属性结构，在ajax返回json数组对象时调试很方便；第2章 JavaScript基本语法JavaScript程序设计程序设计2.3 2.3 语句语句语句 JavaScript语句是向浏览器发出的命令；vara=1+2;vara=1+2;varb=abc;第2章 JavaScript基本语法JavaScript程序设计程序设计2.4 2.4 变量变量变量概念及命名 （1）变量以字母开头；（2）变量也能以$和_开头（不过不推荐这么做）；（3）变量名不能包含空格或其他标点符号；（4）变量名称对大小写敏感（a和A是不同的变量）；vara;/声明变量aa=1;/给变量a赋值为1第2章 JavaScript基本语法JavaScript程序设计程序设计2.4 2.4 变量变量变量作用域 （1）全局变量；（2）局部变量；第2章 JavaScript基本语法JavaScript程序设计程序设计2.4 2.4 变量变量变量提升 JavaScript引擎工作方式是：先解析代码，获取所有被声明的变量，然后再一行一行的运行代码。这样所有变量声明语句都会被提升到代码头部执行。这就叫做变量提升。第2章 JavaScript基本语法JavaScript程序设计程序设计2.5 2.5 数据类型数据类型基本数据类型 （1）String类型；（2）Number类型；（3）Boolean类型；（4）Undefined类型；（5）Null类型；第2章 JavaScript基本语法JavaScript程序设计程序设计2.5 2.5 数据类型数据类型引用数据类型 （1）Object类型；（2）Array类型；（3）Date类型；（4）RegExp类型；（5）Function类型；第2章 JavaScript基本语法JavaScript程序设计程序设计2.5 2.5 数据类型数据类型基本数据类型和引用数据类型的区别 （1）声明变量时不同的内存分配；（2）不同的内存分配机制也带来了不同的访问机制；（3）复制变量时的不同；（4）参数传递的不同；第2章 JavaScript基本语法JavaScript程序设计程序设计2.5 2.5 数据类型数据类型数据类型转换 （1）利用转换函数；（2）强制类型转换；（3）利用JavaScript变量弱类型转换；第2章 JavaScript基本语法JavaScript程序设计程序设计2.6 2.6 表达式和运算符表达式和运算符表达式和运算符概念 （1）表达式是各种数值、变量、运算符的综合体，最简单的表达式可以是常量或者变量名称；（2）运算符是变量中用来处理运算数的各种符号；常量表达式：hello；变量表达式：example；赋值表达式：string=”helloworld”。第2章 JavaScript基本语法JavaScript程序设计程序设计2.6 2.6 表达式和运算符表达式和运算符运算符类型 （1）一元运算符；（2）算术运算符；（3）关系运算符；（4）逻辑运算符；（5）位运算符；（6）赋值运算符；（7）其他运算符；第2章 JavaScript基本语法JavaScript程序设计程序设计2.6 2.6 表达式和运算符表达式和运算符运算符优先级 （1）+-+!deletetypeofvoid（一元运算符、返回数据类型、对象创建、未定义值）；（2）*/%（乘法、除法、取余）；（3）+-（加法、减法、字符串连接）；（4）（移位）；（5）=instanceofin（小于、小于等于、大于、大于等于、instanceof）；（6）=!=!=（等于、不等于、严格相等、非严格相等）；（7）&（按位与）；第2章 JavaScript基本语法JavaScript程序设计程序设计2.6 2.6 表达式和运算符表达式和运算符运算符优先级 （8）（按位异或）；（9）|（按位或）；（10）&（逻辑与）；（11）|（逻辑或）；（12）?（条件）；（13）=*=/=%=+=-=&=|=（赋值、运算赋值）；（14）,（多重求值）；第2章 JavaScript基本语法JavaScript程序设计程序设计2.6 2.6 表达式和运算符表达式和运算符运算符优先级 运算符优先级等级：一元运算符 算术运算符 比较运算符 逻辑运算符 三元运算符 赋值运算符 逗号运算符第2章 JavaScript基本语法JavaScript程序设计程序设计2.7 2.7 关键字及保留字关键字及保留字关键字 （1）breakdoinstanceoftypeof；（2）caseelsenewvar；（3）catchfinallyreturnvoid；（4）continueforswitchwhile；（5）debugger*；（6）functionthiswith；（7）defaultifthrow；（8）deleteintry；第2章 JavaScript基本语法JavaScript程序设计程序设计2.7 2.7 关键字及保留字关键字及保留字保留字 （1）abstractenumintshort；（2）booleanexportinterfacestatic；（3）byteextendslongsuper；（4）charfinalnativesynchronized；（5）classfloatpackagethrows；（6）constgotoprivatetransient；（7）debuggerimplementsprotectedvolatile；（8）doubleimportpublic；第2章 JavaScript基本语法JavaScript程序设计程序设计2.8 2.8 正则表达式正则表达式正则表达式定义及特性 正则表达式是对字符串操作的一种逻辑公式，就是用事先定义好的一些特定字符、及这些特定字符的组合，组成一个“规则字符串”，这个“规则字符串”用来表达对字符串的一种过滤逻辑varreg=/abcd/;/这个叫对象直接量方式varreg=newRegExp(abcd);/这个叫构造函数方式varreg=/abcd/g;varreg=newRegExp(abcd,g);reg=newRegExp(w+);/这里的要转义reg=/w+/;/这样就不需要第2章 JavaScript基本语法JavaScript程序设计程序设计2.8 2.8 正则表达式正则表达式正则表达式语法正则表达式是由普通字符（例如字符a到z）以及特殊字符（称为元字符）组成的文字模式。模式描述在搜索文本时要匹配一个或多个字符串。正则表达式作为一个模板，将某个字符模式与所搜索的字符串进行匹配。第2章 JavaScript基本语法JavaScript程序设计程序设计2.8 2.8 正则表达式正则表达式普通字符 普通字符包括没有显式指定为元字符的所有可打印和不可打印字符。这包括所有大写和小写字母、所有数字、所有标点符号和一些其他符号；第2章 JavaScript基本语法JavaScript程序设计程序设计2.8 2.8 正则表达式正则表达式非打印字符第2章 JavaScript基本语法JavaScript程序设计程序设计字符字符描述描述cx匹配由x指明的控制字符。例如，cM匹配一个Control-M或回车符。x的值必须为A-Z或a-z之一。否则，将c视为一个原义的c字符。f匹配一个换页符。等价于x0c和cL。n匹配一个换行符。等价于x0a和cJ。r匹配一个回车符。等价于x0d和cM。s匹配任何空白字符，包括空格、制表符、换页符等等。等价于fnrtv。S匹配任何非空白字符。等价于fnrtv。t匹配一个制表符。等价于x09和cI。v匹配一个垂直制表符。等价于x0b和cK。2.8 2.8 正则表达式正则表达式特殊字符第2章 JavaScript基本语法JavaScript程序设计程序设计特殊字符特殊字符描述描述$匹配输入字符串的结尾位置。如果设置了RegExp对象的Multiline属性，则$也匹配n或r。要匹配$字符本身，请使用$。()标记一个子表达式的开始和结束位置。子表达式可以获取供以后使用。要匹配这些字符，请使用(和)。*匹配前面的子表达式零次或多次。要匹配*字符，请使用*。+匹配前面的子表达式一次或多次。要匹配+字符，请使用+。.匹配除换行符n之外的任何单字符。要匹配.，请使用.。标记一个中括号表达式的开始。要匹配，请使用。?匹配前面的子表达式零次或一次，或指明一个非贪婪限定符。要匹配?字符，请使用?。将下一个字符标记为或特殊字符、或原义字符、或向后引用、或八进制转义符。例如，n匹配字符n。n匹配换行符。序列匹配，而(则匹配(。匹配输入字符串的开始位置，除非在方括号表达式中使用，此时它表示不接受该字符集合。要匹配字符本身，请使用。标记限定符表达式的开始。要匹配，请使用。|指明两项之间的一个选择。要匹配|，请使用|。2.8 2.8 正则表达式正则表达式限定符第2章 JavaScript基本语法JavaScript程序设计程序设计字符字符描述描述*匹配前面的子表达式零次或多次。例如，zo*能匹配z以及zoo。*等价于0,。+匹配前面的子表达式一次或多次。例如，zo+能匹配zo以及zoo，但不能匹配z。+等价于1,。？匹配前面的子表达式零次或一次。例如，do(es)?可以匹配do或does中的do。?等价于0,1。nn是一个非负整数。匹配确定的n次。例如，o2不能匹配Bob中的o，但是能匹配food中的两个o。n,n是一个非负整数。至少匹配n次。例如，o2,不能匹配Bob中的o，但能匹配foooood中的所有o。o1,等价于o+。o0,则等价于o*。n,mm和n均为非负整数，其中n30)alert(i大于30);elseif(i0)alert(i小于0);elsealert(i在0到30之间);第3章 JavaScript程序构成JavaScript程序设计程序设计3.1 3.1 程序控制流程序控制流for循环语句 for(initialization;expression;post-loop-expression)statement;varcount=10;for(vari=0;icount;i+)alert(i);第3章 JavaScript程序构成JavaScript程序设计程序设计3.1 3.1 程序控制流程序控制流for.in循环语句 for(propertyinexpression)statement;for(varpropNameinwindow)document.write(propName);第3章 JavaScript程序构成JavaScript程序设计程序设计3.1 3.1 程序控制流程序控制流while循环语句 while(expression)statement;vari=0;while(i10)alert(i);i+=2;第3章 JavaScript程序构成JavaScript程序设计程序设计3.1 3.1 程序控制流程序控制流label语句 label:statementstarti:5第3章 JavaScript程序构成JavaScript程序设计程序设计3.1 3.1 程序控制流程序控制流break和continue语句 break和continue语句用于循环中精确地控制代码的执行。break语句可以立即退出循环，阻止再次反复执行任何代码。而continue语句只是退出当前循环，根据控制表达式还允许继续进行下一次循环。第3章 JavaScript程序构成JavaScript程序设计程序设计3.1 3.1 程序控制流程序控制流do.while语句 dostatements;while(condition)dox=x+Thenumberis+i+;i+;while(i5);第3章 JavaScript程序构成JavaScript程序设计程序设计3.1 3.1 程序控制流程序控制流switch语句 switch(expression)casevalue:statement;break;default:statement;第3章 JavaScript程序构成JavaScript程序设计程序设计3.2 3.2 函数函数函数表达式及语法 两种常用的定义函数方式：第一种：使用函数声明语法，第二种：使用函数表达式定义。functionsum(num1,num2)/函数体varsum=function(num1,num2)/函数体;第3章 JavaScript程序构成JavaScript程序设计程序设计3.2 3.2 函数函数函数参数 JavaScript函数的参数与大多数其他语言的函数参数有所不同。函数不介意传递进来多少个参数，也不在乎传进来的参数是什么数据类型。甚至可以不传参数。第3章 JavaScript程序构成JavaScript程序设计程序设计3.2 3.2 函数函数函数返回值 JavaScript函数返回值关键字是return。一个函数内处理的结果可以使用return返回，这样在调用函数的地方就可以用变量接收返回结果。第3章 JavaScript程序构成JavaScript程序设计程序设计3.2 3.2 函数函数函数4种调用模式 （1）函数调用模式；（2）方法调用模式；（3）构造器调用模式；（4）Apply调用模式；第3章 JavaScript程序构成JavaScript程序设计程序设计3.2 3.2 函数函数apply和call的区别 call方法：方法：语法定义为：call(thisObj,arg1,arg2,.argN)参数thisObj为可选项。将被用作当前对象的对象。arg1，arg2，argN也为可选项，传递的参数序列；apply方法：方法：语法定义为：apply(thisObj,argArray)；第3章 JavaScript程序构成JavaScript程序设计程序设计3.2 3.2 函数函数递归调用递归函数：就是在函数体内调用函数本身。functionfactorial(num)if(num=1)return1;elsereturnnum*factorial(num-1);第3章 JavaScript程序构成JavaScript程序设计程序设计3.2 3.2 函数函数函数作用域varscope=global;functionfun()console.log(scope);varscope=local;console.log(scope);fun();第3章 JavaScript程序构成JavaScript程序设计程序设计3.2 3.2 函数函数异常处理try/可能发生错误的代码catch(error)/发生错误时处理方式第3章 JavaScript程序构成JavaScript程序设计程序设计3.2 3.2 函数函数闭包 闭包就是能够读取其他函数内部变量的函数；functionfun1()varn=999;nAdd=function()n+=1functionfun2()console.log(n);returnfun2;varresult=fun1();result();nAdd();result();第3章 JavaScript程序构成JavaScript程序设计程序设计3.3 3.3 事件及事件处理事件及事件处理事件 JavaScript与HTML之间的交互是通过事件来实现的。事件，就是文档或浏览器窗口中发生的一些特定的交互瞬间。第3章 JavaScript程序构成JavaScript程序设计程序设计3.3 3.3 事件及事件处理事件及事件处理常用事件 （1）窗口事件：onLoad、onUnload、onResize、onMove、onAbort、onError、onFocus、onBlur；（2）鼠标事件：onClick、onDbClick、onMouseDown、onMouseUp、onMouseOver、onMouseOut、onMouseMove；（3）表单事件：onBlur、onChange、onFocus、onReset、onSubmit；（4）键盘事件：onKeyPress、onKeyDown、onKeyUp；第3章 JavaScript程序构成JavaScript程序设计程序设计3.4 3.4 实战：实战：BingoBingo卡片游戏卡片游戏实战 （1）案例描述）案例描述 用JavaScript循环实现Bingo卡片游戏。Bingo卡片是5*5的方形，5个列上标着B-I-N-G-O，格子里包含175的数字。正中间通常是一个空的格子，印着单词free。每列可以包含的数字的范围是：B列包含数字115；I列包含数字1630；N列包含数字3145；G列包含数字4660；O列包含数字6175。（2）实现思路）实现思路 Bingo卡片总共有24个空格需要填充数字，且每个数字互不重复；每列数字有固定的取值范围。这样首先需要创建一个for循环，用i作循环变量，循环24次；每次循环调用函数依次往Bingo卡片中的空格插入数字。第3章 JavaScript程序构成JavaScript程序设计程序设计总结总结程序控制流函数事件及事件处理第3章 JavaScript程序构成JavaScript程序设计程序设计JavaScript程序设计程序设计第第4章章 JavaScript对象对象4.1 对象简介4.2 创建对象4.3 对象特性4.4 单体内置对象JavaScript程序设计程序设计第第4章章 JavaScript对象对象4.5 实战：产生n个不重复随机数JavaScript程序设计程序设计4.1 4.1 对象简介对象简介对象 所谓对象，就是一种无序的数据集合，由若干个“键值对”（key-value）构成；varo=p:HelloWorld;第4章 JavaScript对象JavaScript程序设计程序设计4.1 4.1 对象简介对象简介对象属性第4章 JavaScript对象JavaScript程序设计程序设计属性属性属性类型属性类型描述描述Prototype对象对象的原型，用来实现继承功能的关键对象Class字符串描述对象类型的字符串值，使用typeof操作符返回的结果Get函数返回属性值。获取指定属性名的值Put函数设置指定的属性值。为指定的属性赋值CanPut函数返回指定属性是否可用通过Put操作设置值HasProperty函数返回对象是否有指定的属性Delete函数从对象中删除指定属性DefaultValue函数返回对象的默认值，只能是原始值，不能是引用类型Construct函数通过new操作符创建一个对象。实现了这个内部属性的对象被叫做构造函数（可以理解为类）Call函数执行关联在对象上的代码，通过函数表达式调用（也就是通过函数名调用函数），实现了这个内部方法的对象被叫做函数HasInstance函数返回给定的值是否扩展了当前对象的属性和行为（可以理解为给定的对象是否为本类创建的对象），在JavaScript本地对象中，只要Function对象实现了这个属性Scope对象作用域链定义了一个函数的执行环境4.2 4.2 创建对象创建对象对象字面量模式创建对象varperson=name:Nicholas;age:22;job:softwareEngineer;sayName:function()alter(this.name);第4章 JavaScript对象JavaScript程序设计程序设计4.2 4.2 创建对象创建对象工厂模式创建对象functioncreatePerson(name,age,job)varo=newObject();o.name=name;o.age=age;o.job=job;o.sayName=function()alert(this.name);returno;varperson1=createPerson(Nicholas,22,softwareEngineer);varperson2=createPerson(Greg,24,student);第4章 JavaScript对象JavaScript程序设计程序设计4.2 4.2 创建对象创建对象构造函数模式创建对象functionPerson(name,age,job)this.name=name;this.age=age;this.job=job;this.sayName=function()alert(this.name);/通过new操作符创建Person的实例varperson1=newPerson(Nicholas,22,softwareEngineer);varperson2=newPerson(Greg,24,student);person1.sayName();person2.sayName();第4章 JavaScript对象JavaScript程序设计程序设计4.2 4.2 创建对象创建对象原型模式创建对象functionPerson()Person.prototype.name=Nicholas;Person.prototype.age=22;Person.prototype.job=softwareEngineer;Person.prototype.sayName()alert(this.name);varperson1=newPerson();person1.sayName();/Nicholasalert(person1.sayName=person2.sayName);/true第4章 JavaScript对象JavaScript程序设计程序设计4.2 4.2 创建对象创建对象组合使用构造函数模式和原型模式创建对象第4章 JavaScript对象JavaScript程序设计程序设计4.2 4.2 创建对象创建对象动态原型模式创建对象functionPerson(name,age)this.name=name;this.age=age;this.job=job;/方法if(typeofthis.sayName!=function)Person.prototype.sayName=function()alert(this.name);varfriend=newPerson(Nicholas,22,SoftwareEngineer);/初次调用构造函数，此时修改了原型varperson2=newPerson(amy,21);/此时sayName()方法已经存在，不会再修改原型第4章 JavaScript对象JavaScript程序设计程序设计4.2 4.2 创建对象创建对象任务1.任务介绍任务介绍定义一个Person对象，对象包括属性姓名，并获取实例化对象Person的姓名信息。2.任务目标任务目标学会JavaScript几种创建对象模式及全局变量的存储机制。3.实现思路实现思路1）选用构造函数模式创建对象，并且将属性为方法的属性定义到函数之外。2）全局变量是绑定在window对象上的，是window对象的属性。第4章 JavaScript对象JavaScript程序设计程序设计4.3 4.3 对象特性对象特性对象的四种特性 抽象性 封装性 继承性 多态性 第4章 JavaScript对象JavaScript程序设计程序设计4.3 4.3 对象特性对象特性任务1.任务介绍任务介绍定义一个Student类作为Person类的子类，在Student类中继承父类的walk()方法、重新定义父类的sayHello()方法并添加Student类自己的sayGoodBye()方法。2.任务目标任务目标理解JavaScript面向对象的四大特性并掌握创建对象的方法。3.实现思路实现思路1）选用构造函数模式创建对象，并且将属性为方法的属性定义到函数之外。2）全局变量是绑定在window对象上的，是window对象的属性。第4章 JavaScript对象JavaScript程序设计程序设计4.4 4.4 单体内置对象单体内置对象Global对象 Global对象是JavaScript中最特别的对象，因为实际上它根本不存在。Global对象在某种意义上是作为一个终极的兜底儿对象来定义的。换句话说，不属于任何其他对象的属性和方法，最终都是它的属性和方法。所有在全局作用域中定义的属性和函数，都是Global对象的属性。第4章 JavaScript对象JavaScript程序设计程序设计4.4 4.4 单体内置对象单体内置对象Global对象常用内置方法 （1）URI编码方法 （2）eval()方法第4章 JavaScript对象JavaScript程序设计程序设计4.4 4.4 单体内置对象单体内置对象Global对象的属性第4章 JavaScript对象JavaScript程序设计程序设计属性属性释义释义undefined特殊值undefinedNaN特殊值NaNInfinity特殊值InfinityObject构造函数ObjectArray构造函数ArrayFunction构造函数FunctionBoolean构造函数BooleanString构造函数StringNumber构造函数NumberDate构造函数DateRegExp构造函数RegExpError构造函数ErrorEvalError构造函数EvalErrorRangeError构造函数RangeErrorReferenceError构造函数ReferenceErrorSyntaxError构造函数SyntaxErrorTypeError构造函数TypeErrorURIError构造函数URIError4.4 4.4 单体内置对象单体内置对象Math对象属性第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的平方根4.4 4.4 单体内置对象单体内置对象Math对象方法 （1）min()和 max()方法；（2）舍入方法：Math.ceil()、Math.floor()和 Math.round()；（3）random()方法；（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的正切值4.5 4.5 实战：产生实战：产生n n个不重复随机数个不重复随机数实战 （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章 JavaScript对象JavaScript程序设计程序设计总结总结对象简介创建对象对象特性单体内置对象第4章 JavaScript对象JavaScript程序设计程序设计JavaScript程序设计程序设计第第5章章 JavaScript数组数组5.1 数组及数组元素5.2 添加和删除元素5.3 二维及多维数组5.4 数组常用方法JavaScript程序设计程序设计第第5章章 JavaScript数组数组5.5 实战：计算产品销售额JavaScript程序设计程序设计5.1 5.1 数组及数组元素数组及数组元素数组数组是一种数据类型，它包含或者存储了编码的值。每个编码的值称作该数组的一个元素，每个元素的编码被称作下标。varclass1_array=newArray(95,89,60,.,100);varclass2_array=newArray(45,89,90,.,88);varclass3_array=newArray(91,85,62,.,79);varclass4_array=newArray(65,80,90,.,100);varclass5_array=newArray(90,80,69,.,100);varclass6_array=newArray(99,89,67,.,100);第5章 JavaScript数组JavaScript程序设计程序设计5.1 5.1 数组及数组元素数组及数组元素数组操作 （1）数组创建 （2）数组读写第5章 JavaScript数组JavaScript程序设计程序设计5.2 5.2 添加和删除元素添加和删除元素添加删除数组元素 （1）直接把值赋给数组中最后一个空位上的元素即可；numbersnumbers.length=10;（2）使用数组push方法，把元素添加到数组末尾；numbers.push(10);（3）unshift可以直接把数值插入数组的首位；numbers.unshift(-2);（4）pop删除数组最后一个元素；numbers.pop();（5）要真正删除第一个元素，可以使用数组的shift方法；numbers.shift();（6）splice方法从一个数组中移除一个或多个元素；numbers.splice(5,3);第5章 JavaScri