JS-第七章js基础.ppt

第七章 JavaScript 语法基础,目录,什么是JavaScript,1,JavaScript的语法基础,2,什么是JavaScript,JavaScript是一种基于对象的脚本语言，用于开发基于客户端和基于服务器的Internet应用程序 可用于创建客户端脚本 JavaScript原名是 Livescript ，后来吸收了java的一些特性，升级为javaScript，有时被简称为JS. JavaScript是解释型语言，无需编译就可以随时运行，这样哪怕语法有错误，没有语法的部分还是能正确运行。,JavaScript的作用和基本语法规则,使用 JavaScript 的各种功能，可以增强站点的动态性和交互性。 提供用户交互 动态更改内容 验证数据 与其他任何语言一样，JavaScript 也遵循一些基本的语法规则，如： 区分大小写 使用成对的符号 使用空格 使用注释,JavaScript 工具和运行时环境,JavaScript 代码生成工具和 IDE 有助于创建功能强大的 JavaScript 代码。以下是其中一些工具： 对话框 弹出菜单生成器 远程控件 运行时环境 客户端脚本编写 Web 服务器上的 JavaScript,JavaScript作为客户端程序嵌入网页,使用Script标记 使用外部文件 在事件处理程序中使用JavaScript,使用Script标记示例, 祝学有所成! 注：在中的在body加载之前就已经运行。 可以用多个，body中也可以用,使用外部文件示例, 祝学有所成! ,document.write(“嗨！你好吗？“) 注：优点是多页面可以共享，减少网络流量。,test.js,在事件处理程序中使用JavaScript示例, JavaScript示例 点击 ,使用Alert/Confirm/Write方法,使用窗口的Alert方法，可以生成一个对话框 使用窗口的Confirm方法，可以生成一个确认对话框 使用document的Write方法可以创建页面内容,变量,变量是一种引用内存位置的容器，用于保存在执行脚本时可以更改的值 变量的命令约定 变量名必须以字母或下划线 (_) 开头 变量名可以包含数字 由于JavaScript区分大小写，所以可用的字母包括A到Z（大写）和a到z（小写）的字符,声明变量,var new_amount; var answer = null; var old_cost = 12.50; var result =“Unknown result“; var a, b, c; result = true;,变量的作用域,数据类型,在JavaScript中有四种基本的数据类型 基本类型属于弱类型,运算符,算术运算符 比较运算符 逻辑运算符 字符串运算符 求值运算符,算术运算符,比较运算符,逻辑运算符,字符串运算符,x = “yellow“; y = “green“; z = x + y + “white“; 则z为yellowgreenwhite w = y + 9; 则w为green9,求值运算符,通常这些运算符包括： 条件运算符： (condition) ? trueVal : falseVal typeof 运算符 typeof 运算符返回字符串，该字符串代表操作数的类型,var x = 5; document.write(typeof(x);,status = (age = 18) ? “adult“ : “minor“,表达式,表达式用于在不同上下文中操作和计算变量。 表达式是任意一组有效的文字、变量和运算符，其计算结果为一个值。 表达式类型 算术：计算结果为一个数字 逻辑：计算结果为一个布尔值 字符串：计算结果为一个字符串 表达式通过运算符组合变量和文字,条件语句,if else语句 switch语句,if (condition) statements; else statements2; ,switch (expression) case value1: statements; break; case value2: statements; break; . default :statements; ,循环语句,for dowhile while break Continue 循环示例： 输出长度不同的水平线 练习： 用循环动态输出一个报表,函数,预定义函数 eval 函数：可以对以字符串形式表示的任意有效的 Jscript代码求值 如:var anExpression = “6 * 9 % 7“; var total = eval(anExpression); / 将变量 total 赋值为 5。 isNaN 函数：返回一个 Boolean 值，指明提供的值是否是保留值 NaN （不是数字）。,用户自定义函数,创建用户定义的函数 不需声明返回值类型、参数类型，定义以function开头 return 语句,function funcName(argument1,argument2,etc) statements; ,函数示例, function hello( ) document.write (你好！); document.write (欢迎使用hello( )函数); return; function sum_up ( one, two) var result = one + two; return result; function sum_all ( ) var loop=0, sum=0; for ( loop = arguments.length-1; loop =0; loop-) sum += argumentsloop; return sum; hello(); var total = sum_up(7, 9); document.write ( total + + sum_up ( 8, 15); document.write ( + sum_all ( 1, 5, 8,7, 6) ); ,匿名函数,Var fi=function(i1,i2) return i1+r2; Alert(f1(1,2) 这种匿名函数的用法在JQuery中非常多 不用指定函数名,JavaScript面向对象基础,JavaScript中没有声明类的语法，使用函数闭包模拟出来的 JavaScript中也没有类，声明的都是对象如：String ，Date 等都是对象而不是类 Function person(name,age) T=name; This.age=age; This.SayHello=funtion() Alert(“您好，我是”++”,我已经”+this.age+”岁了”) Var p1=new person(“Tom”,”20”); P1.SayHello(); 注：函数名类似于类名必须有， person(name,age)类似于构造函数，name和age属性，函数都是动态添加的,数组,数组用于存储具有相同数据类型的一组值，使用下标（索引）来区分各个值。 在JavaScript中，数组的下标以零开始。 JavaScript没有明确的数组数据类型，但却有内置的数组对象。要在程序中使用数组，必须使用数组对象及其相关联的方法。,Array对象,JavaScript中的Array对象就是数组，是一个动态数组，类似于c#中的arraylist、hashtable等 无须预定义大小,创建数组,语法： arrayObjectName = new Array(element0, element1, ., elementN) arrayObjectName = new Array（） 初始化 1.将指定的值作为其元素 2.使用arrayName = new Array(N),对象名,元素值列表,数组赋值,在创建数组时将元素的值直接赋给数组。 对数组的元素赋值。,数组练习,求一序列的最小值 将一个字符串输出为|分割的形式，比如：tom|john|peter,数组对象的元素和方法,length属性 sort方法 join方法 reverse方法,语法： objArray.join(seperator) 用途： 以seperator指定的字符作为分隔符，将数组转换为字符串，当seperator为逗号时，其作用和toString()相同。,Array的字典用法,JavaScript中的Array不仅是个数组，还是一个字典或堆栈 Var dict=new Array(); Dict“name”=“李”; Dict“age”=“20”; Dict“sex”=“男” Alert(dict“name”) For(var o in dict) alert(o); ,数组简化声明方式,数组简化方式 Var arr=10,20,30; 字典的声明方式 Var dict=“name”:”tom”,”age”:”20” alert(dict“name”),多维数组,总结,JavaScript是一种脚本语言，使用它可以创建客户端脚本和服务器端脚本。 可以使用不同的方法将JavaScript语句插入到HTML文档中。 JavaScript支持的基本数据类型有数字型、逻辑型或布