月度归档:2017年12月

我有哪些提升编程工作效率的方法

1. 列出每日TODO

最简单也是最有效的方法,每天早上整理好今天待办事项,按照紧急和重要两个指标划分四象限,优先处理重要的事情,紧急但不重要的可次之。
这个做法的好处是做事会有计划有条理。

2. 做好工作笔记

使用云笔记记录每个 task 的相关信息,整理素材。云笔记的好处是不怕丢,手机也能方便查询,也方便日后回顾,特别是年终的时候 看着一个个 task 记录,就知道今年做了哪些事情。

3. 坚决地自动化

如果是重复简单的工作,就尽量使用程序脚本解决,可能第一次做自动化,写脚步的时间比直接做还慢,但是基础的脚本都差不多,需要用到自动化的一般就是那几类,有了积累之后,下次使用就方便很多了。珍惜自己的时间,重视自己的价值,工程师不应该把时间浪费在简单重复的事情上。

4. 熟练使用工具,节省时间和精力

人一天的精力有限,而且人能连续集中精力时间也不长,番茄工作法认为人平均能集中精力的时长为 25 分钟,并以此为周期,每个周期之间需要休息 5 分钟。所以在编码时,需要熟悉 IDE 的各种快捷功能,提高工作。

举个例子:使用 IDE 提供的 debug 功能,可以在断点处之前查看上下文变量,还可以修改上下文,也可以给短点设置变量,debug 效率非常高。

使用 console.log 来 debug 同样可以找出问题,但需要浪费时间在输入 console.log 和重试上面。即使只有几秒钟,毕竟一个周期也只有 25 分钟,而且我自己感觉一天能高效工作的时间也就 3 小时左右 LOL。

5. 先思考,再编码,多画图

不要把实现方案想个大概就动工,不然写到一半才发现某些地方没考虑完整,又得推翻部分设计,返工浪费的时间其更多。
处理简单的问题,可以脑子里过一遍流程,把可能影响的地方都一一列出来,再整理好 TODO ,编码的时候其实就只需要关注把 TODO 翻译成代码即可。
如果问题比较复杂,那就把画出流程图或者时序图,可以帮你有效地整理流程。画图还有另一个好处:当做问题,日后接收的人也轻松。这里推荐使用 plantUML 来画各种流程图,类似 markdown 只需要写好文本,渲染后就是标准的 UML 图了。

IDE 常用功能 for Node.js

我写的东西 编程相关 Node posts

什么是 IDE

集成开发环境(IDE,Integrated Development Environment )是用于提供程序开发环境的应用程序。使用 nodejs 开发后端应用的时候,我的常用 IDE 是 Webstorm,偶尔也用 vs code。
根据我的日常使用经验,本文列举下 Webstorm 这个 IDE 提供了哪些比较实用功能,这些功能基本上 vs code 也支持。

编辑

快捷键

导出快捷键列表,仔细过一遍,

自动补全

自动补全功能的实现一般有两种

  1. 正则匹配,自动匹配出现过的字符
  2. 语法树分析,因为 js 没有类型系统,IDE 都做不到这个,但是 typescript 是可以的,vs code 也会根据 js 库里的 d.ts 描述文件来做自动补全

Refactor 重构

常见重构支持:
重命名
Inline : 表达式替换变量
Extract :变量替换表达式

模板功能

