JavaScript课程总结复习
班号：QR2088 姓名： 宋延军
•认识并熟悉JavaScript
•掌握JavaScript 数据类型
•掌握Javascript 函数和事件的处理
•掌握JavaScript 浏览器对象
•掌握Javascript 文档对象
•掌握JavaScript CSS样式特效
•掌握JavaScript 表单验证和正则表达式
由于好不容易的写完了之后，发现 超出字符限定的范围了，所以分为两部分发布出来。如果我的这个总结中还有什么没有涉及完全的地方，请帮忙在楼下追加上，有经验就 不要藏着掖着，贴出来，大家共同的分享分享，谢谢了。
要知道什么是脚本语言：
<1> 它是一种应用程序的 扩展语言，用于系统的扩展，是其按照用户需求去执行。
<2> 它是弱语言，JavaScript程序是由一些简单的ASCII字符构成的，可以用任何编辑器来编写。
JavaScript的用途：
<1> 表单验证
<2> 页面动态效果
JavaScript的组成-实现分为 3 部分：
<1> ECMA Script （核心 ）
<2> DOM （文档对象模型）
<3> BOM （浏览器对象模型）
JavaScript 有 3个特点：
<1> 它是 脚本语言 （包括：嵌入 ，非嵌入）
<2> 解释语言 （和编译不同，解释型语言 不需要编译）
<3> 弱类型语言。 （它只能用于外部应用）
document 对象的 write 方法 ，可以将方法中的字符串输出显示。
window 对象的 alert 方法， 可以 消息框的形式输出信息。
JavaScript程序嵌入HTML文档的常用用法：就是将代码放在 “<script>”标签对中。
JavaScript使用 Unicode字符集编写，大小写敏感， 注释只有单行注释 和多行注释。
定义脚本基本语法结构：
- <script language = “JavaScript” > <!--脚本开的开始-->
- document.write( “ Hello World!!! ” ); <!--输出语句-->
- alert(“ Hello World !! ”); <!--弹出语句-->
- </script> <!--脚本结束-->
JavaScript 与 Java 基本语法的相同之处：
只能说函数 与 变量 的命名规则 类似于Java，语法和Java还是有差异的。
Java 定义变量是类型，例如string ；而JavaScript定义的是 Object
数据类型
基本数据类型包括:
1. 数值
2. 布尔
3. 字符串
4. null值
复合数据类型包括：
1. 对象 ( 例如: object、Boolean、string、Array、Number、Date…….)
2. 数组
构造函数原型
例如：String 对象，它封装着字符串相关联的特性，主要用来处理字符串 String（[ args ]）
JavaScript 中调用对象的属性和方法与 Java 、C# 相同。
采用：对象名 . 方法名
对象名 . 属性名
在JavaScript中 数组与对象一样，也是一些数据的集合，
这些数据可以是字符串型、数字型、布尔型、或者是复合型。
在JavaScript中数组下标是从 0 开始，
使用数组名加下标的方法，可以获取数组中的某个数据。
注意：
创建数组时尽管可以指定数据元素个数，但是真正为数组元素分
配内存需要等到给数组赋值的时候。
数学对象（Math）封装了与数学相关的特性。
数学函数，直接调用Math对象的方法或属性的方式：
Math . 属性名
Math . 方法名（注意：Math对象不能使用new关键字创建）
Javascript 将与日期相关的所有特性封装进 Date 对象， 主要用于一些与时间相关的操作。
创建日期对象有 3 种方式：
<1> var time = new Date();//直接创建日期对象
<2> var time = new Date(3600);//创建毫秒数的时间对象
<3> var time = new Date(yyyy,mm,dd);//指定日期时间的对象
Year年Month月Date日Day星期 Hours时Minutes分Seconds秒
返回日期对象方法：
toLocaleString() //返回以地点特定格式显示 Date的日期和时间部分
toDateString() //返回特定格式显示Date的日期部分（月.日.年）
toTimeString() //返回特定格式显示Date的日期部分（时.分.秒）
toLoaleTimeString() //特定格式 显示 Date 时间格式
toLoaleDateString() //特定格式 显示 Date 日期格式
全局对象：是所有全局方法的拥有者，用来统一管理全局方法，
全局方法也就是指全局函数。
注意：
该对象也不能使用 new 运算符创建对象实例，所有方法直接调用即可。
全局对象常用的方法：
<1> isFinite( numberper) //检测一个数是否无穷大
<2> isNaN ( value ) //检测某个值是否非数字类型的值
<3> Numbert( object per ) //返回对象的值转换成数字
<4> parseFloat ( String per) //返回字符串转成浮点型
<5> parseInt ( String per) //返回字符串转成×××型
<6> String ( object ) //返回对象的值转成字符串
类型转换：因为JavaScript是一门简单的、弱类型语言，编程时无需指定变 量的数据类型，系统会根据需要自动在类型之间转换。
类型转换分为：
<1> 隐式转换（例如，我们使用的write 和 alert 方法，无论什么类型数据最总会被自动转换成字符串）
<2> 显示转换（此过程需要手动转换到目标类型，即将某一种类型的数据转换成另一种数据的特定方法）
注意：
显示转换 当要转换的字符串中带有 parseInt 或 parseFloat 方法不可识别的字符时，转换结果可能没法预料！
系统的内置对象包括：
字符串（String），数组（Array），数值（Number），日期（Date），全局（Global）对象等……….
函数和事件处理
•函数：
是将程序代码组织为可重复调用的单元。可完成特定任务并返回特定数据，它是独立主程序而存在的，拥有特定功能的程序代码块，并且这个代码块可以在主程序或其它函数中根据需要而被调用。
（函数可以间接性的理解为，它就是方法。）
•使用函数的优点：1.复用 2.不让其自动执行
•函数分为：1.系统函数 2.用户自定义函数
对象在自定义函数的时候，要使用 function 来进行创建函数。
函数的3种定义方式
- <script language="javascript">
- <!--普通定义方式:-->
- function name （par1,par2,par3,parN）{
- 函数主体；
- return 表达式；
- }
- <!--函数变量定义方式:-->
- var name = new Function(“par1”,”parN”,”函数主体；return 表达式”)
- <!--函数表达式定义方式:-->
- var name = function(par1 , parN){
- 函数主体；
- return 表达式；
- }
- </script>
•函数分为 3 类：
<1> 构造函数（函数的名字都大写）
<2> 有返回值函数（加 return）
<3> 无返回值函数（不加 return）
函数的作用域：指该函数当前所处位置被其它对象访问范围，就是作用域。
this关键字：this变量的值，如果没有指定的话，默认调用的是函数当前对象Global 全局对象作用域。
公有函数：就是每一行代码都可以调用到该函数。
私有函数：是指函数处于局部作用域中的函数。
JavaScript 中函数参数都由Arguments对象来管理。
Arguments 的作用：主要用来判断函数中的实际个数是否与传进去的个数相同。
•JavaScript 和 HTML 之间的交互通过用户和浏览器操作页面时引发的事件（Event）来处理的。
•在JavaScript 中对象事件的处理通常由函数（Function）担任。
•语法：
function 事件处理名（参数名）
{
事件处理语句集合 ;
}
响应事件的两种方式：
<1>将函数作为事件处理程序。
<2>直接在事件属性中编写函数代码。
JavaScript 事件驱动中的事件：
是通过鼠标 或 热键 的动作引发的。
实现使用特效，只有 2 步：
1. 编写函数。
2. 对应事件中调用函数。
•JavaScript 事件都是 on 开头
•文档的层次关系：
document . 表单名 . 元素名 . Value ;
Event 对象是一个全局属性，这个属性（变量）提供了事件的细节。
注意：
在IE中，不能把 Event对象 作为参数 传给事件处理程序，
只能用window.event或者event来引用Event 对象。
因为在 IE中，Event是 window 的一个属性，
也就是说Event 是一个全局变量，这个变量提供了事件的细节。
•事件起泡的概念：
IE事件中的起泡：IE中的事件可以沿着包容层次一点点起泡到上层，也就是说，下层的 DOM 节点定义的事件处理函数，到了上层的节点，如果还有和下层相同事件处理函数，那么上层的事件处理函数也会执行。
例如：
<div>标签中包含了<a>，两个标签中都有 onClick 事件处理函数，先执行<a>后执行<div>
浏览器对象
JavaScript的对象包括 4 个部分：
<1>语言核心
<2>基本内置对象
<3>浏览器对象
<4>文档对象
window 是所有对象模型中的顶级对象。（即全局对象）
window 对象下的常用属性：
document 文档对象
history 历史
location 地址
status 状态
screen 有关客户端的屏幕和显示性能的信息
需要注意的是：
window 的方法和属性的调用和其他方法一样， 区别是 window 对象不需要创建即可使用，还有就是 window 对象名称是小写。
window 作为对象的一种，也有着自己的方法和属性。
调用格式如下：
window . 属性名
window . 方法名（参数列表）
•window 对象中的属性比较多，这些属性大多都是浏览器窗口中所有的属性，并不可移植。
window 对象常用方法：
Open //打开一个窗口
Alert //显示一个带提示信息和确定按钮的对话框
Confirm //显示一个确认框
Prompt //显示一个输入框
setTimeout //定时设置
setInterval //设定延迟时间
clearTimeout //取消定时设置
window 对象常用的事件有 7 种：
- onblur onerror onfocus
•通过这七种事件，可以在浏览器窗口中装载于卸载文档，得到于失去焦点，移动和调整窗口大小，执行代码出错时，执行特定的程序。
•匿名函数
- window . Onload = function()
- {
- alert(“你好！” ) ;
- }
•为了于客户端进行基本的交互，window 对象提供了3 种对话框：
<1>询问对话框 window . confirm()
<2>警告对话框 window . alert()
<3>输入对话框 window . prompt()
•打开普通窗口的open()方法语法：
•window.open(url，name，features，replace)
–url：可选的字符串，声明了要在新窗口中显示的文档的 URL。如果省略了这个参数，或者它的值是空字符串，那么新窗口就不会显示任何文档。
–name：可选的字符串，新窗口的名称，用HTML链接的target属性进行定位时会有用。
–features：可选字符串，列举窗口的特征。
–replace：可选布尔值，指明是否允许URL替换窗口的内容
•状态栏的类型有 2 种：
<1> 默认状态栏信息
<2> 瞬间状态栏信息
•窗口的特征如下，可以任意组合：
•fullscreen = yes | no | 1 | 0 是否使用全屏模式显示浏览器。
•height = pixels 窗口文档显示区的高度。
•left = pixels 窗口距离屏幕左侧的像素值
•location = yes | no | 1 | 0 是否显示地址字段。
•menubar = yes | no | 1 | 0 是否显示菜单栏。
•resizable = yes | no | 1 | 0 窗口是否可调节尺寸。
•scrollbars = yes | no | 1 | 0 是否显示滚动条。
•status = yes | no | 1 | 0 是否添加状态栏。
•titlebar = yes | no | 1 | 0 是否显示标题栏。
•Toolbar = yes| no | 1 | 0 是否显示浏览器的工具栏。
•top = pixels 窗口距离屏幕顶部的像素值
•width = pixels 窗口的文档显示区的宽度。
•模式窗口打开方法showModalDialog()
•其语法：
• window.showModalDialog(url，name，features) ;
–url：字符串，新窗口的文档URL
–name：字符串，新窗口的名称，用HTML链接的 target属性 进行定位时会有用。
–features：字符串，列举窗口的特征。
•窗口的特征如下，可以任意组合：
•dialogWidth 对话框宽度。
•dialogHeight 对话框高度
•dialogLeft 距离屏幕左侧的距离。
•dialogTop 距离屏幕上方的距离。
•center: {yes | no | 1 | 0 } 窗口是否居中。
•resizable: {yes | no | 1 | 0 } 是否可被改变大小。
•status: {yes | no | 1 | 0 } 是否显示状态栏。
•scroll:{ yes | no | 1 | 0 | on | off } 指明对话框是否显示滚动条。
•使用window对象的 setTimeout 函数解决可以指定一个延时及延时之后执行的时间。也可以使用window对象的setInterval 函数进行定时循环执行。
•history对象，也称历史对象，该对象用来存储客户端浏览器窗口最近所浏览过的历史网址。
•通过History对象的方法，可以完成类似与浏览器窗口中的前进、后退等按钮的功能。
•出于安全方面的考虑，在 history对象中，不能访问到客户端浏览器窗口最近所浏览过的网页URL。
•Histoy常用方法：
•back（） 后退
•forward（） 前进
•length 历史记录列表中的元素个数
•go() 可以前进，也可以后退（推荐使用）
例如：
在历史的范围内去到指定的一个地址。如果 x < 0，则后退x 个地址，
如果 x > 0，则前进 x 个地址，如果 x == 0，则刷新现在打开的网页
[这种方式是最常用的]
•history.go() 的使用例子：
<input type="button" value="history.go(-1)" onClick="history.go(-1)">
<input type="button" value="history.go(1)" onClick="history.go(1)">
•Location对象也是JavaScript中的一种默认对象，该对象代表了当前显示的文档的URL。通过Location对象可以访问当前文档的URL的各个不同部分。
•Location 对象的常用属性和方法：
•
<1>
host 描述url的主机名和端口，只有端口号是url的一个明确部分时，值中才包括端口号。
<2>
•Href该属性提供一个指定窗口对象的整个url的字符串。
<3>
•hostname典型的url的主机名是网络上服务器的名字，该网络存储有你浏览器上可查看的文档.
•reload() 重新加载新文档，可以刷新当前文档
•replace() 当用户从当前网页，跳转到别的网页(就是替换，在历史中不存在你替换掉的那页)
•assign() assign(“url”)通过这个方法可以实现把一个新的url赋给location对象。(相当于href)
•加载新的URL例子：
- <script language="javascript">
- function GoToUrl(){
- window. location.href = "http://www.qq.com";
- }
- document.write("浏览器将在5秒后跳转到“腾讯”首页");
- window.setTimeout("GoToUrl()", 5000); // 设置定时器
- </script>
•
•注意：location对象可对属性进行可赋值同时也可以读取属性值。
•文档的加载方式有三种：
<1> assign( ) <2> replace( ) <3> reload( )
