JavaScript基础笔记（十三）测试和调试
错误处理与测试
一、错误处理
一）try-catch语句
function atest() {
try {
//可能发生错误的代码
return 0;
} catch (error) {
//错误处理程序
console.log(error.message);
return 1;
} finally {
//无论如何都会执行的,函数最后返回2
return 2;
}
}
错误类型：
1）Error:错误基类，其他错误类型都由该类继承。
2）EvalError:没有把eval()当函数调用时，会发送该错误。
3）RangeError:数值超出范围
4）ReferenceError:找不到对象时
5）SyntaxError:传入eval()函数的语法错误时
6）TypeError：变量的类型不符合要求
合理使用try-catch:
使用 try-catch 最适合处理那些我们无法控制的错误。假设你在使用一个大型 JavaScript 库中的
函数，该函数可能会有意无意地抛出一些错误。由于我们不能修改这个库的源代码，所以大可将对该函
数的调用放在 try-catch 语句当中，万一有什么错误发生，也好恰当地处理它们。
在明明白白地知道自己的代码会发生错误时，再使用 try-catch 语句就不太合适了。例如，如果
传递给函数的参数是字符串而非数值，就会造成函数出错，那么就应该先检查参数的类型，然后再决定
如何去做。在这种情况下，不应用使用 try-catch 语句。
二）抛出错误
使用throw操作符可以抛出错误，对抛出的值没有要求
//有效
throw 111;
throw ''ss;
在遇到 throw 操作符时，代码会立即停止执行。仅当有 try-catch 语句捕获到被抛出的值时，代
码才会继续执行。
通过使用某种内置错误类型，可以更真实地模拟浏览器错误。每种错误类型的构造函数接收一个参
数，即实际的错误消息。
throw new Error("An error");
何时抛出与捕获：
只应该捕获那些你确切地知道该如何处理的错误。捕获错误的
目的在于避免浏览器以默认方式处理它们；而抛出错误的目的在于提供错误发生具体原因的消息。
三）错误事件
任何没有通过 try-catch 处理的错误都会触发 window 对象的 error 事件 ，在任何 Web 浏览器中， onerror 事件处理程序都不会创建 event 对象，
但它可以接收三个参数：错误消息、错误所在的 URL 和行号 。要指定 onerror 事件处理程序，必须使用如下所示的 DOM0 级技术，它没有遵循“DOM2 级
事件”的标准格式。
window.onerror = function(msg, url, line) {
log(msg);
//阻止浏览器报告错误的行为
return fales;
}
二、测试
一）日志记录
//一个适用于所有浏览器的log
function log() {
try {
console.log.apply(console, arguments);
}
catch(e) {
try {
opera.postError.apply(opera, arguments);
}
catch (e) {
alert(Array.prototype.join.call(arguments, " "));
}
}
}
二）测试用例
一个好的测试用例的三个特征：
1）可重用性：多次运行应该产生相同的结果
2）简单性：只专注与测试，消除多余代码的影响
3）独立性：避免一个测试结果依赖于另一个结果
三）测试套件
测试套件的主要目的是聚合代码种的所有单个测试，将其组合成一个单位，这样他们可以批量运行，提供一个可以轻松反复运行的单一资源。
1）断言：
自己实现一个断言：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<style>
#results li.pass {
color: green;
}
#results li.fail {
color: red;
}
</style>
<body>
<ul id="results"></ul>
</body>
</html>
<script>
function assert(value, desc) {
var liElement = document.createElement("li");
liElement.className = value ? "pass" : "fail";
liElement.appendChild(document.createTextNode(desc));
document.getElementById("results").appendChild(liElement);
}
window.onload = function () {
assert(true, "Success");
assert(false, "Fail");
}
</script>
2）测试分组的实现：
(function () {
var results;
this.assert = function assert(value, desc) {
var li = document.createElement("li");
li.className = value ? "pass" : "fail";
li.appendChild(document.createTextNode(desc));
results.appendChild(li);
if (!value) {
li.parentNode.parentNode.className = "fail";
}
return li;
}
this.test = function test(name, fn) {
results = document.getElementById("results");
results = assert(true, name).
appendChild(document.createElement("ul"));
fn();
}
})();
window.onload = function (ev) {
test("all true", function () {
assert(true, "111");
assert(true, "222");
assert(true, "333");
});
test("one false", function () {
assert(false, "failed");
assert(true, "success");
assert(true, "xxx");
});
}
3）异步测试
(function () {
var queue = [], paused = false, results;
this.assert = function assert(value, desc) {
var li = document.createElement("li");
li.className = value ? "pass" : "fail";
li.appendChild(document.createTextNode(desc));
results.appendChild(li);
if (!value) {
li.parentNode.parentNode.className = "fail";
}
return li;
};
this.test = function test(name, fn) {
queue.push(function () {
results = document.getElementById("results");
results = assert(true, name).
appendChild(document.createElement("ul"));
fn();
});
runTest();
};
function runTest() {
if (!paused && queue.length) {
queue.shift()();
if (!paused) {
resume();
}
}
}
this.pause = function () {
paused = true;
};
this.resume = function resume() {
paused = false;
setTimeout(runTest, 1);
}
})();
window.onload = function (ev) {
test("First async test", function () {
pause();
setTimeout(function () {
assert(true, "First async completed!");
resume();
}, 1000);
});
test("Second async test", function () {
pause();
setTimeout(function () {
assert(true, "Second async test completed!");
resume();
}, 1000);
});
}
JavaScript基础笔记（十三）测试和调试的更多相关文章
- JavaScript基础笔记集合（转）
JavaScript基础笔记集合 JavaScript基础笔记集合 js简介 js是脚本语言.浏览器是逐行的读取代码,而传统编程会在执行前进行编译 js存放的位置 html脚本必须放在&l ...
- JavaScript基础笔记二
一.函数返回值1.什么是函数返回值 函数的执行结果2. 可以没有return // 没有return或者return后面为空则会返回undefined3.一个函数应该只返回一种类型的值 二.可变 ...
- JavaScript基础笔记一
一.真假判断 真的:true.非零数字.非空字符串.非空对象 假的:false.数字零.空字符串.空对象.undefined 例: if(0){ alert(1) }else{ alert(2) } ...
- JavaScript基础笔记（一）基本概念
基本概念 一.语法 一)区分大小写 二)标识符 书写规则同Java 三)注释 略 四)严格模式 1.在整个脚本中启用严格模式:在顶部添加 "use strict" 2.指定函数在严 ...
- Javascript基础知识小测试（一）
这里罗列了<你不知道的js>上卷的一些知识点以及小问题,如果你想巩固一下js那么就和我一起来看看吧. 如果你能不看书就回答上80%的问题说明你js的这一部分学得还不错,再接再厉. 作用域和 ...
- JavaScript基础笔记（十四）最佳实践
最佳实践 一)松散耦合 1.解耦HTML/JavaScript: 1)避免html种使用js 2)避免js种创建html 2.解耦CSS/JS 操作类 3.解耦应用逻辑和事件处理 以下是要牢记的应用和 ...
- JavaScript基础笔记（十）表单脚本
表单脚本 一.表单基础知识 JavaScript中表单对应的是HTMLFormElement类型,该类型继承自HTMLElement类型. 通过document.forms可以获得所有表单元素,通过数 ...
- JavaScript基础笔记（八）DOM扩展
DOM扩展 一.选择符API Selectors API是由W3C发起制定的一个标准,致力于让浏览器原生支持CSS查询. 一)querySelector() 在Document和Element类型实例 ...
- JavaScript基础笔记1220
JavaScript笔记1.JavaScript关键词2.JavaScript标识符 必须以字母,下划线(_)或美元符($)开始. 后续的字符可以是字母.数字.下划线或者美元符 (数字是不允许作为首字 ...
随机推荐
- 基于Manhattan最小生成树的莫队算法
点u,v的Manhattan距离:distance(u,v)= |x2-x1|+|y2-y1| Manhattan最小生成树:边权值为两个点Manhattan距离的最小生成树. 普通算法:prim复杂 ...
- 理解并设计rest/restful风格接口
网络应用程序,分为前端和后端两个部分.当前的发展趋势,就是前端设备层出不穷(手机.平板.桌面电脑.其他专用设备......). 因此,必须有一种统一的机制,方便不同的前端设备与后端进行通信.这导致AP ...
- 滴水穿石-07Java开发中常见的错误
1:使用工具Eclipse 1.1 "语法错误" 仅当源级别为 1.5 时已参数化的类型才可用 设置eclipse,窗口—>java—>编译器—>JDK一致性调到 ...
- 爬虫（猫眼电影+校花网+github+今日头条+拉钩）
Requests+正则表达式爬取猫眼TOP100榜电影信息 MARK:将信息写入文件解决乱码方法,开启进程池秒爬. 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 ...
- javascript 面向对象-面试题实例
/ 从设计到模式 // 设计模式简介 // 设计 // 模式 // 分开 // 从设计到模式 // 23种设计模式 // 创建型 // 工厂模式(工厂方法模式,抽象工厂模式,建造者模式) // 单例模 ...
- 三.hadoop mapreduce之WordCount例子
目录: 目录见文章1 这个案列完成对单词的计数,重写map,与reduce方法,完成对mapreduce的理解. Mapreduce初析 Mapreduce是一个计算框架,既然是做计算的框架,那么表现 ...
- RabbitMq相关运维
# 命令查询所有用户列表rabbitmqctl list_users # 使用命令对 xiandian-admin 用户进行授权set_permissions xiandian-admin '.*' ...
- 旋转矩阵 The Rotation Matrix
参考: http://www.scratchapixel.com/lessons/mathematics-physics-for-computer-graphics/geometry/how-does ...
- Pytorch学习笔记
非线性回归问题的参数求解,反向求导基本流程.Variable 计算时, 它在后台一步步默默地搭建着一个庞大的系统, 叫做计算图, computational graph. 这个图将所有的计算步骤 (节 ...
- 一起学Hadoop——使用自定义Partition实现hadoop部分排序
排序在很多业务场景都要用到,今天本文介绍如何借助于自定义Partition类实现hadoop部分排序.本文还是使用java和python实现排序代码. 1.部分排序. 部分排序就是在每个文件中都是有序 ...