JavaScript1.docx

1、JavaScript1JavaScript简介Javascript是一种解释型，轻量级的客户端脚本语言，不需要像java那样配置JDK环境，有支持的浏览器即可运行。主要目的是验证数据，增加web互动，加强用户体验等。如，一个form表单，有html标签组成，css完成表单的美化，而当点击提交按钮时，点击事件的处理，对表单数据验证与发送到服务器可均由JavaScript来完成。初识JavaScript(unit4/chapter1.html) 初始javaScript alert(Hello JavaScript) Hello JavaScriptScript标签type=“text/javas

2、cript”(H5可以不写)，表示其中的内容为JavaScript脚本。Alert即为弹出的对话框，在点击确定后才可看到body中显示的Hello JavaScript内容对上面代码做下修改Hello JavaScript alert(Hello JavaScript)将JavaScript内容移至p标签之下，再次刷新页面，会看到弹出对话框时，页面内容Hello JavaScript已经显示。由此可知，script脚本与html标签，从上向下执行。通过引用外部js文件使用JavaScript在chapter1.js中代码如下alert(Hello JavaScript)对原html进行修改，不

3、在使用script里面写代码的方式，而是通过应用外部文件chapter1.js完成该功能。在head中添加如下代码，注释其他的js代码刷新网页，仍然可以得到最初的结果，弹出对话框，将这句话一直p标签之后，再次测试，结果与之前一样。注意：通过外部文件引用使用javascript时，在他们script标签内不能再写js脚本。JS基础语法(unit4/chapter2.html)1、 区分大小写Test与test意思是不一样的，是两种不同的标识符2、 标识符组成字母，下划线_,美元符$或数字组成，且字母，数字不能作为开头3、 注释/ 单行注释/* */多行注释4、 直接量100 数字 tzhang

4、或 “tzhang” 字符串false 布尔值null 对象name:tzhang,school:nau对象1,2,3,4 数组5、 关键字，保留字他们已经被使用，不能做为变量名、函数名关键字保留字6、变量变量声明与初始化/变量声明var val;/ 变量初始化val = 100;/ 上面用整数赋值，下面使用字符串赋值，与java不同，这便是弱类型语言的特点val = 苏州/ 单条语句独占一行,可以不使用分号，若一行有多条语句必须加分号var valinit = 100/ 变量声明并初始化，没有加var，他们的不同点之后介绍valmeb = 杭州/ 同时定义多个变量var user = tzh

5、ang, sex = 男, address = xz数据类型（unit4/chapter3.html）typeof用于检测变量或值的数据类型，会有如下返回值字符串描述undefined未定义boolean布尔值string字符串number数值object对象或nullfunction函数 var age; alert(age);/age是Undefined类型，输出undefined alert(typeof age);/输出undefinedage变量声明但未初始化var bol = true; /bol是Boolean类型alert(typeof bol) /输出boolean注意类型的

6、首字母大写，typeof返回值为小写。同理，除function之外，其他几个类似,。关于对象的示例var obj = ;/定义一个对象 var obj = new Object();var obj = null; / Null类型alert(typeof obj) / 输出objectFunction示例function fun()alert(fun);/ 没有设么数据类型，输出函数的结构alert(typeof fun)/ functionUndefined声明但未初始化var age;alert(typeof age)/ undefinedalert(typeof addr)/ undef

7、ined两个输出的都是undefined，但是他们一个有值undefined，一个什么都没有会报错，所以定义变量的时候，尽可能不要只声明，不赋值。alert(undefined = null)/ true 两个都是空的，所以认为是相等的，但是他们的数据类型不同alert(undefined = null)/ false 恒等，三个等号，表示恒等关系，要求数据类型也要相同Booleanvar gender = man;if (gender) alert(true) else alert(false)如上，简单的if,else语句，不在多说，我们知道if语句的是true或false，但是此时我们不

8、是传入的boolean值，却可以运行，为何？隐式转换如下：数据类型truefalseBooleantruefalseString任何非空字符串空字符串Number任何非0值，包括无穷大0或NaNObject任何对象NullUndefinedundefinedNumber（unit4/chapter4.html）除常用的十进制外，还有八进制，十六进制八进制以0开头十六进制以0x开头var x = 2.5alert(0.1+0.2)alert(Number.MAX_VALUE);/ 最大值Number.MIN_VALUE/ 最小值0.1+0.2的结果所以，尽量不要使用浮点型数据进行一些精确地判断N

