javascript剖析

1实用页面设计方法——JavaScript2第一章：JavaScript简介目标:本章旨在向学员简要介绍JavaScript的相关概念及核心功能，通过本课的学习，学员应该掌握如下知识：1）了解JavaScript的基本概念2）了解JavaScript的核心功能31.1JavaScript简介•JavaScript–基于对象的脚本语言–解释执行–代码以纯文本形式存储–类型宽松–Netscape公司和Sun公司联手完成41.2JavaScript功能•JavaScript功能–现今WEB上应用最为广泛的客户端脚本，可以处理从表单数据的确认到创建负责用户界面的各种任务：•表单确认•页面修饰以及特殊效果•导航系统•基本数学运算•动态文档生成51.3JavaScript历史•JavaScript历史–JavaScript语言本身和Java语言没有任何关系–1995年首次出现，主要处理一些输入的有效性验证，可以直接在客户端处理61.4JavaScript特点•JavaScript特点–脚本编写–基于对象–简单–安全–动态–跨平台71.5嵌入使用•在HTML中嵌入JavaScript代码–1、在页面中嵌入script代码：scriptlanguage=“JavaScript”type=“text/javascript”…/script•可嵌入到任何位置，建议在head标记中–2、在标记中嵌入script代码•响应标记的某个事件–JavaScriptExample.html81.5嵌入使用-示例htmlheadScriptLanguage=JavaScriptdocument.write(这是以JavaScript印出的！);document.write(br);/Script/headbodyonload=alert('hello')ScriptLanguage=JavaScriptalert(a);//先执行，然后才触发onload代码；vard=newDate();vartime=d.getHours();if(time10){document.write(bGoodmorning/b);}else{document.write(iGoodday/i);}/Script/body/html91.6引入使用•引入外部的JavaScript代码–多个页面使用相同的JavaScript代码–将共用代码保存在以.js为扩展名的文件中–在页面中使用src属性引入外部文件•scriptsrc=“a.js”/script•JavaScriptExternal.html101.6引入使用-示例htmlheadscriptlanguage=JavaScriptsrc=externalJS.js/script/headbodytext='blue'brfontsize='+3'我是body的内容/font/body/html111.7不支持JavaScript的处理•不支持JavaScript的浏览器处理–将JavaScript代码隐藏使用!--JavaSCript代码//--–JavaScriptHide.html121.7不支持JavaScript-示例htmlheadtitleOldBrowsers/title/headbodyscriptLanguage=JavaScripttype=text/javascript!--HidingJavaScriptfromOlderBrowsersdocument.write(h2WelcometoNEU!/h2);//StopHidingJavaScriptfromOlderBrowsers//--/script/body/html13第二章：JavaScript基本语法目标:本章旨在向学员介绍JavaScript的基本语法，通过本课的学习，学员应该掌握如下知识：1）了解JavaScript的语法2）了解JavaScript的变量命名、转义字符等142.1语法•JavaScript语法–区分大小写•变量myTest、myTEST是不同的变量–变量是弱类型–行结尾加分号–大括号表明代码块–注释通用简单•在浏览器中逐条解释执行，如果某条语句出现错误，后面的语句将不能执行。152.2注释•注释–单行：////这是注释的内容–块注释：/*…*//*这是多行注释的内容；可以跨越多行；*/162.3特殊字符•特殊字符–在字符串中插入特殊字符•如“和‘等–使用\+特殊字符实现•如：You&Ising“HappyBirthday”.•代码如下：document.write(“You\&Ising\”HappyBirthday\”.”)172.4常量/变量•常量–JavaScript中没有常量概念–通常指直接在代码中给定的值•vara=3.1415926;•varb=“hello”;•变量–保存程序中的临时值，可被后面的脚本使用–弱类型182.5变量声明•变量声明–var–在使用变量前声明•varmytest;–可以声明的同时赋值•varmytest=“Thisisabook”;–同时声明多个变量（不建议）•vara,b=1,c;192.6变量命名•变量命名–以字母、下划线（_）或美元符号（$）开头–余下的字符可以是下划线、美元符号或任何的字母、数字–最长为255个字符–不能有空格，大小写敏感–不能使用JavaScript中的关键字或保留字命名202.7JavaScript保留字（一）breakdeletefunctionreturntypeofcasedoifswitchvarcatchelseinthisvoidcontinuefalseinstanceofthrowwhiledebuggerfinallynewtruewithdefaultfornulltry212.7JavaScript保留字（二）abstractdoublegotonativestaticbooleanenumimplementspackagesuperbyteexportimportprivatesynchronizedcharextendsintprotectedthrowsclassfinalinterfacepublictransientconstfloatlongshortvolatile222.8变量类型（了解）•变量类型—五种原始类型–Undefined-未定义类型•未被赋值的变量，值为undefined–String-字符串类型•值用引号括起来–Boolean-布尔类型•值为true/false–Null-空类型•值为null，尚不存在的对象–Number-数字类型——NaN.html•任何数字（NaN也是number类型，表示“非数”）•可以使用typeof(object)来获取object的类型；后面对typeof有详细介绍。232.9类型转换•类型转换–JavaScript是弱类型语言，变量的类型对应于其值的类型–可以对不同类型的变量执行运算，解释器强制转换数据类型，然后进行处理–如：运算结果数值与字符串相加将数值强制转换为字符串。布尔值与字符串相加将布尔值强制转换为字符串。数值与布尔值相加将布尔值强制转换为数值。242.9类型转换•字符串--数值——StrToNumber.html–parseInt(var)–parseFloat(var)–Number(var)–注意：•parseInt方法和parsefloat方法只对string类型有效，且需要是数字开头的字符串–如：parseInt(“100”);252.10语句•语句–区分大小写–语句由一个或多个表达式、关键字或运算符组成–多条语句可以写在同一行上，之间使用分号隔开–单独一行中只有一条语句，可以省略分号–但是我们要求，每行结尾必须加分号262.11运算符•运算符–赋值运算符–数学运算符–比较运算符–逻辑运算符272.11.1赋值运算符运算符示例说明=x=y;把变量y的值赋给x+=x+=y;x=x+y;-=x-=y;x=x-y;*=x*=y;x=x*y;/=x/=y;x=x/y;282.11.2数学运算符运算符说明示例+如果操作数都是数字时执行加法运算，如果其中的操作数有字符串时，会执行连接字符串的作用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=-5292.11.3关系运算符运算符说明示例==等于。如果两个操作数相等，则返回Truea==b!=不等于。如果两个操作数不等，则返回TrueVar2!=5大于。如果左操作数大于右操作数，则返回TrueVar1var2=大于或等于。如果左操作数大于或等于右操作数，则返回TrueVar1=5Var1=var2小于。如果左操作数小于右操作数，则返回TrueVar2var1=小于或等于。如果左操作数小于或等于右操作数，则返TrueVar2=4Var2=var1302.11.4逻辑运算符运算符例子说明&&expr1&&expr2逻辑与||expr1||expr2逻辑或!!expr逻辑非312.11.5typeof运算符•typeof——typeof.html–对变量或值调用typeof运算符将返回下列的值之一•“undefined”变量是undefined类型的•“boolean”变量是boolean类型的•“number”变量是number型的•“string”变量是string型的•“object”变量是一种引用类型或null•“function”变量是一个函数–例：vari=2;•alert(typeof(i));//返回number322.11.6条件运算符•条件运算符–(condition)?trueVal:falseValstatus=(age=18)?adult:minor34第三章：流程控制和函数目标:本章旨在向学员介绍JavaScript的流程控制和函数，通过本课的学习，学员应该掌握如下知识：1）了解JavaScript的流程控制2）了解函数构成，可以使用函数实现基本功能353.1流程控制•JavaScript语言构成–主要由控制语句、函数、对象、方法、属性等来实现编程•控制语句–条件语句•if•switch–for循环语句–while循环语句–break和continue语句363.1.1条件语句-if•if条件语句—js_if.html373.1.2条件语句-switch•switch条件语句—js_switch.html383.1.3循环语句-for•for循环语句—js_for.html393.1.4循环语句-while•while循环语句—js_while.html•do…while循环语句403.1.5break/continue•break语句–让执行语句从循环语句或其它程序块中跳出•continue语句–让执行语句跳过本次循环的剩余语句进入下一次循环413.2函数•JavaScript函数–完成某个功能的一组语句，把常用的功能写成一个函数–定义函数•function关键字•函数名称•参数列表•函数体423.2.1arguments对象•arguments对象——arguments.html–函数可以接受任意个数的参数，通过arguments来访