从模块化谈起

近年来，js开发涌现出了诸多模块化解决方案，例如以在浏览器环境之外（服务端）构建 JavaScript 生态系统为目标而产生的CommonJS规范，从CommonJS社区中独立出来的AMD规范（异步模块定义），还有国人制定的CMD规范等。随着遵循AMD规范的RequireJS的流行，AMD规范在前端界已被广泛认同。后来，随着npm社区的逐渐壮大，CommonJS也越来越受欢迎，于是产生了统一这两种规范的需求，即希望提供一个前后端跨平台的解决方案，也因此产生了UMD（通用模块定义）规范。

CommonJS定义的是模块的同步加载，主要用于Node端；而遵循AMD规范的RequireJS则是异步加载，适用于浏览器端。requirejs是一种在线”编译” 模块的方案，相当于在页面上加载一个AMD 解释器，以便于览器能够识别define、exports、module，而这些东西就是用于模块化的关键。

CommonJS 同步式的require

Node端的模块加载遵循 CommonJS规范，该规范的核心思想是允许模块通过 require 方法来加载。

该规范首先加载所要依赖的其他模块，然后通过 exports 或 module.exports 来导出需要暴露的接口。但它的缺点也是显而易见的，即一个文件一个文件的加载很容易发生阻塞。

年末了，这是我第一次写年终总结，算是对过去的一个回忆和经验的记录吧，希望对看到这篇文章的人有所帮助，也对即将到来的2016做个计划。

今年2月份，知乎上的一封私信开启了我寻找春季实习的旅程，当时真是又激动又兴奋，因为那是我一直很想去的淘宝的前端大牛给我发来的私信，简直没有比这个更振奋人心的了。当时正是大三的寒假刚开始，虽然有计划找暑假实习，但没想到这么快，连简历都没准备。于是花了半天时间做好了一份看起来还算可以的简历，后来简历的样式倒是没怎么改，只是内容不断修修补补。（有挺多人表示喜欢我那份简历的样式，我也有计划将其做个项目开源出来，让制作简历也变得分分钟的事。）当然，投递简历最好还是pdf格式，比较不会出现格式问题。

这里要先感谢下淘宝的@石霸，蘑菇街的@青叶，当然，都是花名。

由于私有和特权成员在函数的内部，因此它们会被带到函数的每个实例中。

公有的原型成员是对象蓝图的一部分，适用于通过new关键字实例化的该对象的每个实例

静态成员只适用于对象的一个特殊实例

Function 对象（类）

ECMAScript 最令人感兴趣的可能莫过于函数实际上是功能完整的对象。

Function 类可以表示开发者定义的任何函数。是个函数构造器

构造函数.prototype = 原型对象
原型对象.constructor = 构造函数(模板)

原型对象.isPrototypeof(实例对象) 判断实例对象的原型 是不是当前对象

在《javaScript语言精粹》这本书中，把 this 出现的场景分为四类，简单的说就是：

1
2
3
4
5
6
7

有对象就指向调用对象

没调用对象就指向全局对象

用new构造就指向新对象

通过 apply 或 call 或 bind 来改变 this 的所指。

函数调用模式中，this为window；方法调用模式中，this为方法所属的对象；构造器调用模式中，this为创建的新对象。

js中的this

我们要记住：this永远指向函数运行时所在的对象！而不是函数被创建时所在的对象。

this对象是在运行时基于函数的执行环境绑定的，在全局环境中，this等于window

underscore.js源码

Underscore.js 没有对原生 JavaScript 对象进行扩展,而是通过调用 _() 方法进行封装，一旦封装完成，原生 JavaScript 对象便成为一个 Underscore 对象。

判断给定变量是否是对象

1
2
3
4
5

// Is a given variable an object?
    _.isObject = function(obj) {
        var type = typeof obj;
        return type === 'function' || type === 'object' && !!obj;
    };

这是underscore.js的判断给定变量是否是object的一段源码。 我们知道typeof会返回如下六个值：

1. 'undefined' --- 这个值未定义；
2. 'boolean'    --- 这个值是布尔值；
3. 'string'        --- 这个值是字符串；
4. 'number'     --- 这个值是数值；
5. 'object'       --- 这个值是对象或null；
6. 'function'    --- 这个值是函数。  

而&&的优先级要高与||。!!的作用相当于Boolean()，将其转换为布尔值。

js类的基本含义

我们知道，在js中，是没有类的概念的。类的所有实例对象都从同一个原型对象上继承属性，因此，原型对象是类的核心。

类是对象的抽象，而对象是类的具体实例。类是抽象的，不占用内存，而对象是具体的，占用存储空间。———百度百科

早期的javascript需求都很简单，基本都是写成函数的，然后是面向过程的写法，后来慢慢的引入面向对象开发思想，再后来就慢慢写成 类。

在js中，写成类的本质基本都是 构造函数+原型。下面，就讨论一下js类的几种写法：

js继承的概念

js里常用的如下两种继承方式：

• 原型链继承（对象间的继承）
• 类式继承（构造函数间的继承）

由于js不像java那样是真正面向对象的语言，js是基于对象的，它没有类的概念。所以，要想实现继承，可以用js的原型prototype机制或者用apply和call方法去实现

在面向对象的语言中，我们使用类来创建一个自定义对象。然而js中所有事物都是对象，那么用什么办法来创建自定义对象呢？这就需要用到js的原型：

我们可以简单的把prototype看做是一个模版，新创建的自定义对象都是这个模版（prototype）的一个拷贝 （实际上不是拷贝而是链接，只不过这种链接是不可见，新实例化的对象内部有一个看不见的__Proto__指针，指向原型对象）。

js可以通过构造函数和原型的方式模拟实现类的功能。 另外，js类式继承的实现也是依靠原型链来实现的。

http://microjs.com/#

该网站的资源都托管到了github，microjs.com是一个可以让你选择微型的js类库的网站，该网站里的js库都是压缩后不大于5KB的，非常实用

">

https://plainjs.com/（10.22更新）

The Vanilla JavaScript Repository，该仓库都是用原生js写的插件和组件，很实用。里面的项目也都托管到了github

综合/资源

• frontend-dev-bookmarks 一个巨大的前端开发资源清单。star:15000
  
  
• front-end-collect 分享自己长期关注的前端开发相关的优秀网站、博客、以及活跃开发者。star:860
  
  
• Front-end-Interview-questions 史上最全前端开发面试问题及答案

jade是对空格敏感的模板引擎。子元素缩进两个空格

可以直接在终端编译jade模板引擎为html文件：jade index.jade，编译后的代码是压缩过的，加参数-P就可以变为未经编译的。

使用wenstorm来实时编译jade为HTML：

打开preference——tools——File Watcher——+——jade，然后在Arguments``那里加入-P`参数即可不用压缩

也可以安装gulp-jade插件来转换成HTML：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18

var jade = require('gulp-jade');

gulp.task('templates', function() {

  var YOUR_LOCALS = {};

  gulp.src('./lib/*.jade')

    .pipe(jade({

      locals: YOUR_LOCALS

    }))

    .pipe(gulp.dest('./dist/'))

});

常用命令

1
2
3
4
5
6
7
8
9
10
11
12
13
14

#下载项目
$ git clone git://github.com/jquery/jquery.git

#添加项目到暂存区，点号表示添加所有
$ git add <filename>/.

#提交暂存区到仓库区
$ git commit -m [message]  #或者git commit -a

#推送项目到远程地址
$ git push

# 强行推送当前分支到远程仓库，即使有冲突
$ git push [remote] --force