9、aN非数值（Not a Number）是一个特殊的值，这个数值用于表示一个本来要返回数值的操作却未返回数值的情况，这样就不会抛出错误。如在java中任何数值除以0都会报错，程序终止，但在JavaScript中，不会影响程序执行。alert(0/0) / NaNalert(5/0)/ Infinityalert(5/0 * 0)/ NaNalert(NaN + 1) / NaNalert(NaN = NaN) / falsevar val = 0 / 0;alert(isNaN(val);/ truealert(isNaN(25);/ falsealert(isNaN(25);/ falseal

10、ert(isNaN(tzhang);/ truealert(isNaN(true);/ falsealert(isNaN(false);/ falseisNaN适用于对象，先调用其valueOf方法，然后确定其值是否可以转换成数值，如果不能，则基于这个返回值再调用toString方法，在测试其返回值。不要求掌握var box = toString:function() return 456;/ 换成tzhang再试试 alert(isNaN(box)非数值转换为数值Number()可以用于任何数据类型,parseInt(),parseFloat()专用于字符串转换成数值alert(Number

11、(true)/ 1alert(Number(false)/ 0alert(Number(null)/ 0alert(Number(undefined)/ NaNalert(Number()/ 0alert(Number(12d12)/ NaNalert(parseInt(123tzhang)/ 123alert(parseInt(tt123tzhang)/ NaNalert(parseInt(11tt123tzhang)/ 11alert(parseInt()/ NaN5、String（unit4/chapter5.html） 可以使用单引号，也可以使用双引号。转移字符：n换行符t制表符b空格

12、斜杠 单引号”双引号字符串拼接 +toString方法var val = 10;alert(val.toString();若转型之前我们不知道变量是否是null或者undefined，我们还可以使用转型函数String(para)，这个函数能够将任何类型的值转换成字符串。如果是null或者undefined，则返回”null”,”undefined”。Objectvar obj1 = ;/ 字面量创建方法var obj2 = new Object();/ 通过new创建，括号内传参var obj3 = new Object(3);alert(obj3)/ 3 toString运算符算术运算符(

13、类似java不在举例)+ - 正数(+) 负数(-) 加 减 乘 除 取模请自行学习关系运算符 = != =等等逻辑运算符& 有一个操作数是null，则返回null，有一个是undefined，则为undefined，但又由于其为短路操作，若前一个是false，则后面不在运算，故上述运算条件要注意。| 短路操作，若前一个为true，则不在运算后一个！流程控制语句（unit4/chapter6.html）If语句var val = 100;if (val = 100) document.write(if 语句 val=100);If else 语句if (val 100) document.wr

14、ite(if else 语句 val100); else document.write(if else 语句 val 100) document.write(if else if else 语句 val100); else if (val = 100) document.write(if else if else 语句 val=100); else document.write(if else if else 语句 val= 0);While 语句while(val =100) document.write(val+ + );For循环for(var i = 0; i val; i+) doc

15、ument.write(i + );document.write()For-in 遍历对象var obj = name:tzhang, age:80, job: progrommerdocument.write(for-in );for(var oo in obj) document.write(oo + );Continuefor(var i = 0; i 10; i+) if(i = 5) continue document.write(i );函数（unit4/chapter7.html）函数的声明函数本身并不能运行，需要被调用才可以执行/ 函数声明function fun1() doc

16、ument.write(fun1)fun1()/ 函数调用，可在声明前，也可在声明后有参函数function fun2(sno, sname) document.write(sno = + sno + , sname= + sname ) document.write()fun2(0807, tzhang)fun2(0807) 有返回值任何函数都可以有返回值，不需要显示声明类型function fun3() return fun3document.write(fun3()Argements不建议显式传进多个参数，传入参数会由argements接收function fun4()document.

17、write(arguments.length + -); / 请自行使用for循环遍历 document.write(arguments0); document.write(arguments1); document.write(arguments2); document.write(arguments3);fun4(1, 2, 3)不存在重载function fun5(name, addr) document.write(name + addr);function fun5(name) document.write(name);fun5(tzhang,xz)那个在函数在下方，就会执行那个代码

18、。对象（unit4/chapter9.html）对象创建 var obj = new Object();/ new可以省略 obj.name=tzhang obj.age = 100; alert(obj.name); var obj1 = name:tzhang,/ 属性名name单引号可省 age:100 var obj2 = obj2.name = tzhang obj2.age=100 alert(obj2name);/ 单引号或双引号 方法赋值function fun1() return tzhangobj2.me = fun1();/方法调用obj2.me2 = fun1;/ 方法

19、赋值/ 方法调用alert(obj2.me2()创建对象（包含方法）var obj3 = name:zhang, meth:function() return zhang alert(obj3.meth()数组var arr1 = new Array();var arr2 = new Array(10);/ 默认值var arr3 = new Array(java,c#,C+);alert(arr30);var arr4 = tzhang, 50arr41 = 30arr42 = 徐州/ 数组第三个元素为徐州arr4.length = 10/ 数组长度变成了10var arr6 = tzhan

20、g,xxz;alert(arr6)/ 数组之间用逗号隔开alert(arr6.join(-);/ 数组之间使用-隔开常用方法 var arr6 = tzhang,xxz;alert(arr6)/ 数组之间用逗号隔开alert(arr6.join(-);/ 数组之间使用-隔开/ 栈方式 后进先出var arr7 = tzhang,yxzarr7.push(jfz,jwz);/数组末尾添加多个元素alert(arr7)alert(arr7.pop()/ 移除数组最后的元素，并返回移除的元素alert(arr7)/ 队列方式 先进先出arr7.push(jwz)arr7.shift();/ 移除数组

21、开头的元素，并返回移除的元素alert(arr7)arr7.unshift(张)/ 在数组前面添加一个元素/ 反转 arr7.reverse(); / 从小到大排序 arr7.sort() / 连接后得到一个新数组 / var arr8 = arr7.concat(tzhang) var arr8 = arr7.concat(arr6) / slice(start,end) / start规定从何处开始选取。如果是负数，那么它规定从数组尾部开始算起的位置。 / 也就是说，-1 指最后一个元素，-2 指倒数第二个元素 arr8.slice(1,3)/ 从下标1开始，取2个元素 var arr9

22、= arr8.splice(1,2) alert(arr8) / 在第1个位置插入元素zhangtao，即插入 arr8.splice(1,0,zhangtao) / 在第一个位置插入 zhang tttt，并将第一个元素删除，即替换 arr8.splice(1,1,tzhang)/ 可使用多个元素arr8.splice(1,1,tzhang,ddd)日期（unit4/chapter10.html）/ 当前日期var date = new Date();alert(date)/ 返回毫秒数1488729600000alert(Date.parse(2017/3/6)/ 毫秒数转时间var da

23、te1 = new Date(1488729600000);alert(date1)var date2 = new Date(2017/3/7);alert(date2)/ 使用具体日期 时间var date3 = new Date(2017,3,6,11,6,30)alert(date3)document.write(date3)/ 默认调用toString方法document.write()document.writeln(date3.toString()document.write()document.writeln(date3.toLocaleString()/ 本地时间格式docum

24、ent.write()document.writeln(date3.valueOf()/ 返回毫秒数document.write() document.writeln(date3.getTime()/ 返回毫秒数/ date3.setTime(10090099)/ 设置毫秒数 document.write() document.writeln(date3.getFullYear()/ 返回年 同时也有set方法 document.write() document.writeln(date3.getMonth()/ 返回月份 同时也有set方法,此处月份值从0开始 document.write(

25、) document.writeln(date3.getDate()/ 返回日期关于日期的方法就不一一测试，请参考 正则表达式(unit4/chapter11.html)对数据表单进行验证，如邮箱，电话号码输入格式是否正确创建方式var reg = new RegExp(reg);/ 模式字符串/ alert(reg)/ /reg/ 两个反斜杠包围，正则字面量表示法/ 可选参数，模式修饰符 i忽略大小写 g全局匹配 m多行匹配var reg1 = new RegExp(reg,ig);alert(reg1)/ /reg/givar reg2 = /reg/ / 字面量方式创建var reg3 = /reg/ig / 字面量 + 修饰符匹配test 返回true或falseexec 返回结果数组，否则返回nullvar p1 = new RegExp(reg);var str = Regdocument.write(p1.test(str) / falsevar p2 = new RegExp(reg,i);document.write(p2.test(str