错误处理机制
Error 对象和try..catch语句
1.Error 对象
Javascript解析或者执行时,一旦发生错误,JavaScript引擎就会抛出一个错误对象。JavaScript原生的提供一个Error构造函数,所有抛出的错误都是这个构造函数的实例。
根据语言标准,Error对象示例必须具有message属性,表示错误出现时的提示信息。对于大部分的Javascript引擎,对Error对象还提供name和stock属性,分别表示错误的名称和错误的堆栈信息,他们是非标准的,不是每一个Error实例都要去实现。
f2();
function f1() {
console.log(abc);
}
function f2() {
f1();
}
观察控制台中的错误。
其中:“abc is not defined”是错误提示信息。
最下面的三行错误信息就是堆栈信息。
2.try…catch语句
为了对错误进行处理,我们需要使用try…catch结构。
允许在try…catch块最后定义finally块,表示不管是否出现错误,都必须要在后面运行的语句。
在finally块中一般都是做一些清理的工作。
function f1() {
;;;;;
try {
console.log("begin");
console.log(abc); // 一旦出错,Javascript引擎就是构造一个Error对象
} catch(err) {
console.log(err.message);
} finally {
console.log("end");
}
Javascript的原生错误类型
Error对象是最一般的错误类型,在其基础上,Javascript还定义了6中错误,也就是说存在6中派生的错误对象。
1. SyntaxError是解析代码时发生的错误
var 1a = "abc";
console.log "abc");
2. ReferenceError 是引用一个不存在的变量发生的错误
console.log(abc); // 引用一个不存在的变量
console.log() = 1; // 将一个值分配给一个无法分配的对象
3. RangeError 是当一个值超出有效范围时发生的错误
var arr = new Array(-1);
4.TypeError 是变量或者参数不是预期类型时发生的错误。比如字符串、数值、布尔等原始类型的值使用new命令,就是抛出该错误。
new 123;
5.URIError是URI相关函数不正确时抛出的错误
6.EvalError 是Eval函数没有正确执行时抛出的错误
BOM模型
- 浏览器对象模型 (BOM) 使 JavaScript 有能力与浏览器”对话”。
- 浏览器对象模型(Browser Object Model (BOM))尚无正式标准。
- 由于现代浏览器已经(几乎)实现了 JavaScript 交互性方面的相同方法和属性,因此常被认为是 BOM 的方法和属性。
- 包括:window对象、location对象、navigator对象、screen对象和history对象。
Window对象
- 所有浏览器都支持 window 对象。它表示浏览器窗口。
- 所有 JavaScript 全局对象、函数以及变量均自动成为 window 对象的成员。
- 全局变量是 window 对象的属性。
- 全局函数是 window 对象的方法。
甚至 HTML DOM 的 document 也是 window 对象的属性之一:
window.document.getElementById("header");
与此相同:
document.getElementById("header");
JavaScript 计时事件
通过使用 JavaScript,我们有能力作到在一个设定的时间间隔之后来执行代码,而不是在函数被调用后立即执行。我们称之为计时事件。
在 JavaScritp 中使用计时事件是很容易的,两个关键方法是:
setInterval()
- 间隔指定的毫秒数不停地执行指定的代码。setTimeout()
- 暂停指定的毫秒数后执行指定的代码
Note: setInterval() 和 setTimeout() 是 HTML DOM Window对象的两个方法。
1.setInterval() 方法
setInterval()
间隔指定的毫秒数不停地执行指定的代码。
window.setInterval("javascript function",milliseconds);
- window.setInterval() 方法可以不使用window前缀,直接使用函数setInterval()。
- setInterval() 第一个参数是函数(function)。
- 第二个参数间隔的毫秒数。
注意: 1000 毫秒是一秒。
function myFunction(){
setInterval(function(){alert("Hello")},3000);
}
在页面上显示一个时钟:
var myVar=setInterval(function(){myTimer()},1000);
function myTimer(){
var d=new Date();
var t=d.toLocaleTimeString();
document.getElementById("demo").innerHTML=t;
}
2.如何停止执行?
clearInterval()
方法用于停止setInterval()方法执行的函数代码。
语法
window.clearInterval(intervalVariable)
window.clearInterval() 方法可以不使用window前缀,直接使用函数clearInterval()。
要使用 clearInterval() 方法, 在创建计时方法时你必须使用全局变量:
myVar=setInterval("javascript function",milliseconds);
然后你可以使用clearInterval()
方法来停止执行。
var myVar=setInterval(function(){myTimer()},1000);
function myTimer(){
var d=new Date();
var t=d.toLocaleTimeString();
document.getElementById("demo").innerHTML=t;
}
function myStopFunction(){
clearInterval(myVar);
}
3.setTimeout() 方法
语法
window.setTimeout("javascript 函数",毫秒数);
setTimeout()
方法会返回某个值。在上面的语句中,值被储存在名为 t 的变量中。假如你希望取消这个setTimeout()
,你可以使用这个变量名来指定它。setTimeout()
的第一个参数是含有 JavaScript 语句的字符串。这个语句可能诸如 “alert('5 seconds!')
“,或者对函数的调用,诸如alertMsg()
“。- 第二个参数指示从当前起多少毫秒后执行第一个参数。
提示:1000 毫秒等于一秒。
function myFunction(){
setTimeout(function(){alert("Hello")},3000);
}
4.如何停止执行?
clearTimeout()
方法用于停止执行setTimeout()
方法的函数代码。
语法
window.clearTimeout(timeoutVariable)
window.clearTimeout()
方法可以不使用 window 前缀。
要使用clearTimeout()
方法, 你必须在创建超时方法中(setTimeout)使用全局变量:
myVar=setTimeout("javascript function",milliseconds);
如果函数还未被执行,你可以使用 clearTimeout() 方法来停止执行函数代码。
var myVar;
function myFunction()
{
myVar=setTimeout(function(){alert("Hello")},3000);
}
function myStopFunction()
{
clearTimeout(myVar);
}
设计时钟与倒计时
<html>
<head>
<title> New Document </title>
<meta charset="YTF-8">
</head>
<body>
<div id="dd">hello</div>
<script type="text/javascript">
showTime();
/*function checkTime(i){
if(i<10){
i='0'+i;
}
return i;
}
function showTime(){
var myDate=new Date();
var year=myDate.getFullYear();
var month=myDate.getMonth()+1;
var date=myDate.getDate();
var day=myDate.getDay();
var h=myDate.getHours();
var m=myDate.getMinutes();
var s=myDate.getSeconds();
m = checkTime(m);
s = checkTime(s);
var weekday= new Array(7);
weekday[0]='星期天';
weekday[1]='星期一';
weekday[2]='星期二';
weekday[3]='星期三';
weekday[4]='星期四';
weekday[5]='星期五';
weekday[6]='星期六';
document.getElementById('dd').innerHTML=year+'年'+month+'月'+date+'日'+weekday[day]+h+':'+m+':'+s;
setTimeout(showTime,500);
}*/
//var curtime = new Date();
//var endTime = new Date('2018,11,11');
//var lefttime = Math.ceil((endTime.getTime()-curtime.getTime())/(24*60*60*1000));//向上取整
//console.log(lefttime+'天');
//秒杀倒计时
function showTime(){
var nowtime = new Date();
var endtime = new Date('2017/11/17,17:29:59');
var lefttime = parseInt((endtime.getTime()-nowtime.getTime())/1000);//向下取整
var d = parseInt(lefttime/(24*60*60));
var h = parseInt(lefttime/(60*60)%24);
var m = parseInt(lefttime/60%60);
var s = parseInt(lefttime%60);
document.getElementById('dd').innerHTML = d+'天'+h+'小时'+m+'分钟'+s+'秒';
setTimeout(showTime,500);
}
</script>
</body>
</html>