JavaScript概述和基础语法.ppt

JavaScript第一章第一章:概述和基础语法概述和基础语法 目录目录l脚本的基本结构脚本的基本结构lJavaScript的组成的组成lJavaScript的基本语法的基本语法l定义和使用函数定义和使用函数 为什么要学为什么要学JavaScriptl表单验证减轻服务器端压力表单验证减轻服务器端压力l页面动态效果页面动态效果使用使用JavaScript实现动态效果不如实现动态效果不如jQuery简洁方便，简洁方便，JavaScript是学习是学习jQuery的基础的基础 什么是什么是JavaScriptlJavaScript是一种基于对象和事件驱动的、并具有安全性是一种基于对象和事件驱动的、并具有安全性能的脚本语言。能的脚本语言。lJavaScript特点特点向向HTML页面中添加交互行为页面中添加交互行为脚本语言，语法和脚本语言，语法和Java类似类似解释性语言，边执行边解释解释性语言，边执行边解释lJavaScript组成组成DOMJavaScriptECMAScriptBOM JavaScript的基本结构的基本结构l基本结构基本结构!-document.write(输出输出HelloWorld);document.write(HelloWorld);-页面主体内容页面主体内容示例示例经验：经验：可以包含在文档中的任何地方，只要保证这些代码在被使用前已读取并加载到内存即可。JavaScript的执行原理的执行原理 网页中引用网页中引用JavaScript的方式的方式l使用使用标签标签l外部外部JS文件文件l直接在直接在HTML标签中标签中 JavaScript核心语法核心语法l核心语法核心语法语法约定语法约定变量变量数据类型数据类型数组数组运算符号运算符号控制语句控制语句注释注释输入输入/输出输出 核心语法核心语法-语法约定语法约定l代码区分大小写代码区分大小写l变量、对象和函数的名称变量、对象和函数的名称l分号分号 核心语法核心语法-变量变量l先声明变量再赋值先声明变量再赋值l同时声明和赋值变量同时声明和赋值变量l不声明直接赋值不声明直接赋值varwidth;width=5;varcatName=“皮皮皮皮”;varx,y,z=10;width=5;核心语法核心语法-数据类型数据类型l数据类型数据类型undefinednullnumberbooleanstringvarwidth;变量变量width没有初始值，将被赋予值没有初始值，将被赋予值undefinedvariNum=23;/整数整数variNum=23.0;/浮点数浮点数true和和false表示一个空值，与表示一个空值，与undefined值相等值相等一组被引号（单引号或双引号）括起来的文本一组被引号（单引号或双引号）括起来的文本varstring1=Thisisastring;核心语法核心语法-String对象对象l 属性属性字符串对象字符串对象.lengthl方法方法字符串对象字符串对象.方法名方法名();l常用方法常用方法charAt(index)indexOf(str，index)substring(index1，index2)split(str)在线教程：在线教程：核心语法核心语法-typeof运算符运算符ltypeof检测变量的返回值检测变量的返回值ltypeof运算符返回值如下：运算符返回值如下：undefined：变量被声明后，但未被赋值：变量被声明后，但未被赋值string：用单引号或双引号来声明的字符串：用单引号或双引号来声明的字符串boolean：true或或falsenumber：整数或浮点数：整数或浮点数object：javascript中的对象、数组和中的对象、数组和null 核心语法核心语法数组数组l创建数组创建数组var数组名称数组名称=newArray(size);l为为数组元素赋值数组元素赋值l访问数组访问数组varfruit=newArray(apple,orange,peach,bananer);varfruit=newArray(4);fruit0=apple;fruit1=orange;fruit2=peach;fruit3=bananer;核心语法核心语法-数组数组l常用属性常用属性lengthl常用方法常用方法join()把数组的所有元素通过指定的分隔符进行分隔放入一个字符串（默认用“，”）sort()对数组的元素进行排序push()向数组的末尾添加一个或更多元素，并返回新的长度 核心语法核心语法-运算符号运算符号l算术运算符算术运算符+-*/%+-l赋值赋值运算符运算符=l比较运算符比较运算符=!=l逻辑运算逻辑运算符符&|!核心语法核心语法-逻辑控制语句逻辑控制语句l条件结构条件结构ifswitchl循环结构循环结构whileforl循环中断循环中断breakcontinue 核心语法核心语法注释与输入注释与输入/输出输出l注释注释/*/l输入输入/输出输出alert()alert(“提示信息提示信息”);prompt()prompt(“提示信息提示信息”,“输入框的默认信息输入框的默认信息”);prompt(“请输入姓名请输入姓名”,“张三张三”);prompt(“请输入姓名请输入姓名”);函数函数l函数函数类似于类似于Java中的方法，是完成特定任务的代码语句块中的方法，是完成特定任务的代码语句块l特点特点使用更简单：不用定义属于某个类，直接使用使用更简单：不用定义属于某个类，直接使用l分类分类系统函数和自定义函数系统函数和自定义函数 常用函数常用函数lparseInt(字符串字符串)将字符串转换为整型数字将字符串转换为整型数字如如:parseInt(86)将字符串将字符串“86”转换为整型值转换为整型值86lparseFloat(字符串字符串)将字符串转换为浮点型数字将字符串转换为浮点型数字如如:parseFloat(34.45)将字符串将字符串“34.45”转换为浮点值转换为浮点值34.45lisNaN()用于检查其参数是否是非数字用于检查其参数是否是非数字如如:isNaN(abc)，则返回，则返回true;自定义函数自定义函数l语法语法l调用调用函数函数函数调用一般和表单元素的事件一起使用，调用格式：函数调用一般和表单元素的事件一起使用，调用格式：事件事件名名函数名函数名();function函数名函数名(参数参数1,参数参数2,参数参数3,)/JavaScript语句语句;return返回值返回值 函数调用函数调用l调用无参函数调用无参函数l调用有参函数调用有参函数functionshowHello()functionshowHello(count)函数调用函数调用l调用无参函数调用无参函数l调用有参函数调用有参函数functionshowHello()functionshowHello(count)匿名函数匿名函数l匿名函数，即没有函数名匿名函数，即没有函数名l定义匿名函数定义匿名函数l调用匿名函数调用匿名函数varshowFun=function(count)for(vari=0;icount;i+)document.write(HelloWorld);变量作用域变量作用域vari=20;functionfirst()vari=5;for(varj=0;ji)document.write(t);elsedocument.write(i);first();l全局变量与局部变量全局变量与局部变量 总结总结l在本章讨论了在本章讨论了:JavaScript的基本结构及组成的基本结构及组成JavaScript的基本语法的基本语法JavaScript的数据类型、的数据类型、string、数组、数组alert()和和prompt()定义和使用函数定义和使用函数