javascript基础(wxh)

1、JavascriptJavascript基础知基础知识识 为什么需要脚本程序n关于用户录入信息的验证n关于动态改变网站上的内容 n网页上添加特效时钟/滚动文字/拖放操作 n网页游戏什么是脚本程序和JavaScriptn什么是脚本程序alert(new Date();nJavaScript简介前身叫作Livescript，是一种基于对象(Object)和事件驱动(Event Driven)、并具有安全性的脚本语言。 nJavaScript与Java是两个公司开发的两个不同的产品，作用与用途大不一样，但两者语法上有很多相似之处，JavaScript并不是Java的子集。 njavascript语言

2、的特点基于对象/动态语言/无需编译，直接解释执行 脚本代码的位置l放置在一个单独的文件中 l将脚本程序代码作为属性值 l放置在标签对之间Javascript的关键字及保留字关键字(Keywords)break else new var case finally return voidcatch for switch while continue function this withdefault if throwdelete in try do instanceof typeof保留字(Reserved Words)abstract enum int short boolean export

3、interface staticbyte extends long super char final native synchronizedclass float package throws const goto private transientdebugger implements protected volatile double import publicJavascript基本语法lJavaScript中的标识符标识符是指JavaScript中定义的符号，例如，变量名，函数名，数组名等。标识符可以由任意顺序的大小写字母、数字、下划线(_)和美元符号($)组成，但标识符不能以数字开头

4、，不能是JavaScript中的保留关键字。 合法的标识符举例：indentifier、username、user_name、_userName、$username非法的标识符举例：int、98.3、Hello World lJavaScript严格区分大小写computer和Computer是两个完全不同的符号 lJavaScript程序代码的格式 每条功能执行语句的最后必须用分号(;)结束，每个词之间用空格、制表符、换行符或大括号、小括号这样的分隔符隔开 。l语句块使用来表示lJavaScript程序的注释 /*/中可以嵌套“/”注释，但不能嵌套“ /*/”。 变量n定义一个变量，系统为之

5、设置一个标识，程序可以用变量名来指向具体的对象内存，并通过变量名来获得对应的对象。n声明变量要使用var关键字例如：var name;n声明变量的同时为其赋值例如：var name = caishiyou;n对已赋值的变量赋予一个其他类型的数据例如：name = 123;n不事先声明变量而直接使用例如：x = 1234;基本数据类型及常量nNumber(数字类型)1、整型常量(10进制8进制16进制)十六进制以0 x或0X开头，例如：0 x8a。八进制必须以0开头，例如：0123。十进制的第一位不能是0（数字0除外），例如：123。、实型常量 12.32、193.98、 5E7、4e5等。特殊

6、数值：NaN、Infinity、isNaN()、isFinite()nBoolean(布尔值)true和false。nString字符串 “a book of JavaScript”、abc、 “a”、“”。字符串中的特殊字符，需要以反斜杠（）后跟一个普通字符来表示，例如：r、n、t、b、 、xxxnnull常量nundefined常量 运算符l算术运算符l赋值运算符l比较运算符l逻辑运算符l位运算符算术运算符l+ 加法运算符或正值运算符，例如，x + 5，+6。l“+”还能实现多个字符串的相加，也能将字符串与其它的数据类型相连成一个新的字符串，条件是该表达式中至少有一个字符串，例如：“x”

7、+ 123的结果是“x123”。l- 减法运算符或负值运算符，例如，7 - 3，-8。l*乘法运算符，例如，3*6。l/ 除法运算符，例如，9/4。l%求模运算符（也就算术中的求余），例如，5%2。l+ 将变量值加1后再将结果赋给这个变量。l“+”有两种用法：+x，x+。前者是变量在参与其它运算之前先将自己加1后，再用新的值参与其它运算，而后者是先用原值参与其它运算后，再将自己加1。例如：b = +a是a先自增，即a的值加1后，才赋值给b；而b = a+是先将a赋值给b后，a再自增。l-将变量值减1后再将结果赋给这个变量，与+的用法一样。赋值运算符l赋值运算符的作用是将一个值赋给一个变量，最常

8、用的赋值运算符是“=”。还可以由“=”赋值运算符和其它一些运算符组合产生一些新的赋值运算符，例如， “+=”，“*=”等。l= 将一个值或表达式的结果赋给变量l例如， x = 3。l+= 将变量与所赋的值相加后的结果再赋给该变量l例如， x += 3等价于x = x + 3。l-= 将变量与所赋的值相减后的结果再赋给该变量l例如， x -= 3等价于x = x - 3。l*= 将变量与所赋的值相乘后的结果再赋给该变量l例如， x *= 3等价于x = x * 3。l/=将变量与所赋的值相除后的结果再赋给该变量l例如， x /= 3等价于x = x / 3。l%= 将变量与所赋的值求模后的结果再

9、赋给该变量l例如， x %= 3等价于x = x % 3。比较运算符l当左边操作数大于右边操作数时返回true，否则返回false。l=当左边操作数大于等于右边操作数时返回true，否则返回false。l将左边操作数在内存中的二进制数据右移右边操作数指定的位数，左边移空的部分，补上左边操作数原来的最高位的二进制位值。 l 将左边操作数在内存中的二进制数据右移右边操作数指定的位数，左边移空的部分补0。程序流程控制n顺序结构 nif条件选择语句 nswitch选择语句 nwhile循环语句 ndo while语句 nfor循环语句 nbreak与continue语句 if语句语法if (条件语句)

10、 执行语句多学两招：多学两招：if(x = null)或if(typeof(x) = “undefined”)可以简写成if(!x)。if (条件语句)执行语句块1 else执行语句块2多学两招：多学两招：变量 布尔表达式？语句1:语句2；例如，y = x0 ? x : -x;if (条件语句1)执行语句块1 else if(条件语句2)执行语句块2.else if(条件语句n)执行语句块nelse执行语句块n+1if语句的嵌套if (x 1)if(y = 1)alert(x 1,y = 1);elsealert(x 10)if(y = 1)alert(x 10,y = 1);elsealer

11、t(x?,y?);if (x 1)if(y = 1)alert(x 1,y = 1);elsealert(x 10)if(y = 1)alert(x 10,y = 1);elsealert(x 10,y != 1);if (x 1)if(y = 1)alert(x 1,y = 1);elsealert(x 10)if(y = 1)alert(x 10,y = 1);elsealert(x?,y?);if (x 1)if(y = 1)alert(x 1,y = 1);elsealert(x 10)if(y = 1)alert(x 10,y = 1);elsealert(“1 = x = 10);

12、switch选择语句 switch(表达式)case 取值1:语句块1break;case 取值n:语句块nbreak;default:语句块n+1break;var x = 2;switch(x)case 1: alert(Monday);break;case 2:alert (Tuesday);break;case 3:alert (Wednesday);break;default:alert (Sorry,I dont Know);case 1:case 2:case 3:case 4:case 5: alert (working day);break;default:alert (of

13、f day);while循环语句while(条件表达式语句)执行语句块var x = 1;while(x 3) alert(x= + x); x+; 多想一想：多想一想：在while从句后面增加一个分号（;）后，程序将产生怎样的执行效果。do while循环语句do执行语句块while(条件表达式语句);var x = 3;while(x = 0)alert(ok1);x+; var y = 3; do alert(ok2); y+; while(y = 0);for循环语句for(初始化表达式;循环条件表达式;循环后的操作表达式)执行语句块var output = ;for(var x=1;

14、 x10; x+)output = output + x= + x;alert(output);for(;).等效于while(true)for.in循环语句for(变量 in 集合或对象)执行语句块var as= 1,4,5,6,output=;for(var x in as)output += x= + asx;alert(output);var as=id:5,name:test;for(var x in as)output += x+=+asx;alert(output);break与continue语句break语句语句 ：st:while(true)while(true)break

15、 st;continue语句语句 ：var output = ;for(var x=1; x10; x+)if(x%2 = 0)continue;output=output + x= + x;alert(output);函数n函数的作用与定义n全局变量与局部变量 n参数个数可变的函数 n创建动态函数 nJavaScript中的系统函数 函数的作用主程序函数1函数2函数1函数3函数1函数2函数3函数的定义及调用定义一个函数的格式如下：function 函数名（参数列表）程序代码return 表达式;var msg = 全局变量;function square(x,y)var sum;sum =

16、x*x + y*y;return sum;function show()var msg = 局部变量;alert(msg);/var sum;alert(sum= + sum);sum=square(2,3);alert(sum= + sum);show();undefinedalert(sum= + square(2,3);对函数进行调用的几种方式： 函数名（传递给函数的参数1，传递给函数的参数2，.）变量 = 函数名（传递给函数的参数1，传递给函数的参数2，.）对于有返回值的函数调用，也可以在程序中直接使用返回的结果，例如：alert(sum=“ + square(2,3);不指定任何函数

17、值的函数，返回undefined。全局变量与局部变量var msg = 全局变量;function show()msg = 局部变量;show();alert(msg);var msg = 全局变量;function show()var msg; msg = 局部变量;show();alert(msg);此处的msg值为多少？值为“局部变量”此处的msg值为多少？值为“全局变量”JavaScript中的系统函数(Global类)nencodeURI及encodeURIComponent方法返回对一个URI字符串编码后的结果。ndecodeURI及decodeURIComponent()方法将一

18、个已编码的URI字符串解码成最初始的字符串并返回。 nparseInt方法将一个字符串按指定的进制转换成一个整数，语法格式为：parseInt(numString, radix)。如果没有指定第二个参数，则前缀为 0 x 的字符串被视为十六进制，前缀为 0 的字符串被视为八进制，所有其他字符串都被视为是十进制。nparseFloat方法将一个字符串转换成对应的小数。 nisNaN方法用于检测parseInt和parseFloat方法的返回值是否为NaN。 nescape方法返回对一个字符串进行编码后的结果字符串。所有空格、标点、重音符号以及任何其他非 ASCII 字符都用 %xx 编码替换，其

19、中xx等于表示该字符的Unicode编码的十六进制数，字符值大于255的字符以%uxxxx格式存储。 nunescape 方法将一个用escape方法编码的结果字符串解码成原始字符串并返回。neval 方法将其中的参数字符串作为一个JavaScript表达式执行。 面向对象的javascriptn类(对象)与对象(对象实例) n构造方法与this关键字的作用 n在函数中修改参数值的问题对象及对象实例n对象中所包含的变量就是对象的属性，对象中所包含的对属性进行操作的函数就是对象的方法，对象的属性和方法都叫对象的成员。 n对象是对某一类事物的描述，是抽象上的概念；而对象实例是一类事物中的具体个例。

20、n能够被用来创建对象实例的函数就叫对象的构造函数，只要定义了一个对象的构造函数，就等于定义了一个对象。使用new关键字和对象的构造函数就可以创建对象实例，语法格式如下：var objInstance = new ObjName(传递给该对象的实际参数列表);function Person()var person1 = new Person();person1.age = 18; =zxx;/alert( + :“ + person1.age);function sayFunc()alert( + :“ + person1.

21、age);person1.say = sayFunc;person1.say();构造函数对象实例属性方法l可以为对象实例无限制地添加新的成员 用“对象实例名.成员名”的格式访问，也可以用（对象实例“成员变量名”）的格式，例如，person1“age”构造函数与this关键字n为一个对象实例新增加的属性和方法，不会增加到同一个对象所产生的其它对象实例上。 n所有的实例对象在创建后都会自动调用构造函数，在构造函数中增加的属性和方法会被增加到每个对象实例上。 n对象实例是用new关键字创建的，在构造方法中不要有返回结果的return语句。 n调用对象的成员方法时，需要使用“对象实例.成员方法”的形

22、式，很显然，用作成员方法的函数被调用时，一定伴随有某个对象实例。this关键字代表某个成员方法执行时，引用该方法的当前对象实例，所以，this关键字一般只在用作对象成员方法的函数中出现。function Person(name,age)this.age = age; = name;this.say = sayFunc;function sayFunc()alert( + :“ + this.age);var person1 = new Person(张三,18);person1.say();var person2 = new Person(李四,20);pe

23、rson2.say();引用传递及值传递将基本数据类型的变量作为函数参数传递的情况：function changeValue(x)x = 5;var x = 3;changeValue(x);alert(x);将对象类型的变量作为函数参数传递的情况： function Person(name,age)this.age = age; = name;this.say = sayFunc;function sayFunc()alert( + :“ + this.age);function change(p1) = 李四;var person1 = n

24、ew Person(张三,18);change(person1);person1.say();此处的x值为多少？值为3此处的值为多少？值为“李四”成都传智播客 JavaScript的内部类动态对象使用“对象实例名.成员”的格式来访问其属性和方法。静态对象直接使用“对象名.成员”的格式来访问其属性和方法。nObject类(对象) nNumber类(对象)nString类 (对象)nMath类(对象) nDate类(对象) ntoString方法 Object类Object类是所有javascript类的基类，提供了一种创建自定义对象的简单方式，不需要程序员再定义构造函数。

25、 主要属性：constructor-对象的构造函数prototype-获得类的prototype对象,static性质主要方法：hasOwnProperty(property)是否属于本类定义的属性isPrototypeOf(object)是否是指定类的prototypepropertyIsEnumerable(property)是否可例举的属性toString()返回对象对应的字符串valueOf()返回对象对应的原始类型值function getAttributeValue(attr)alert(personattr);var person = new Object();person.na

26、me = zs;person.age = 18;getAttributeValue(name);getAttributeValue(age);Number类Number类代表数据类，包含一些静态的成员及数值处理的方法。 静态属性：MAX_VALUE、MIN_VALUE、NEGATIVE_INFINITY、POSITIVE_INFINITY、NaN主要方法：toFixed(n)取小数位数，自动四舍五入toPrecision(n)是否是指定类的prototypepropertyIsEnumerable(property)是否可例举的属性toString()返回对象对应的字符串valueOf()返回

27、对象对应的原始类型值var oNumberObject = new Number(99);alert(oNumberObject.toFixed(2); /outputs “99.00”String类nlength属性nanchor、big、bold、fontcolor、link等方法ncharAt方法注意：一个字符串中的第一个字符的索引位置为0，依次类推。ncharCodeAt方法注意：返回的结果是字符的unicode编码。nconcat方法，连接字符串nindexOf方法及lastIndexOf方法nmatch、search方法nreplace、split方法nslice方法说明：str1

28、.slice(0)和str1.slice(0,-1)都是返回整个字符串。nsubstr、substring方法substring方法返回的内容不包含结束位置的字符。ntoLowerCase、toUpperCase 方法 Math类 属性：nE，代表数学常数e，约等于 2.718。nLN10，代表10的自然对数，约等于 2.302。nLN2，代表2的自然对数，约等于 0.693。nPI，代表数学常数的值，约等于 3.14159。nSQRT1-2，代表2 的平方根分之一，约等于0.707。nSQRT2，代表2 的平方根，约等于1.414。方法：abs方法，返回数字的绝对值。sin、cos方法，分别

29、返回数字的正弦、余弦值。asin、acos方法，分别返回数字的反正弦、反余弦值。random方法，返回介于 0 和 1 之间的伪随机数Math对象是一个静态类，不能使用new关键字创建对象实例，应直接使用“对象名.成员”的格式来访问其属性或方法，例如，var num = Math.random();Date类ntoGMTString方法，返回Date对象实例所表示的日期的字符串形式，该字符串使用格林尼治标准时间 (GMT) 格式，例如，“05 Jan 1996 00:00:00 GMT”。ngetYear、getMonth、getDate、getDay方法ngetHours、getMinute

30、s、getSeconds、getMilliseconds方法ngetTime方法，返回自1970年1月1日0点0分0秒算起，至Date对象实例代表的时间为止的毫秒数。var current_time = new Date();var strDate = current_time.getYear() + 年;strDate += current_time.getMonth() + 月;strDate += current_time.getDate() + 日 ;strDate += current_time.getHours() + :;strDate += current_time.getMi

31、nutes() + :;strDate += current_time.getSeconds();alert(strDate);n构造方法 ：Date()、Date(dateVal) 、Date(year, month, date, hours, minutes, seconds,ms) nparse方法，分析一个表示日期时间的字符串，返回它所表示的时间值，该值以自1970年1月1日0点0分0秒算起的毫秒值表示。parse方法属于一个静态方法 。toString方法toString 方法是JavaScript中的所有内部对象的一个成员方法，它的主要作用就是将对象中的数据转换成某种格式的字符串来

32、表示，具体的转换方式取决于对象的类型。举例：var x = 328;alert(hex=“ + x.toString(16) + bin=“ + x.toString(2);对象专用语句with语句语句 ：with (对象名称)执行语句块 for.in语句语句：for（变量 in 对象）执行语句forin举例：举例： function Person() = zxx;this.age = 19;this.height = 176;var p1 = new Person();var prop, str = ;for(prop in p1)str += prop + ;alert(

33、str);with举例：举例：var current_time=new Date();with(current_time)var strDate= getYear() + 年;strDate += getMonth() + 月;strDate += getDate() + 日;strDate += getHours() + :;strDate += getMinutes() + :;strDate += getSeconds();alert(strDate); Host ObjectHost Object是指原始对象以外对象，通常是指javascript运行环境中提供的内部对象，比如浏览器中关

34、于DOM及BOM提供。几个用于交互的方法：几个用于交互的方法：alert显示提示信息框confirm确认框prompt信息录入框window中的对象：alert(hello world);var ret=confirm(是否要删除学生记录?);if(ret)alert(删除);else alert(不删除);var s=prompt(请输入开源团队名称:,EasyJF);alert(s);数组n数组列表 n用对象的方式实现数组nArray对象n数组成员 数组列表n数组列表用于表示一组数据的集合，它由一对方括号 () 包围，列表中的每个元素用逗号分隔，数组元素可以是任意类型的数据（包括其他数组）

35、。例如，var arr = zs,123,li,3.5;n对于每个数组变量，都有一个length属性，表示该数组中元素的个数。 n使用“数组变量名索引号”的格式来访问每个数组元素。数组列表中的第一个元素的索引号为0，最后那个元素的索引号为数组的length属性值-1。n数组列表的每个元素既可以是有效的JavaScript 表达式，也可以为空，空元素的值为undefined。例如， var arr = 1,5; n数组元素本身又是数组，这就叫数组的数组，例如， “Names”,“Beansprout”,“Pumpkin”,“Max”, “Ages”,6,5,4 ，使用“数组变量名子数组索引号子数组中的元素索引号”的格式来访问数组的数组中的元素。var cats = Names,Beansprout,Pumpkin,Max, Ages,6,5,4;for(var i=0; iarr.length; i+)for(var j=0; jarri.length; j+) alert(arrij);用对象的方式实现数组function MyArray()this.leng