把常见的代码块设置为模板,方便快速输入。
例如把 console.log('$message$); 这类常用语句定义为模板后定义关键字为 log ,只要输入 log 补全即可。

TODO 列表

列出项目里的所有 TODO,时刻提醒你还债~

eslint / tslint

集成 eslint / tslint 等 js 代码检查工具,错误代码直接标红

运行

build

支持 typescript flow 等语言的编译

runer

run 配置

debug

debug 支持,断点比 console.log 清晰,也不会留下一堆乱七八糟的 log 代码,而且断点的设置还支持条件过滤,非常方便

unit test

清晰的 test 结果

coverage

代码覆盖率直接显示到编辑器上,如下图,line 37-39 左侧是淡绿色,表示测试覆盖到了,下方的淡红色表明测试未覆盖

deploy

支持 ftp 上传,IDE 也是可以直接在服务器编程的
就是自动帮你执行 ftp 上传命令

terminal

当前目录开启 terminal

版本控制

支持主流的版本控制软件

git svn csv

commit

除了 GUI commit 视图

还有 before commit 和 after commit 钩子

review

review 视图帮助你清晰了解变更

revert

撤销更改

冲突解决

解决代码冲突,gui 视图,会清晰很多

shelve 暂存

临时切换任务使用,就不用提交一个 “暂存” commit 了

changelist/task

任务汇总,整理变更

history

  1. version control 的 history 查看历史变更
  2. Annotate,查锅神器,同 git blame ,可以看到每一行代码的最后编辑人
  3. local history 防丢失非常重要

集成外部软件

有名的外部软件基本都能找到集成,我常用的有

jira

直接获取 task ,根据 task 信息创建分支,自动填充 commit 信息

plantuml

有插件,将 uml 渲染成图片

总结

上文列举了后端开发中比较实用的功能,但每个人的工作习惯都不一样,如何知道有哪些功能是你很喜欢的但是你还没发现呢?

仔细过一遍 IDE 的菜单就好了

Node.js 异步编程

我写的东西 编程相关 Node posts

异步的最终解决方案

在 2017 年,Node 7.6 终于支持了 Async/Await ,async 函数就是 Generator 函数的语法糖,是 JS 异步编程的最终解决方案。

可以认为:

async 函数 == co + generator 函数

比起 co,async 有以下优点

  1. 更好的语义 async 和 await,比起星号和 yield,语义更清楚了。async 表示函数里有异步操作,await 表示紧跟在后面的表达式需要等待结果;
  2. 更广的适用性。 co 函数库约定,yield 命令后面只能是 Thunk 函数或 Promise 对象,而 async 函数的 await 命令后面,可以跟 Promise 对象和原始类型的值(数值、字符串和布尔值,但这时等同于同步操作)

在此之前,JS 的异步编程经历了 Callback、Promise、Generator、Async 的进化,接下来我们过一遍异步发展历程

回调函数 Callback

在 JS 中,异步编程通过 Callback 完成,将一个函数作为另一个异步函数的参数,用于处理异步结果,一个例子:

Something.save(function(err) {
if (err) {
//error handling
return; // 没有返回值
}
console.log('success');
});

过度使用回调函数所会遇到的挑战:

  • 如果不能合理的组织代码,非常容易造成回调地狱(callback hell),这会使得你的代码很难被别人所理解。
  • 很容易遗漏错误处理代码。
  • 无法使用return语句返回值,并且也不能使用throw关键字

也正是基于这些原因,在JavaScript世界中,一直都在寻找着能够让异步JavaScript开发变得更简单的可行的方案。

一个可行的解决方案之一是async模块。如果你和回调函数打过很久的交道, 你也许会深刻地感受到,在JavaScript中如果想要让某些事并行执行,或是串行执行,甚至是使用异步函数来映射(mapping) 数组中的元素使用异步函数有多复杂。所以,感谢 Caolan McMahon写了async模块来解决这些问题。

使用async模块,你可以轻松地以下面这种方式编写代码:

async.map([1, 2, 3], AsyncSquaringLibrary.square,
function(err, result){
// result will be [1, 4, 9]
});

async模块虽然一定程度上带来了便利,但仍然不够简单,代码也不容易阅读,因此Promise出现了。

Promise 函数

Promise 的写法:

Something.save()
.then(function() {
console.log('success');
})
.catch(function() {
//error handling
})

then 和 catch 注册的回调函数分别处理下一步处理和异常处理,这样写的优点是可以链式操作:

saveSomething()
.then(updateOtherthing)
.then(deleteStuff)
.then(logResults);

只是回调函数的另一种写法,把回调函数的横向加载,改成纵向加载,缺点是代码一堆的 then。

Generator 函数

Generator 函数是协程在 ES6 的实现,最大特点就是可以交出函数的执行权,注意它不是语法糖。

第一步,协程A开始执行。
第二步,协程A执行到一半,进入暂停,执行权转移到协程B。
第三步,(一段时间后)协程B交还执行权。
第四步,协程A恢复执行。
function* gen(x){
var y = yield x + 2;
return y;
}

上面代码就是一个 Generator 函数。它不同于普通函数,是可以暂停执行的,所以函数名之前要加星号,以示区别。

整个 Generator 函数就是一个封装的异步任务,或者说是异步任务的容器。异步操作需要暂停的地方,都用 yield 语句注明。Generator 函数的执行方法如下。

var g = gen(1);
g.next() // { value: 3, done: false }
g.next() // { value: undefined, done: true }

Generator 函数可以暂停执行和恢复执行,这是它能封装异步任务的根本原因。除此之外,它还有两个特性,使它可以作为异步编程的完整解决方案:函数体内外的数据交换错误处理机制

  1. 数据交换:g.next(data);

  2. 错误处理:g.throw('出错了');

Generator 最大的问题是要手动调用 next() 才会执行下一步,因此自动执行器 co 出现了

co 执行器

co 函数库的用法:

var co = require('co');
co(gen);

Generator 自动执行需要一种机制,当异步操作有了结果,能够自动交回执行权
两种方法可以做到这一点。

(1)回调函数。将异步操作包装成 Thunk 函数,在回调函数里面交回执行权。
(2)Promise 对象。将异步操作包装成 Promise对象,用 then 方法交回执行权。

co 函数的具体实现见文末参考文章,这里就不重复了

拓展阅读:其他语言的异步编程

C# 也有 async await 关键字,用于异步调用,内部实现基于线程
http://www.cnblogs.com/jesse2013/p/async-and-await.html

Java Spring 框架有 @Async 注解,用于异步调用,内部实现基于线程
https://spring.io/guides/gs/async-method/

参考文章

  1. 细说JavaScript异步函数发展历程
  2. async 函数的含义和用法
  3. Generator 函数的含义与用法
  4. co 函数库的含义和用法

Node.js 内存模型

我写的东西 编程相关 Node posts 编程相关

前言

本文尝试理清 js 内存模型的相关知识点,鉴于 js 的教程非常丰富,这里就不重复写了,只建立个知识索引就好了,详细知识看文末的参考文章即可

栈与堆

基础数据类型存在栈中,对象存储在堆中

  1. 基础数据类型

    • Undefined
    • Null
    • Boolean
    • Number
    • String
  2. 引用类型
    Object、Function、Array和自定义的对象,可以看做是指针。指针是存在栈中,但是指向的变量在堆中

下面代码表现了基础类型和引用类型的区别

// demo01.js
var a = 20;
var b = a;
b = 30;
// 这时 a 的值是多少? // 20
// demo02.js
var m = { a: 10, b: 20 }
var n = m;
n.a = 15;
// 这时 m.a 的值是多少? // 15

执行上下文

概念

每次当控制器转到ECMAScript可执行代码的时候,就会进入到一个执行上下文。可执行代码的类型包括:

  • 全局代码(Global code)
    这种类型的代码是在”程序”级处理的:例如加载外部的js文件或者本地标签内的代码。全局代码不包括任何function体内的代码。 这个是默认的代码运行环境,一旦代码被载入,引擎最先进入的就是这个环境。
  • 函数代码(Function code)
  • Eval代码(Eval code)

执行栈 demo

建立的细节

1、创建阶段【当函数被调用,但未执行任何其内部代码之前】

  • 创建作用域链(Scope Chain)

  • 创建变量,函数和参数。

  • 求”this“的值

2、执行阶段
初始化变量的值和函数的引用,解释/执行代码。

我们可以将每个执行上下文抽象为一个对象,这个对象具有三个属性

ECObj: {
scopeChain: { /* 变量对象(variableObject)+ 所有父级执行上下文的变量对象*/ },
variableObject: { /*函数 arguments/参数,内部变量和函数声明 */ },
this: {}
}

变量对象

变量对象(Variable object)是说JS的执行上下文中都有个对象用来存放执行上下文中可被访问但是不能被delete的函数标示符、形参、变量声明等。它们会被挂在这个对象上。

代码示例

var color = 'blue';
function changeColor() {
var anotherColor = 'red';
function swapColors() {
var tempColor = anotherColor;
anotherColor = color;
color = tempColor;
}
swapColors();
}
changeColor();

闭包概念

MDN 对闭包的定义为:

闭包是指那些能够访问自由变量的函数。

那什么是自由变量呢?

自由变量是指在函数中使用的,但既不是函数参数也不是函数的局部变量的变量。

由此,我们可以看出闭包共有两部分组成:

闭包 = 函数 + 函数能够访问的自由变量

举个例子:

var a = 1;
function foo() {
console.log(a);
}
foo();

foo 函数可以访问变量 a,但是 a 既不是 foo 函数的局部变量,也不是 foo 函数的参数,所以 a 就是自由变量。

那么,函数 foo + foo 函数访问的自由变量 a 就构成了一个闭包

js 不会销毁被闭包引用的对象

GC 垃圾回收

Garbage Collection 垃圾回收是一种自动的内存管理机制。当一个电脑上的动态内存不再需要时,就应该予以释放,以让出内存,这种内存资源管理,称为垃圾回收。

新生代和老生代内存分区

为什么要分区?为了 GC 效率

新生代的 GC 算法

Scavenge 算法,它将堆内存一分为二,将存活对象在从空间 1 复制到空间 2,其他对象被回收。特点是速度快。新生代内存的对象过大或者存活时间过长就会去到老生代内存。

老生代的 GC 算法

Mark-Sweep 标记清除算法,标记清除回收之后,内存会变得碎片化。
Mark-Compact 标记整理算法,在整理过程中,将活着的对象往一端移动,移动完成后,直接清理掉边界外的内存。

内存泄露

本质上,内存泄漏可以定义为:应用程序不再需要占用内存的时候,由于某些原因,内存没有被操作系统或可用内存池回收。编程语言管理内存的方式各不相同。只有开发者最清楚哪些内存不需要了,操作系统可以回收。一些编程语言提供了语言特性,可以帮助开发者做此类事情。另一些则寄希望于开发者对内存是否需要清晰明了。

排除方法

  1. 抓下内存快照,使用 chrome 分析,使用框架和各种库的时候干扰项非常多
  2. alinode

参考文章

重要

  1. 深入理解闭包(五)——作用域、作用域链和执行上下文
  2. 深入理解JavaScript闭包【译】
  3. 深入理解JavaScript执行上下文、函数堆栈、提升的概念
  4. MDN 函数
  5. JavaScript深入之闭包
  6. 轻松排查线上Node内存泄漏问题
  7. 4类 JavaScript 内存泄漏及如何避免 介绍了如何使用 chrome dev tool 排查内存泄露

不重要

  1. 解读 V8 GC Log(二): 堆内外内存的划分与 GC 算法
    1. Node 性能优化
  2. 解读 V8 GC Log(一): Node.js 应用背景与 GC 基础知识
  3. NodeJS中被忽略的内存
  4. 前端基础进阶(一):内存空间详细图解
  5. 前端基础进阶(二):执行上下文详细图解
  6. JavaScript 内存模型