2015年10月_aitangyong

原创 HTML5规范之Web Worker入门

在web worker规范产生之前，dom渲染和javascript代码执行是在同一个浏览器线程中执行的。也就是说：渲染dom的时候不能执行javascript代码，执行javascript代码的时候，UI界面会暂停响应。如果javascript代码执行时间很长，那么UI就会无响应，这就是所谓的页面卡死。Web Workers是 HTML5 提供的一个javascript多线程解决方案，我们可以将一些耗时的javascript代码交由web Worker运行而不冻结用户界面。也就是说web worker和U

2015-10-27 12:44:17 8986

原创 requireJS&seaJS模块加载器原理：<script>标签加载外部js文件用到的onload、onerror和onreadystatechange事件

之前学习了requireJS框架，最近在学习seaJS框架，两者都是js模块文件的加载器，做的事情大致是相同的。这篇文章学习下标签的一些特性，了解框架是如何加载js文件的。requireJS和seaJS其实都是通过动态创建标签，设置好标签的相关属性，然后再将标签插入到节点下。onload：当js文件下载完成，并且执行结束(脚本初始化)后，会触发。onerror：当加载js文件报错的时候会被调用，比如文件路径错误、网络不可用等情况。onreadystatechange：则是IE特有的，不同的版本支持情况还不

2015-10-26 18:09:43 4523

原创学习ECMAScript5规范中Object新增的API

Object在javascript编程中的重要性不言而喻，本文主要介绍下ECMAScript5规范Object新增的几个API。ECMAScript 5.1 (或ES5) 是ECMAScript(基于JavaScript的规范)标准最新修正。与HTML5规范进程本质类似，ES5通过对现有JavaScript方法添加语句和原生ECMAScript对象做合并实现标准化。这些新增的API还是很有意思的，给javascript增加了很多很有用的功能，比如不可变对象等。chrome浏览器对ECMAScript5规范的

2015-10-25 11:54:57 1601

原创 (三)seajs中的模块标识

