摘要：
FuncUnit相关的知识我在之前的博文已有简单介绍，大家可以自行阅读《javascriptMVC入门 -- 12.FuncUnit》。他提供了很多api方法，我的文章中没有涉及，大家可以去官网查看，地址：http://www.javascriptmvc.com/。 今天我们将通过一个简单的例子，介绍如何把FuncUnit引入项目中，对无法执行单元测试的js文件进行自动化的功能测试。我例子是对jquery焦点图插件进行测试，先来看一下项目结构： 蓝框选中的就是测试文件。根目录下面的documentjs、funcunit、jquery、steal四个文件夹对应于javascriptMVC... 阅读全文
摘要：
本篇我们将通过对Date.strftime编写单元测试的例子，学会断言、测试用例函数的相关知识。 首先我们先来看Date.strftime的实现代码。Date.prototype.strftime = (function () { function strftime(format) { var date = this; return (format + "").replace(/%([a-zA-Z])/g, function (m, f) { var formatter = Date.formats && Date.formats[f]; ... 阅读全文
摘要：
从今天开始，我将以读书笔记的方式向大家介绍《Test-Driven JavaScript Development》相关内容。我不太清楚这本书是否已经有了中文的译本，有兴趣的朋友可以去搜索下，或者直接读英文原版。因为是读书笔记，算是供大家参考学习的资料，所以文章中很多知识或者概念的定义或者讲解可能不会那么精确。只要大家能明白我表达的内容即可，没必要太较真。 之前我写了《QUnit系列》有兴趣的朋友可以去阅读，他是当前比较流行的javascript测试的框架。通过学习QUnit相关知识，觉得很有必要丰富下自己的理论知识。只有有了强大的理论基础，你在工作上才会更有指导性和针对性。 本文将介绍... 阅读全文
摘要：
分析别人的源代码，除了可以了解程序功能是如何实现之外，还可以学到一些比较先进的编程方式和思想，进而提高自己的水平。本着这一想法，我将对QUnit的源代码加以解读，也希望对大家js水平的提高有个帮助作用。 好的js框架在语言上总是很干练的，里面也使用了很多比较先进的编程技巧，这就要求读者必须要有比较扎实的js基础知识。在这里我重点推荐汤姆大叔的译作《深入理解JavaScript系列》。文章很多共有50多篇，前20多篇对js基础知识作了很深入的讲解（市面上没看到比他更深入的书籍和博文，也可能是我看的资料少的缘故），后20多篇讲的是js的设计模式，我重点推荐前20多篇。相信通过对该系列重复的阅... 阅读全文
摘要：
测试用户操作 问题 那些依赖于用户操作的代码，不能通过执行函数来测试。通常元素的事件使用异步函数，例如click，这些需要模拟。 解决方案 你可以使用jQuery的trigger()方法来触发事件，然后测试预期的行为。如果你不想浏览器事件被触发，你可以使用triggerHandler()来执行事件相关方法。这对于测试链接的click事件是有帮助的，因为trigger()可能会使浏览器改变地址栏信息，这恐怕不是测试过程中想要发生的。假设我们有一个简单的KeyLogger需要测试：function KeyLogger( target ) { if ( !(this instanceo... 阅读全文
摘要：
自动化测试软件对于开发来说是一个很重要的工具，而单元测试对于自动化测试来说是基本组成部分：软件的每一个组件或者单元可以在非人工介入的情况下，使用测试工具一遍遍的重复执行。换句话说，就是你可以写一次测试，然后不用付出额外成本的任意执行多次。 除了测试覆盖率带来的好处外，测试还可以指导软件设计，这就是TDD（基于测试驱动的设计）：先有测试，后有开发代码。你开始写一个简单的测试，然后写实现代码并保证代码能通过测试。完成上述步骤后，扩展你的测试，让他覆盖更多设计功能，然后再编写实现代码。重复上面的步骤直到完成开发，你会发现你的实现代码和之前的版本已经非常不一样了。 JavaScript的单元测... 阅读全文
摘要：
JavaScript测试框架：QUnit 下面我们将介绍使用QUnit来完成前一章中的单元测试。<!DOCTYPE html><html><head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>Refactored date examples</title> <link rel="stylesheet" href="../qunit.cs 阅读全文
摘要：
最近我在重新设计自己的博客站点，决定用一个日历样式的icon显示时间。以前的解决方案一般是用背景图片，感谢css3，现在我们用css3就能实现这样的功能。我将会用到一些linear-gradients, border radius 和 box shadow这些属性来代替以前的photoshop设计。 photoshop 概念图 很多设计者采用直接在浏览器上设计的方式，但是我还是更喜欢先做photoshop的概念图的方式。虽然现在很多效果可以直接用css实现，但是用photoshop设计效果的方式比不断尝试修改css来最终达到你想要的效果的方式简单很多。 首先创建一个圆角矩形，设置圆角... 阅读全文
摘要：
以前，在web上要显示灰度图片的话，只有手工使用图片软件转换。但是现在借助于html5的canvas可以实现这个过程，而不需要再借助图片编辑软件了。我用html5和jquery做了一个demo，来展示如何实现这个功能。demo地址：http://webdesignerwall.com/demo/html5-grayscale/目的这个demo将会向你展示用html5和jquery，如何实现鼠标在图片上移动移出时，灰度图像和原图之间的切换。在html5出现之前，要实现这个功能就需要准备两个图片，一个灰度图片，一个原图。但是现在借助于html5可以实现的更快更容易，因为灰度图片是直接在原图上生.. 阅读全文
摘要：
大家都知道单元测试对于保证代码质量的重要性，但是对客户端代码进行单元测试则要困难的多。一个比较棘手的问题是，因为JavaScript代码和后台代码或者html结合的比较紧密，他缺少真正单元的概念。例如对dom的操作，无论我们是借助jquery这样的类库，把js代码单独放在一个文件，还是直接使用内嵌代码的实现方式，都没有可以测试的单元。 那么什么是单元呢。一般而言，单元就是一个功能函数，相同的输入，输出结果是一定的。这种情况的函数，做单元测试是相当简单的，但有时候你需要处理一些特殊情况，例如对dom的操作。对于我们来说他仍然是有用的，我们可以指出哪些代码可以构造到单元里面，然后对他做相应的... 阅读全文
摘要：
今天看qunit源代码，发现一段很奇怪的代码，虽然能领会他的意思，但是不明白双感叹号起到的作用。function id( name ) { return !!( typeof document !== "undefined" && document && document.getElementById ) && document.getElementById( name );} 然后去网上查了些资料，他相当于三元运算符，返回boolean值。var ret = !!document.getElementById等价于：var 阅读全文
摘要：
原文地址：http://blog.csdn.net/hfahe/article/details/7730944 前言：像CORS对于现代前端这么重要的技术在国内基本上居然很少有人使用和提及，在百度或者Google上搜索CORS，搜到的中文文章基本都是另外一种卫星定位技术CORS的介绍，让我等前端同学情何以堪（对比起来，用Google搜到的国外文章，基本都是跨域资源共享的介绍，说明了前端技术在国内外环境和发展的巨大差距）。 我之前《用HTML5实现人脸识别》这篇文章中提到了“Face.com实现了CORS（跨域资源共享）。CORS系统基本上可以让服务器暴露给其它域上文件的Ajax调用... 阅读全文
摘要：
原文地址：http://blog.csdn.net/hfahe/article/details/7727460 前言：HTML5出现后，网络安全更加受到广泛的关注。Web对于网络安全有哪些改进？我们如何来面对越来越危险的网络欺诈和攻击？下面的文章谈到了W3C对于这个问题的最新解决方案。未来有机会的话，我会针对XSS、P3P、同源策略、CORS（跨域资源共享）和CSP进行关于HTML5内容安全的现场分享。 ------------------------华丽的分界线 注意：本文所讨论的API还未最终确定，请在自己的项目中谨慎使用。 万维网的安全策略植根于同源策略。例如http:/... 阅读全文
摘要：
原文地址：http://blog.csdn.net/hfahe/article/details/8049414一、WebSQL安全风险简介 数据库安全一直是后端人员广泛关注和需要预防的问题。但是自从HTML5引入本地数据库和WebSQL之后，前端开发对于数据库的安全也必须要有所了解和警惕。WebSQL的安全问题通常表现为两个部分： 第一种是SQL注入：和本地数据库一样，攻击者可以通过SQL注入点来进行数据库攻击。 另外一方面，如果Web App有XSS漏洞，那么本地数据很容易泄漏，可以想想本地数据库里存储了用户最近交易记录或者私信的情况。二、WebSQL安全风险详析 1、SQ... 阅读全文
摘要：
原文地址：http://blog.csdn.net/hfahe/article/details/7961618一、WebStorage简介 HTML5支持WebStorage，开发者可以为应用创建本地存储，存储一些有用的信息。例如LocalStorage可以长期存储，而且存放空间很大，一般是5M，极大的解决了之前只能用Cookie来存储数据的容量小、存取不便、容易被清除的问题。这个功能为客户端提供了极大的灵活性。二、攻击方式 LocalStorage的API都是通过Javascript提供的，这样攻击者可以通过XSS攻击窃取信息，例如用户token或者资料。攻击者可以用下面的脚本遍历... 阅读全文
摘要：
原文地址：http://blog.csdn.net/hfahe/article/details/7961566一、从SOP到CORS SOP就是Same Origin Policy同源策略，指一个域的文档或脚本，不能获取或修改另一个域的文档的属性。也就是Ajax不能跨域访问，我们之前的Web资源访问的根本策略都是建立在SOP上的。它导致很多web开发者很痛苦，后来搞出很多跨域方案，比如JSONP和flash socket。如下图所示： 后来出现了CORS-CrossOrigin Resources Sharing，也即跨源资源共享，它定义了一种浏览器和服务器交互的方式来确定是否允许跨... 阅读全文
摘要：
原文地址：http://blog.csdn.net/hfahe/article/details/7960705 在今天的2012中国软件开发者大会上，我做了名为《关注HTML5安全》的主题演讲。我个人认为，随着HTML5的普及和发展，HTML5的安全会成为近期带来的严重问题。之所以大家还没有感受到的原因是什么？1、目前HTML5应用还不普及 2、暂时还没有吸引攻击者的关注。 演讲摘要如下（来自CSDN专题）： ----------- 我首先介绍了从HTML到HTML5的发展，在在91年当时诞生了HTML，当时只是一个简单的纯文本，并不存在安全方面的风险。而到了96年我们有... 阅读全文
摘要：
原文地址：http://www.csdn.net/article/2012-08-07/2808306摘要：时时关注同一领域中技术牛人的动态和思想，有助于开发者未来的职业发展。本文列出了你在Twitter上必须关注的知名JS程序员列表。他们包括行业的先行者和推动者，同时也包括你可能不认识或者还没考虑关注的开发者。对他们进行关注，你将从中获益匪浅。本文列出了你在Twitter上必须关注的JS程序员列表。他们包括行业的先行者和推动者，同时也包括你可能不认识或者还没考虑关注的开发者。这25位开发者不可能包含所有有影响力和鼓舞人心的开发者。如果你认为还有需要添加到该列表的开发者，请在下面的评论中告诉我 阅读全文
摘要：
原文地址：http://www.csdn.net/article/2012-10-11/2810660-NoSQL-MongoDB-HBase摘要：随着大数据的不断发展，非关系型的数据库现在成了一个极其热门的新领域，非关系数据库产品的发展非常迅速。现今的计算机体系结构在数据存储方面要有庞大的水平扩展性，而NoSQL也正是致力于改变这一现状。目前Google的 BigTable和Amazon 的Dynamo使用的就是NoSQL型数据库，本文介绍了10种出色的NoSQL数据库。虽然NoSQL流行语火起来才短短一年的时间，但是不可否认，现在已经开始了第二代运动。尽管早期的堆栈代码只能算是一种实验，然 阅读全文
摘要：
原文地址：http://www.csdn.net/article/2012-07-26/2807740-JavaScript摘要：JavaScript是一种灵活的语言，这有时使它名声较差，但是往好的一面看，它也向您提供了快速、创造性地编写代码的能力。它提供的属性和方法仅仅是可以实现功能的开始是您的想象力创建了自定义功能。因此，您的想象力没有界限，您编写的代码也没有界限。所有编程语言都具有内部（或内置的）对象来创建语言的基本功能。内部对象是 您编写自定义代码所用语言的基础，该代码基于您的想象实现自定义功能。JavaScript有许多将其定义为语言的内部对象。本文介绍了一些最常用的对象，并简要介绍 阅读全文