一、Date对象
Date对象 用于处理日期和时间。
1、创建 Date 对象
通过 new 关键词来定义 Date 对象。Date 对象会自动把当前日期和时间保存为其初始值。
//四种方式初始化日期：【接受不同参数】
new Date() // 当前日期和时间
new Date(milliseconds) //返回从 1970 年 1 月 1 日至今的毫秒数
new Date(dateString)
new Date(year, month, day, hours, minutes, seconds, milliseconds)
//参数：上面的参数大多数都是可选的，默认为0。
(1)、 默认参数→0
new Date()：取当前日期和时间
(2)、 参数→毫秒数
new Date(milliseconds)：从1970年1月1日00:00:00 UTC开始计算的毫秒数。如果将Unix时间戳作为参数，必须将Unix时间戳乘以1000。
(3)、 参数→日期字符串
new Date(dateString)：一个日期字符串，返回所对应的时间。所有可以被Date.parse()方法解析的日期字符串，都可以当作Date对象的参数
(3)、 参数→年、月、日、小时、分钟、秒和毫秒year, month, day, hours, minutes, seconds, milliseconds）：对应的年、月、日、小时、分钟、秒和毫秒。
注：
至少需要指定两个参数（年和月），其他参数都是可选的，默认为0。若只有一个参数，Date对象会将其解释为毫秒数。
2、常用方法
（1)、get类：
getTime(): 返回实例对象当前时间距离1970年1月1日00:00:00对应的毫秒数
getFullYear(): 返回调用这个方法时，当前或指定日期的年份（四位年份）
getMonth(): 返回月份，（0表示1月，11表示12月）调用这个方法时，当前或指定日期的月份
getDate(): 返回日（号），调用这个方法时，当前或指定日期的月份中的几号
getDay(): 返回星期，周日为0，周一为1，以此类推（0-6）
getHours(): 返回小时（0-23）
getMinutes(): 返回分钟（0-59）
getSeconds(): 返回秒（0-59）
getMilliseconds(): 返回毫秒（0-999）
（2)、set类：
etTime(): 以毫秒设置 Date 对象。
setFullYear(): 设置年份。
setMonth(month,day): 设置月份。可用于设置月份中的某一天。
setDate(): 设置一个月的某一天。
setHours(hour,min,sec,millisec): 设置指定的时间的小时字段。该方法可用于设置分钟，秒以及毫秒数。
setMinutes(min,sec,millisec): 用于设置指定时间的分钟字段。该方法同样可用于设置秒数与毫秒数。
setSeconds(sec,millisec): 用于设置日期对象的秒字段。可以用于设置毫秒数。
setMilliseconds(): 用于设置指定时间的毫秒字段。（0-999）
（3)、转换为字符串
toString()： 把 Date 对象转换为字符串
toDateString()： 返回日期的字符串形式
toLocaleDateString(): 返回一个字符串，代表日期的当地写法
toLocaleTimeString(): 返回一个字符串，代表时间的当地写法
（4)、Date.now()
Date.now(): 返回当前距离1970年1月1日00:00:00的毫秒数
（5)、parse(string)
parse()：解析日期字符串，返回距离1970年1月1日 00:00:00的毫秒数.
<script type="text/javascript">
function countTime() {
//获取当前时间
var date = new Date();
var now = date.getTime();
console.log(date,"=====",now);
//设置截止时间
var str="2018/12/18 16:50:03";
var endDate = new Date(str);
var end = endDate.getTime();
console.log(endDate,"=====",end);
//时间差
var timeGap = end-now;
//定义变量 d,h,m,s保存倒计时的时间
var d,h,m,s;
if (timeGap>=0) {
d = Math.floor(timeGap/1000/60/60/24);
h = Math.floor(timeGap/1000/60/60%24);
m = Math.floor(timeGap/1000/60%60);
s = Math.floor(timeGap/1000%60);
//递归每秒调用countTime方法，显示动态时间效果
setTimeout(countTime,1000);//计时器
}
else {
d = 0;
h = 0;
m = 0;
s = 0;
}
//将倒计时赋值到div中
document.getElementById("dayDate").innerHTML = d+"天";
document.getElementById("hourDate").innerHTML = h+"时";
document.getElementById("minuteDate").innerHTML = m+"分";
document.getElementById("secondDate").innerHTML = s+"秒";
}
</script>
二、RegExp对象
RegExp 对象表示正则表达式，它是对字符串执行模式匹配的强大工具。
- 直接量语法：/pattern/attributes
- 创建RegExp对象的语法：new RegExp(pattern, attributes);
参数: - 参数 pattern 是一个字符串，指定了正则表达式的模式或其他正则表达式。
- 参数 attributes 是一个可选的字符串，包含属性 “g”、“i” 和 “m”，分别用于指定全局匹配、不区分大小写的匹配和多行匹配。ECMAScript 标准化之前，不支持 m 属性。如果 pattern 是正则表达式，而不是字符串，则必须省略该参数。
- 返回值
一个新的 RegExp 对象，具有指定的模式和标志。如果参数 pattern 是正则表达式而不是字符串，那么 RegExp() 构造函数将用与指定的 RegExp 相同的模式和标志创建一个新的 RegExp 对象。
如果不用 new 运算符，而将 RegExp() 作为函数调用，那么它的行为与用 new 运算符调用时一样，只是当 pattern 是正则表达式时，它只返回 pattern，而不再创建一个新的 RegExp 对象。
1、正则表达式字面量与使用构造函数的场景比较：
- 正则表达式字面量在脚本加载后编译。若你的正则表达式是常量，使用这种方式可以获得更好的性能。
- 使用构造函数，提供了对正则表达式运行时的编译。当你知道正则表达式的模式会发生改变， 或者你事先并不了解它的模式或者是从其他地方（比如用户的输入），得到的代码这时比较适合用构造函数的方式。
2、RegExp对象的使用
RegExp(pattern ， [, flags])
flags，表示匹配模式，可以是下面的几种值：
g，全局匹配
i，忽略大小写
m，开始和结束字符（^ 和 $）在多行模式工作，即：^ 和 $ 可以匹配字符串中每一行的开始和结束（行是由 \n 或 \r 分割的），而不只是整个输入字符串的最开始和最末尾处
var str="Every man in the world! Every woman on earth!";
patt=/man/g;
str2=str.replace(patt, "person");
console.log(str2); //Every person in the world! Every woperson on earth!
var str = "hello Itbilu.com";
var patt = new RegExp("itbilu","ig");
var result = patt.exec(str);
console.log(result); // [ 'Itbilu', index: 6, input: 'hello Itbilu.com' ]
console.log(result[0]); //Itbilu
console.log(result.index); // 6
(1)、方括号
方括号用于查找某个范围内的字符
| 表达式 | 描述 |
|---|---|
| [abc] | 查找方括号之间的任何字符。 |
| [^abc] | 查找任何不在方括号之间的字符。 |
| [0-9] | 查找任何从 0 至 9 的数字。 |
| [a-z] | 查找任何从小写 a 到小写 z 的字符。 |
| [A-Z] | 查找任何从大写 A 到大写 Z 的字符。 |
| [A-z] | 查找任何从大写 A 到小写 z 的字符。 |
| [adgk] | 查找给定集合内的任何字符。 |
| [^adgk] | 查找给定集合外的任何字符。 |
| (red｜blue｜green) | 查找任何指定的选项。 |
(2)、元字符
元字符是拥有特殊含义的字符：
| 元字符 | 描述 |
|---|---|
| . | 查找单个字符，除了换行和行结束符。 |
| \w | 查找单词字符。 |
| \W | 查找非单词字符。 |
| \d | 查找数字。 |
| \D | 查找非数字字符。 |
| \s | 查找空白字符。 |
| \S | 查找非空白字符。 |
| \b | 匹配单词边界。 |
| \B | 匹配非单词边界。 |
| \0 | 查找 NUL 字符。 |
| \n | 查找换行符。 |
| \f | 查找换页符。 |
| \r | 查找回车符。 |
| \t | 查找制表符。 |
| \v | 查找垂直制表符。 |
| \xxx | 查找以八进制数 xxx 规定的字符。 |
| \xdd | 查找以十六进制数 dd 规定的字符。 |
| \uxxxx | 查找以十六进制数 xxxx 规定的 Unicode 字符。 |
(3)、量词
| 量词 | 描述 |
|---|---|
| n+ | 匹配任何包含至少一个 n 的字符串。 |
| n* | 匹配任何包含零个或多个 n 的字符串。 |
| n? | 匹配任何包含零个或一个 n 的字符串。 |
| n{X} | 匹配包含 X 个 n 的序列的字符串。 |
| n{X,Y} | 匹配包含 X 至 Y 个 n 的序列的字符串。 |
| n{X,} | 匹配包含至少 X 个 n 的序列的字符串。 |
| n$ | 匹配任何结尾为 n 的字符串。 |
| ^n | 匹配任何开头为 n 的字符串。 |
| ?=n | 匹配任何其后紧接指定字符串 n 的字符串。 |
| ?!n | 匹配任何其后没有紧接指定字符串 n 的字符串。 |
(4)、RegExp 对象属性
| 属性 | 描述 |
|---|---|
| global | RegExp 对象是否具有标志 g。 |
| ignoreCase | RegExp 对象是否具有标志 i。 |
| lastIndex | 一个整数，标示开始下一次匹配的字符位置。 |
| multiline | RegExp 对象是否具有标志 m。 |
| source | 正则表达式的源文本。 |
(5)、RegExp 对象方法
| 方法 | 描述 |
|---|---|
| compile | 编译正则表达式。 |
| exec | 检索字符串中指定的值。返回找到的值，并确定其位置。 |
| test | 检索字符串中指定的值。返回 true 或 false。 |
(6)、支持正则表达式的 String 对象的方法
| 方法 | 描述 |
|---|---|
| search | 检索与正则表达式相匹配的值。 |
| match | 找到一个或多个正则表达式的匹配。 |
| replace | 替换与正则表达式匹配的子串。 |
| split | 把字符串分割为字符串数组。 |
三、Error对象
1、概念
error是指程序中的非正常运行状态，在其他编程语言中称为“异常”或“错误”，解释器会为每个错误情形创建并抛出一个Error对象，其中包含错误的描述信息；
ECMAScript定义了六种类型的错误，除此之外，还可以使用Error构造方法创建自定义的Error对象，并使用throw语句抛出该对象；
六种错误：
- 1）ReferenceError：引用错误，要用的东西没找到；
- 2）TypeError：类型错误，错误的调用了对象的方法；
- 3）RangeError：范围错误，专指参数超范围；
- 4）SyntaxError：语法写错了；
- 5）EvalError：eval()方法错误的使用；
- 6）URIError：URI地址错误；
2、错误处理(捕捉)
即使程序发生错误，也保证不异常中断的机制.
try{
// 可能发生错误的代码
}catch(err){
// 只有发生错误时才执行的代码
}finally{
// 无论是否出错，肯定都要执行的代码
}
使用要点：
1）使用try包裹的代码，即使不出错，效率也比不用try包裹的代码低；
2）在try中，尽量少的包含可能出错的代码；
3）无法提前预知错误类型的错误，必须用try…catch…捕获，如果已经提前预知错误的类型，就用if…else…来代替try…catch，除掉错误预知的这个前提，if…else…的用法和try…catch…的用法是基本相同的，且if…else…的可读性比try…catch…更强，语句理解能力也更好，开发人员与用户更加倾向于使用if…else…，但是如果无法判断语句是否正确的话，使用try…catch…会更加保险；
4）finally可以省略；
// if...else...
function err(a) {
if (!isNaN(a)) {
console.log('你输入的数字是：' + a);
} else {
throw new Error('你输入的是非数字，请重新输入！')
}
}
var a = prompt('请输入一位数字：');
err(a);
四、Array对象
数组是值的有序集合。每个值叫做一个元素，而每个元素在数组中有一个位置，以数字表示，称为索引。JavaScript数组是无类型：数组元素可以是任意类型，并且同一个数组中的不同元素也可能有不同的类型。
1、定义方式
var names = new Array(“张三”, “李四”, “王五”);
var names = [“张三”, “李四”, “王五”];
2、属性length
length：表示数组内的元素长度。
var names = [“张三”, “李四”, “王五”];
console.log(names.length);
3、实例方法
常用方法：
-
unshift() ：在数组头部插入元素
-
shift() ：移除并返回数组的第一个元素
-
push() ：在数组尾部插入元素
-
pop() ：移除并返回数组的最后一个元素
-
concat() ：把元素衔接到数组中。不会修改原先的array,返回新的数组
-
every() ：依次遍历元素，判断每个元素是否都为true
-
filter() ：依次遍历元素，返回包含符合条件元素的新的数组
-
forEach() ：依次遍历元素，执行指定的函数；无返回值
-
indexOf() ：在数组中查找匹配元素。若不存在匹配的元素时，就返回-1。查找的时候使用"==="运算符，所以要区分1和’1’ .
-
join() ：将数组中所有元素通过一个分隔符拼接为一个字符串
-
lastIndexOf ：在数组中反向查找匹配元素。若不存在匹配的元素时，就返回-1。查找的时候使用"==="运算符，所以要区分1和’1’
-
map() ：依次遍历并计算每个元素，返回计算好的元素的数组
-
slice(startIndex,endIndex) ：返回数组的一部分
-
sort(opt_orderFunc) ：按一定的规则进行排序
-
splice() ：插入、删除数组元素
-
toString() ：将数组中所有元素通过一个英文逗号’,'拼接为一个字符串
-
unshift() ：在数组头部插入元素
-
Array.isArray() ：判断对象是否为数组
var demoArray = ['a', 'b', 'c'];
var demoArray2 = demoArray.concat('e');
var demoArray = [1, 2, 3];
var rs = demoArray.every(function (value, index, self) {
return value > 0;
});
var rs = demoArray.filter(function (value, index, self) {
return value > 0;
});
demoArray.forEach(function (value, index, self) {
console.log(value); // => 依次输出：1 2 3
});
['a', 'b', 'c'].indexOf('a'); // =>0
['a', 'b', 'c'].join(); // => 'a,b,c'
['a', 'b', 'c'].lastIndexOf('a'); // => 0
demoArray.map(function (value, index, self) {
return value * 2;
}); // => [2, 4, 6]
var demoArray = ['a', 'b', 'c'];
demoArray.pop(); // => c
demoArray.push('d'); // => 4, demoArray ： ['a', 'b', 'd']
demoArray.reverse(); // d,b,a
[1, 2, 3, 4, 5, 6].slice(0, 4); // => [1, 2, 3, 4] ：截取序号0到序号3(序号4的前一个)的元素
[1, 3, 5, 2, 4, 11, 22].sort(); // => [1, 11, 2, 22, 3, 4, 5] ：这里都元素都被转换为字符，11的字符在2前
var demoArray = ['a', 'b', 'c', 'd', 'e'];
var demoArray2 = demoArray.splice(0, 2); // 删除从序号从0开始的2个元素，返回包含删除元素的数组：['a', 'b']
[1, 2, 3, 4, 5].toString(); // => '1,2,3,4,5'
demoArray.unshift('a'); // => demoArray:['a']
Array.isArray(['a', 'b', 'c']); // => true
for (var i = 0, length = demoArray.length; i < length; i++) {
console.log(demoArray[i]); // => 逐个输出数组内的元素
}
var demoArrayB = demoArrayA; // 浅度复制:把数组A 赋值给数组B
var demoArrayB = demoArrayA.concat(); // 使用concat()方法，返回新的数组
五、Document对象
在浏览器中，与用户进行数据交换都是通过客户端的javascript代码来实现的，而完成这些交互工作大多数是document对象及其部件进行的，因此document对象是一个比较重要的对象。
document对象是文档的根节点，window.document属性就指向这个对象。也就是说，只要浏览器开始载入HTML文档，这个对象就开始存在了，可以直接调用。
document.childNodes属性返回该对象的所有子节点。对于HTML文档来说，document对象一般有两个子节点。
-
第一个子节点是document.doctype，表示文档类型节点（DocumentType）。对于HTML5文档来说，该节点就代表。
-
第二个子节点是document.documentElement，表示元素节点（Element），代表：。
1、document 对象的属性
| 属性 | 说明 |
|---|---|
| document.title | 设置文档标题等价于HTML的 |
| document.bgColor | 设置页面背景色 |
| document.linkColor | 未点击过的链接颜色 |
| document.alinkColor | 激活链接(焦点在此链接上)的颜色 |
| document.fgColor | 设置前景色(文本颜色) |
| document.vlinkColor | 已点击过的链接颜色 |
| document.URL | 设置URL属性从而在同一窗口打开另一网 |
| document.fileCreatedDate | 文件建立日期，只读属性 |
| document.fileModifiedDate | 文件修改日期，只读属性 |
| document.fileSize | 文件大小，只读属性 |
| document.cookie | 设置和读出cookie |
| document.charset | 设置字符集 简体中文:gb2312 |
指向特定元素集合的属性
document.all ：文档中所有的元素，Firefox不支持该属性。
document.forms ：所有的form元素。
document.images：所有的img元素。
document.links：所有的a元素。
document.scripts：所有的script元素。
document.styleSheets：所有的link或者style元素。
2、对象方法：
| 方法 | 说明 |
|---|---|
| document.write() | 动态向页面写入内容 |
| document.createElement(Tag) | 创建一个html标签对象 |
| document.getElementById(ID) | 获得指定ID值的对象 |
| document.getElementsByTagName(tagname) | 获得指定标签名的对象 |
| document.getElementsByName(Name) | 获得指定Name值的对象 |
| document.getElementsByClassName(classname) | 获得指定类名的对象（html5 API） |
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script type="text/javascript">
function btnClick1() {
var txt = document.getElementById("tb1");
alert(txt.value);
//alert(tb1.value); //不推荐tb1.value这种方式
}
function btnClick2() {
var txt = document.getElementById("tb2");
alert(txt.value);
//alert(Form1.tb2.value); //不推荐tb1.value这种方式,如果<input>被<form>标签包含着，就要Form1.tb2.value取得文本框的值
}
</script>
</head>
<body>
<input type="text" id="tb1" />
<input type="button" value="TextBox1" onclick="btnClick1()" />
<form action="Event.htm" id="Form1">
<input type="text" id="tb2" />
<input type="button" value="TextBox2" onclick="btnClick2()" />
</form>
</body>
</html>
六、Window对象
window对象是BOM的核心，window对象指当前的浏览器窗口。除了是BOM中所有对象的父对象外，还包含一些窗口控制函数。
JavaScript中的任何一个全局函数或变量都是window的属性。
self对象与window对象完全相同，self通常用于确认就是在当前的窗体内。window、self、window.self三者是等价的。
1、window的子对象
window的主对象主要有如下几个：
- JavaScript document 对象
- JavaScript frames 对象
- JavaScript history 对象
- JavaScript location 对象
- JavaScript navigator 对象
- JavaScript screen 对象
2、Window对象常用方法
| 方法 | 描述 |
|---|---|
| alert | 显示包含由应用程序自定义消息的对话框。 |
| attachEvent | 将指定函数绑定到事件，以便每当该事件在对象上触发时都调用该函数。 |
| blur | 使元素失去焦点并触发 onblur 事件。 |
| clearInterval | 使用 setInterval 方法取消先前开始的间隔事件。 |
| clearTimeout | 取消先前用 setTimeout 方法设置的超时事件。 |
| close | 关闭当前浏览器窗口或 HTML 应用程序(HTA)。 |
| confirm | 显示一个确认对话框，其中包含一个可选的消息和确定取消按钮。 |
| createPopup | 创建弹出窗口。 |
| detachEvent | 从事件中取消指定函数的绑定，这样当事件触发时函数就不会收到通知了。 |
| e-x-e-c-Script | （此单词实际使用无中线，系统屏蔽特殊原因修改） 以给定语言执行指定的脚本。 |
| focus | 使得元素得到焦点并执行由 onfocus 事件指定的代码。 |
| moveBy | 将窗口的位置移动指定 x 和 y 偏移值。 |
| moveTo | 将窗口左上角的屏幕位置移动到指定的 x 和 y 位置。 |
| navigate | 在当前窗口中装入指定 URL。 |
| open | 打开新窗口并装入给定 URL 的文档。 |
| 打印与窗口关联的文档。 | |
| prompt | 显示一个提示对话框，其中带有一条消息和一个输入框。 |
| resizeBy | 更改窗口的当前位置缩放指定的 x 和 y 偏移量。 |
| resizeTo | 将窗口的大小更改为指定的宽度和高度值。 |
| scroll | 将窗口滚动到自左上角起指定的 x 和 y 偏移量。 |
| scrollBy | 将窗口滚动 x 和 y 偏移量。 |
| scrollTo | 将窗口滚动到指定的 x 和 y 偏移量。 |
| setActive | 设置对象为当前对象而不将对象置为焦点。 |
| setInterval | 每经过指定毫秒值后计算一个表达式。 |
| setTimeout | 经过指定毫秒值后计算一个表达式。 |
| showHelp | 显示帮助文件。此方法可用于 Microsoft HTML 帮助。 |
| showModalDialog | 创建一个显示指定 HTML 文档的模式对话框。 |
| showModelessDialog | 创建一个显示指定 HTML 文档的非模式对话框。 |
2、Window对象常用属性
| 属性 | 描述 |
|---|---|
| closed | 获取引用窗口是否已关闭。 |
| defaultStatus | 设置或获取要在窗口底部的状态栏上显示的缺省信息。 |
| dialogArguments | 设置或获取传递给模式对话框窗口的变量或变量数组。 |
| dialogHeight | 设置或获取模式对话框的高度。 |
| dialogLeft | 设置或获取模式对话框的左座标。 |
| dialogTop | 设置或获取模式对话框的顶座标。 |
| dialogWidth | 设置或获取模式对话框的宽度。 |
| frameElement | 获取在父文档中生成 window 的 frame 或 iframe 对象。 |
| length | 设置或获取集合中对象的数目。 |
| name | 设置或获取表明窗口名称的值。 |
| offscreenBuffering | 设置或获取对象在对用户可见之前是否要先在屏幕外绘制。 |
| opener | 设置或获取创建当前窗口的窗口的引用。 |
| parent | 获取对象层次中的父窗口。 |
| returnValue | 设置或获取从模式对话框返回的值。 |
| screenLeft | 获取浏览器客户区左上角相对于屏幕左上角的 x 座标。 |
| screenTop | 获取浏览器客户区左上角相对于屏幕左上角的 y 座标。 |
| self | 获取对当前窗口或框架的引用。 |
| status | 设置或获取位于窗口底部状态栏的信息。 |
| top | 获取最顶层的祖先窗口。 |
3、Window的事件
| 事件 | 描述 |
|---|---|
| onactivate | 当对象设置为活动元素时触发。 |
| onafterprint | 对象所关联的文档打印或打印预览后立即在对象上触发。 |
| onbeforedeactivate | 在 activeElement 从当前对象变为父文档其它对象之前立即触发。 |
| onbeforeprint | 对象的关联文档打印或打印预览前在对象上触发。 |
| onbeforeunload | 在页面将要被卸载前触发。 |
| onblur | 在对象失去输入焦点时触发。 |
| oncontrolselect | 当用户将要对该对象制作一个图像、表格和任意绝对定位的元素中的控件。">控件选中区时触发。 |
| ondeactivate | 当 activeElement 从当前对象变为父文档其它对象时触发。 |
| onerror | 当对象装载过程中发生错误时触发。 |
| onfocus | 当对象获得焦点时触发。 |
| onhelp | 当用户在浏览器为当前窗口时按 F1 键时触发。 |
| onload | 在浏览器完成对象的装载后立即触发。 |
| onmove | 当对象移动时触发。 |
| onmoveend | 当对象停止移动时触发。 |
| onmovestart | 当对象开始移动时触发。 |
| onresize | 当对象的大小将要改变时触发。 |
| onresizeend | 当用户更改完控件选中区中对象的尺寸时触发。 |
| onresizestart | 当用户开始更改控件选中区中对象的尺寸时触发。 |
| onscroll | 当用户滚动对象的滚动条时触发。 |
| onunload | 在对象卸载前立即触发。 |