本文转载自[模块标识#258]，介绍下模块id相关的东东。模块标识是一个字符串，用来标识模块。在 require、 require.async 等加载函数中，第一个参数都是模块标识。Sea.js 中的模块标识是 CommonJS模块标识的超集。也就是说符合CommonJS规范的id，一定符合seajs，反之则不然。

2015-10-23 10:01:13 785

原创 (二)学习seajs模块定义和模块引用相关API

知道如何引入seajs，如何启动模块之后，现在我们改来看一下如何定义模块，如何让一个模块调用另一个模块。经常使用的 API 只有 define, require, require.async, exports, module.exports 这五个。本文主要摘抄自[CMD模块定义规范#242]和[require书写约定#259]。在CMD规范中，一个模块就是一个文件。可以看到这些规则并不复杂，也很合理，并没有加重程序员的负担。虽然id、dependencies都是必须的，但是我们源码中并不需要自己去添加这2

2015-10-22 18:51:33 4077

原创 (一)页面中引入seajs以及模块的加载和启动

本文转载自官网上"模块的加载启动#260"这篇文章，seajs官网上的文档都是中文的，大部分写的也很清楚，看看就能上手了。这里之所以转载官网文档，一个是因为自己在学习阶段，自己手动敲一遍印象会更深，一个是因为GitHub访问比较慢，所以放在自己的博客，以后看着方便点。

2015-10-22 17:18:46 3126

原创 (四)seajs.config中vars、alias、paths和map的作用,以及util-path路径解析源码

这篇文章主要是学习下seajs.config中vars、alias、paths、map这4个配置参数的作用和使用方式。seajs解析模块的url，就是根据模块标识(到底是相对标识、顶级标识还是普通标识)，和上面这4个配置来确定的。相关源码在util-path.js中，下面附上util-path.js中最核心部分的源码，我加了很多注释，应该很容易看懂。

2015-10-22 14:27:57 4655

原创 (三.1)通过几个例子看下seajs模块标识符(有图有真相)

模块的标识，其实就是模块的命名，这涉及到文件查找路径，如果路径配置不对，会导致seajs下载文件失败。seajs官方文档对模块标识的解释也必将多，但是我认为介绍的太简单，不太好理解。至少我是费了一点工夫才理解的，这里记录下。seajs模块标识分为3种：相对标识、顶级标识和普通标识。我们知道require()就需要一个模块标识，模块标识就是一个字符串。

2015-10-21 11:25:11 1093

原创 seajs开篇：我为什么学习seajs，因为它的"预先下载,延迟执行"特性

之前参与的2个项目都用到了js模块化工具requireJS框架，工作之余学习了这个框架，也熟悉了requireJS的基本用法以及AMD规范。本来对seaJS没有太大的兴趣，知道它实现了CMD规范，功能和requireJS类似仅此而已。最近在自己关注的微信订阅号"前端大全"看到了一篇文章"js模块化历程"，对seajs产生了极大的兴趣，因为它有"预先下载，延迟执行"的特性。

2015-10-20 19:22:55 1533

原创我所见过的讲"javascript中apply、call、bind"最清晰最易懂的文章

首先声明这篇文章大部分内容都是转载的，转载自ChokCoco"深入浅出妙用Javascript中apply、call、bind"这篇文章。如此好文章仅仅作为一个链接放在CSDN着实可惜，所以还是自己手动敲一遍，羞涩地冠以原创之名，作为自己的知识库。阮一峰的这段话说的真好啊，绝对说出了写博客人的心声。"对我来说，博客首先是一种知识管理工具，其次才是传播工具。我的技术文章，主要用来整理我还不懂的知识。我只写那些我还没有完全掌握的东西，那些我精通的东西，往往没有动力写。炫耀从来不是我的动机，好奇才是。"

2015-10-20 16:18:57 3217

原创 prototypejs库Function#wrap()的使用和源码解析

之前的2篇文章在讨论prototypejs库的继承实现方式、$super和_super过程中，我看到了Function#wrap()这个很有意思的API。这篇文章学习下如何使用Function#wrap()，以及它的源码。我们先看下官方对这个API的说明：也就是说wrap()可以用来实现类似AOP编程的效果。可以看到将wrap挂在Function.prototype上是最简单、最合理的，虽然修改原型有一定的风险。

2015-10-20 14:56:58 1113

原创学习prototypejs中的继承实现机制(二)：让$super更像java中的super关键字

我们先研究下prototypejs是如何做到$super，后面再看我们能不能改造它，让$super更像java中的super关键字。在OOP语言(如java)中，如果子类Child继承父类Base，那么编写某个子类方法的需求，无外乎下面几个：1.子类方法需要调用父类中的个同名方法(通过super关键字来调用)。2.子类方法需要调用父类中的不同名方法(通过super关键字来调用)。3.子类方法需要调用子类自身的其他方法(通过this关键字来调用)。4.子类方法需要调用多个父类和子类自身的方法。还有

2015-10-19 18:16:17 1471

原创学习prototypejs中的继承实现机制(一): Object.extend()、Class.create()、Class#addMethods()的使用

$super是不是和java中的继承有点像，我们居然可以使用$super来调用父类中的方法。不过有些差别：java中可以使用super调用父类中的任何公开的方法，但是在prototypejs里面$super只是一个方法，不是父对象。我们先研究下，prototypejs是如何做到$super，后面再看我们能不能改造它，让$super更像java中的super关键字。

2015-10-17 11:12:29 1798

原创 javascript中关键字in以及循环for...in的使用和注意事项

写这篇文章，是因为在学习prototypejs库中方法Object.extend()和Class.create()，看这篇指导[tutorial on classes and inheritance]的时候，对于什么能够继承，什么不能继承产生了一些困惑。在看源码class.js和object.js的时候，发现extend方法使用到了javascript的for...in，发现自己对于这个东西并不是太熟悉，这里记录下。

2015-10-13 19:25:37 2860

原创 (一)nodejs开发环境搭建: 安装nodejs以及配置npm

最近项目要使用cordova插件打包，去改造原有的android混合app工程，为下一步在ios平台开发做准备，主要就是为了复用HTML5/JS/CSS相关的web东西。用到了nodejs，这里记录下如何安装和配置nodejs，为以后学习nodejs做准备。

2015-10-13 12:46:51 3962

原创 (二十) 理解和解决angularJS报错$apply already in progress

如果我们使用了angularJS中的$scope.$apply()或者$scope.$digest()，我们很可能会遇到类似下面的错误，虽然这个错误没有太大影响，但是在日志中看起来还是很不爽的，日志中记录的异常或者错误，就应该是需要关注和解决的问题，否则就没有必要出现在日志中了。这个错误其实很好理解：angularJS框架本身已经在做脏数据检测了，我们没有必要再手动调用$apply或者$digest。这里自然而然出现了一个疑问：什么时候需要我们手动调用$apply或者$digest，什么时候不需要呢？

2015-10-08 16:22:05 45199 6

aty