JavaScript语言概述

JavaScript语言2JavaScript概述•JavaScript是一种基于对象的脚本语言，用于开发基于客户端和基于服务器的Internet应用程序•可用于创建客户端脚本和服务器端脚本•由SunMicrosystems和Netscape开发，是从Netscapes的Livescript发展而来的攻心为上3JavaScript的作用和基本语法规则•使用JavaScript的各种功能，可以增强站点的动态性和交互性。–提供用户交互–动态更改内容–验证数据•与其他任何语言一样，JavaScript也遵循一些基本的语法规则，如：–区分大小写–使用成对的符号–忽略空格–使用注释4JavaScript作为客户端程序嵌入网页•使用Script标记•使用外部文件•在事件处理程序中使用JavaScript5使用Script标记示例HTMLHEADscriptlanguage=JavaScript!--对较早的浏览器隐藏脚本document.write(欢迎使用JavaScript);//脚本隐藏在此处结束--/script/headbodyP祝同学们学有所成!!!/P/body/HTML6使用外部文件示例HTMLHEADscriptsrc=test.js“type=“javascript”/script/headbodyP祝学有所成!!!/body/htmldocument.write(嗨！你好吗？)test.js7在事件处理程序中使用JavaScript示例HTMLHEADTITLEJavaScript示例/TITLE/HEADBODYFORMINPUTTYPE=buttonVALUE=你好onClick='alert(你好！！);'/FORM/BODY语法：/HTML语法：TAGeventhandler=“JavaScriptcode”8使用Alert/Confirm/Write方法•使用窗口的Alert方法，可以生成一个对话框•使用窗口的Confirm方法，可以生成一个确认对话框•使用document的Write方法可以创建页面内容HTMLHEADSCRIPTLANGUAGE=JavaScript!--alert(确定);document.write(谢谢!);if(confirm(是否要关闭当前窗口？)){window.close();}--/SCRIPT/HEAD/HTML9变量•变量是一种引用内存位置的容器，用于保存在执行脚本时可以更改的值•变量的命令约定–变量名必须以字母或下划线(_)开头–变量名长度在1~255字符之间–变量名可以包含数字，但不可以使用空格–不可以使用JavaScript的运算符号–不可以使用JavaScript用到的保留字–由于JavaScript区分大小写，所以可用的字母包括A到Z（大写）和a到z（小写）的字符10声明变量varnew_amount;varanswer=null;varold_cost=12.50;varresult=Unknownresult;vara,b,c;result=true;11变量的作用域Function1、Function2和Function3都可以访问脚本全局变量Function1局部变量aFunction2局部变量bFunction3局部变量c12数据类型•在JavaScript中有四种基本的数据类型•基本类型属于弱类型•将字符串转换为数值使用函数parseInt()和parseFloat()•将数值转换为字符串数据类型描述数字型(Number)整数或实数逻辑型或布尔型(Boolean)True或False字符串型(String)如“HelloWorld”，“123.4”空型(null)表示空值的特殊关键字13运算符•算术运算符•比较运算符•逻辑运算符•字符串运算符•求值运算符14算术运算符运算符说明示例+如果操作数都是数字时执行加法运算，如果其中的操作数有字符串时，会执行连接字符串的作用A=5+8//结果是13A=5+8//结果是58-减法A=8–5*乘法A=8*5/除法A=20/5%取余-相除之后的余数10%3=1++一元递增。此运算符只计算一个操作数，将操作数的值加1。返回的值取决于++运算符是位于操作数之前还是位于操作数之后。++x返回递增后的x值x++返回递增前的x值--一元递减。此运算符只计算一个操作数。返回的值取决于--运算符是位于操作数之前还是位于操作数之后--x返回递减后的x值x--返回递减前的x值-一元求反。此运算符返回操作数的相反数如果a等于5，则-a=-515比较运算符运算符说明示例==等于。如果两个操作数相等，则返回Truea==b!=或不等于。如果两个操作数不等，则返回TrueVar2!=5大于。如果左操作数大于右操作数，则返回TrueVar1var2=大于或等于。如果左操作数大于或等于右操作数，则返回TrueVar1=5Var1=var2小于。如果左操作数小于右操作数，则返回TrueVar2var1=小于或等于。如果左操作数小于或等于右操作数，则返TrueVar2=4Var2=var116逻辑运算符运算符例子说明And(&&)expr1&&expr2逻辑与Or(||)expr1||expr2逻辑或Not(!)!expr逻辑非17字符串运算符x=yellow;y=green;z=x+y+white;则z为yellowgreenwhitew=y+9;则w为green918求值运算符•通常这些运算符包括：–条件运算符：(condition)?trueVal:falseVal–typeof运算符typeof运算符返回字符串，该字符串代表操作数的类型varx=5;document.write(typeof(x));status=(age=18)?adult:minor19表达式•表达式用于在不同上下文中操作和计算变量。•表达式是任意一组有效的文字、变量和运算符，其计算结果为一个值。•表达式类型–算术：计算结果为一个数字–逻辑：计算结果为一个布尔值–字符串：计算结果为一个字符串•表达式通过运算符组合变量和文字20数组•数组用于存储具有相同数据类型的一组值，使用下标（索引）来区分各个值。•在JavaScript中，数组的下标以零开始。•JavaScript没有明确的数组数据类型，但却有内置的数组对象。要在程序中使用数组，必须使用数组对象及其相关联的方法。21创建数组•语法：arrayObjectName=newArray([element0,element1,...,elementN])•初始化–1.将指定的值作为其元素–2.使用arrayName=newArray(N)对象名元素值列表元素个数22数组赋值•在创建数组时将元素的值直接赋给数组。•对数组的元素赋值。htmlheadscriptlanguage=JavaScript!--emp=newArray(3);emp[0]=RyanDias;emp[1]=GrahamBrowne;emp[2]=DavidGreene;document.writeln(emp[0]);document.writeln(emp[1]);document.writeln(emp[2]);//--/script/head/html23访问数组元素•指定元素名•指定元素的索引号emp[RyanDias]emp[0]24数组对象的属性和方法•length属性•sort方法•join方法•reverse方法htmlheadscriptlanguage=JavaScript!--emp=newArray(3);emp[0]=RyanDias;emp[1]=GrahamBrowne;emp[2]=DavidGreene;emp.sort();document.writeln(emp.length);document.writeln(emp[0]);document.writeln(emp[1]);document.writeln(emp[2]);//--/script/head/html25多维数组HTMLHEADSCRIPTLANGUAGE=JavaScript!--MyArray=newArray(5,5);MyArray[0,0]=RyanDias;MyArray[0,1]=1;MyArray[1,0]=MikeDonne;MyArray[1,1]=2;MyArray[2,0]=JoeDean;MyArray[2,1]=3;MyArray[3,0]=RobertMatey;MyArray[3,1]=4;document.write(姓名是+MyArray[3,0]);document.write(编号是+MyArray[3,1]);--/SCRIPT/HEAD/HTML26条件语句•if…else语句•switch语句if(condition){statements;}else{statements2;}switch(expression){casevalue1:statements;break;casevalue2:statements;break;...default:statements;}27循环语句•for•do…while•while•break•continue28for循环语句for(initial-statement;condition;increment){statements;}initial-statement(初始化语句)—通常用于初始化数字计数器变量。condition(循环条件)—设置循环的条件。increment(增量语句)—更新循环计数器。29for循环示例htmlheadscriptlanguage=“javascript”!--varString1=‘hralign=“center”width=‘;for(varsize=5;size=200;size+=10){document.write(String1+size+‘%’);}--/script/head/html30do…while循环语句do…while循环语句用于运行语句块，直至条件变为False。语法如下：do{statements;}while(condition)其中statements是语句；condition是条件。31while循环语句while语句是JavaScript语言中另外一种循环结构，用于在条件为True是指行语句块。如果要在循环体中执行多个语句，必须用“{”和“}”将程序代码段括起来。语法如下：while(condition){statements;}其中condition是条件，statements是语句。32break和continue语句使用break语句就可以强制终止语句的执行。在循环中使用break时，将导致从当前位置跳出循环，继续执行循环以后的语句。continue是导致当前循环立即停止，然后继续下一次的循环。33函数•预定义函数–eval函数–isNaN函数•用户自定义函数–创建用户定义的函数––调用函数•return语句functionfuncName(argument1,argument2,etc){statements;}34函数示例htmlheadscriptlanguage=JavaScriptfunctionhello(){document.write('你好！');document.write('欢迎使用hello()函数');return;}functionsum_up(one,two){varresult=one+two;returnresult;}h