您当前位置：首页 > 互联网 > 研发周报：超实用的JavaScript技巧及最佳实践

研发周报：超实用的JavaScript技巧及最佳实践

来源：程序员人生发布时间：2014-09-08 23:20:51 阅读次数：3507次

在上一周，研发频道的文章主要集中在开源方面，这也是当下发展的一个潮流，越来越多的企业把项目选择开源。其中涉及到的开源文章有：CodeCombat游戏全面开源：玩游戏也能学编程、【开源专访】Node-Webkit作者王文睿：桌面应用的全新开发方式、新一代IDE Light Table开源：让编程工作更简单等。

下面就让我们来细细品味上周精彩文章：

1.【开源专访】Node-Webkit作者王文睿：桌面应用的全新开发方式

最近两年，Node.js技术越来越火，基于它所开发的应用也纷纷出现在大家面前，其中Node-Webkit就是这样的一个开源框架，它允许开发者使用Web技术开发桌面应用。

Node-Webkit是NodeJS与WebKit技术的融合，提供一个跨Windows、Linux平台的客户端应用开发的底层框架，利用流行的Web技术（Node.JS，JavaScript，HTML5）来编写应用程序的平台。应用程序开发人员可以轻松的利用Web技术来实现各种应用程序。Node-Webkit性能和特色已经让它成为当今世界领先的Web技术应用程序平台。

项目地址： https://github.com/rogerwang/node-webkit
文档： https://github.com/rogerwang/node-webkit/wiki

本期，我们对Node-Webkit的项目发起人Rogerwang，真名王文睿进行了采访，请他来谈谈Node-Webkit的开发始末，以及实现原理。

Node-Webkit的项目发起人王文睿

CSDN：您先做个自我介绍吧！

王文睿：目前我任职于Intel公司开源技术中心（OTC），从事Web和浏览器技术开发工作。现在主要工作是开发和维护Node-Webkit项目。此前从事过MeeGo、Tizen和JNI xml性能库的开发和数据中心解决方案服务。我于2005年加入Intel公司，此前于毕业于中科大少年班，在计算机系获得博士学位，研究方向为高性能计算。

CSDN：Node-Webkit项目创建的初衷是什么？

王文睿：2011年的时候，我和同事在讨论如何为Tizen WebRuntime增加扩展API的时候有了这个想法，就是用Node平台来扩展WebRuntime，达到开发本地应用的目的。那时候公司内部有个鼓励创新计划的活动，所以起初我可以用10%的工作时间投入到这个项目中。

CSDN：怎么想到把Node.js和Webkit技术结合在一起的？在这个项目中，Node.js和Webkit各自扮演着怎样的角色？这样结合有哪些优势？

王文睿：那时候已经了解到Node.js平台在Web开发者中很流行，有很多库，可以写本地应用。所以就有了用它扩展WebRuntime的想法。相比自己定义许多API，这样做开发者几乎不需要学习新的接口，而且方便自己用JS或者C++扩展。

WebKit（现在是Blink）负责HTML5 UI 相关的部分，而Node.js负责本地的API接口，比如文件系统，网络，设备等。

CSDN：Node-Webkit允许采用Web技术开发本地应用的原理是什么？具体是如何实现的？

王文睿：项目的核心思想就是在DOM中跑的代码能够直接调用Node.js中运行的代码，所以核心的部分是把二者跑在同一个线程中。需要把Chromium进程的事件循环和Node.js的事件循环合并在一起，并且把二者的V8 JS引擎环境（Context）合并起来。

CSDN：将HTML/CSS/JS编译为本地代码，其内部过程是什么样的？

王文睿：其实是一个打包的功能，将项目文件打包和Node-Webkit可执行文件放置在一起，就可以直接运行了。Node-Webkit启动的时候会自动加载页面文件。

更多采访内容，欢迎大家访问原文。

2.新一代IDE Light Table开源：让编程工作更简单

近日，Light Table项目创始人Chris Granger在其博客上宣布Light Table开源，将代码全部托管在GitHub上，遵循GNU开源许可。与此同时，还发布了0.6版本，该版本添加了插件、并对基础架构也进行了提升。

Light Table是由Microsoft Visual Studio部门项目经理Chris Granger离职后开发的全新理念的IDE，支持多种语言，比如Python、Clojure、JavaScript等。Light Table是一个很简单的概念：我们需要真正的工作面板，不只是编辑器和项目管理器。我们可以把东西尽量整洁地堆在这里，需要的时候可以把资料直接拿出来看。

Light Table所基于的开发原则：

处处文档，因此你不再感觉需要查看文档。
处处都有编辑器，而且可以显示任何事情，不仅仅是文本。
鼓励尝试，任何改变立刻就能看到结果。
IDE模仿的是桌面（Table），而非Visual Studio那样的窗口。文件也不是代码的最佳形式。

Light Table从创建到现在，已经经历了多个版本的更新，目前的最新版本为Light Table 0.6，关于Light Table 0.6版本的更多详细信息，大家可以查看 Change Log 。

3.CodeCombat游戏全面开源：玩游戏也能学编程

在倡导人人学编程、编程从娃娃抓起的时代，不知你是否听过，玩游戏也可以学编程。目前， CodeCombat游戏全面开源，它是一款多人编码游戏，该款游戏的任务就是教会大家如何编程，并且通过游戏来提升开发者的技能水平。

游戏总共超过9千关，每个步骤都会有语音操作提示（非中文），无论你是新手还是编程精英都可以加入到这款游戏中。

CodeCombat是一款跨平台游戏，可以在多个系统上运行，并且已被翻译成多个语言版本。

CodeCombat托管在 GitHub上，它也是GitHub上最大的开源CoffeeScript项目。代码遵循MIT和 Creative Commons协议。该游戏是由Y Combinator投资，开发者可以利用玩游戏的方式投入到开源和游戏开发工作中。两周前，CodeCombat发布了测试版本。更多详情，可以访问其博客的开源说明。

4.CentOS归属红帽：企业级Linux领域社区与商业的融合

红帽和CentOS于北京时间2014年1月8日在官网宣布，CentOS核心团队和项目将加盟红帽，同时CentOS也启用了一个新的站点（ http://www.centos.org ）。

CentOS（Community Enterprise Operating System）是Linux发行版之一，它是来自于Red Hat Enterprise Linux依照开放源代码规定释出的源代码所编译而成。由于出自同样的源代码，因此有些要求高度稳定性的服务器以CentOS替代商业版的Red Hat Enterprise Linux使用。两者的不同，在于CentOS并不包含封闭源代码软件。

CentOS加盟红帽后，红帽的Linux系统产品线如下：

CentOS团队在声明中表示，CentOS项目也将成为红帽的一部分，将和Fedora和RHEL生态系统一起，按照既定目标，进一步加速社区的发展和平台的创新。

Red Hat Enterprise Linux：针对商业开发和部署的企业级操作系统：
CentOS：社区驱动的企业级操作系统
Fedora：社区驱动的桌面操作系统

更详细的信息请参阅：红帽的公告和 CentOS的公告。

5.超实用的JavaScript技巧及最佳实践（下）

JavaScript是一门非常流行的编程语言，许多开发者都会把JavaScript选为入门语言，本文向大家分享JavaScript开发的小技巧、最佳实践等非常实用的内容。

在上周，CSDN研发频道发表了超实用的JavaScript技巧及最佳实践（上），很多开发者都觉得里面所提到的技巧非常实用，基于此，我们再向大家推荐超实用的JavaScript技巧及最佳实践（下），希望对大家有所帮助。

文中所提供的代码片段都已经过最新版的Chrome 30测试，该浏览器使用V8 JavaScript引擎（V8 3.20.17.15）。

1.使用逻辑符号&&或者||进行条件判断

code_snippet_id="144011" snippet_file_name="ptcms_1388979502_0.js">var foo = 10; foo == 10 && doSomething(); // is the same thing as if (foo == 10) doSomething(); foo == 5 || doSomething(); // is the same thing as if (foo != 5) doSomething();

||也可以用来设置函数参数的默认值

code_snippet_id="144011" snippet_file_name="ptcms_1388979502_1.js">Function doSomething(arg1){ Arg1 = arg1 || 10; // arg1 will have 10 as a default value if it’s not already set }

2.使用map()方法来遍历数组

code_snippet_id="144011" snippet_file_name="ptcms_1388979502_2.js">var squares = [1,2,3,4].map(function (val) { return val * val; }); // squares will be equal to [1, 4, 9, 16]

3.舍入小数位数

code_snippet_id="144011" snippet_file_name="ptcms_1388979502_3.js">var num =2.443242342; num = num.toFixed(4); // num will be equal to 2.4432

4.浮点数问题

code_snippet_id="144011" snippet_file_name="ptcms_1388979502_4.js">0.1 + 0.2 === 0.3 // is false 9007199254740992 + 1 // is equal to 9007199254740992 9007199254740992 + 2 // is equal to 9007199254740994

0.1+0.2等于0.30000000000000004，为什么会发生这种情况？根据IEEE754标准，你需要知道的是所有JavaScript数字在64位二进制内的都表示浮点数。开发者可以使用toFixed()和toPrecision()方法来解决这个问题。

5.使用for-in loop检查遍历对象属性

下面这段代码主要是为了避免遍历对象属性。

code_snippet_id="144011" snippet_file_name="ptcms_1388979502_5.js">for (var name in object) { if (object.hasOwnProperty(name)) { // do something with name } }

6.逗号操作符

code_snippet_id="144011" snippet_file_name="ptcms_1388979502_6.js">var a = 0; var b = ( a++, 99 ); console.log(a); // a will be equal to 1 console.log(b); // b is equal to 99

7.计算或查询缓存变量

在使用jQuery选择器的情况下，开发者可以缓存DOM元素

code_snippet_id="144011" snippet_file_name="ptcms_1388979502_7.js">var navright = document.querySelector('#right'); var navleft = document.querySelector('#left'); var navup = document.querySelector('#up'); var navdown = document.querySelector('#down');

8.在将参数传递到isFinite()之前进行验证

code_snippet_id="144011" snippet_file_name="ptcms_1388979502_8.js">isFinite(0/0) ; // false isFinite("foo"); // false isFinite("10"); // true isFinite(10); // true isFinite(undifined); // false isFinite(); // false isFinite(null); // true !!!

9.在数组中避免负向索引

code_snippet_id="144011" snippet_file_name="ptcms_1388979502_9.js">var numbersArray = [1,2,3,4,5]; var from = numbersArray.indexOf("foo") ; // from is equal to -1 numbersArray.splice(from,2); // will return [5]

确保参数传递到indexOf()方法里是非负向的。

更多技巧和最佳实践，读者可以访问：超实用的JavaScript技巧及最佳实践（上）和超实用的JavaScript技巧及最佳实践（下）。

6.设计师如何写出更棒的项目建议

如果你最终决定开始在网上开展自由网页设计业务的话，那么接下来你首先要考虑是否需要一个办公室；在系统学习如何招揽顾客之前，最好是列出“如何在线开展自由网页设计业务”的计划列表。制作项目建议表是开启项目的基础部分，也是最值得深入讨论的部分，现在我们就来讨论这个比较重要的问题：编写较好的Web项目建议的正确方式是什么？

调查先行
制作令人印象深刻的设计模板
“一对多”的策略并不奏效
至关重要的介绍
项目概述和建议
付款方式
对项目时间的控制
法律事务
对整个项目建议进行校对

7.2013最吃香的技能：Java称霸、Android势头正猛

据Stack Overflow统计，2013年最吃香的职位当属于Java程序员。每年都会有成千上万的公司使用Careers 2.0搜索与软件开发相关的工作职位，在2013年，Java开发者成了大家最常搜索的关键词。

Stack Overflow从各个公司最常搜索的14000个词汇中，总结出了与开发技能最相关且搜索次数最多的词汇，其中下面10种语言/技术出现的频率是最多的：

下面我们再从Indeed中看看这10门主流语言/技术的热门程度。Indeed是全球最大的招聘求职网站，每月拥有1亿独立用户，Indeed的服务跨越50个国家，支持26种语言，覆盖了产生全球94%GDP的区域。

下图显示了在Indeed中这10种编程语言/技术所匹配的工作数量的百分比。

从图中可以看出，老牌语言Java和.NET最为热门。而JavaScript呈现一直增长的曲线，排在第三位，而随着HTML5技术的逐渐成熟和广泛应用，JavaScript将会迎来新一轮的需求增长。其中C++表现很稳定。

随着移动互联网的快速发展，iOS、Android呈现出增长的趋势，并且两者的增长势头相当，不分上下。

该排名是根据Indeed网站中相关招聘职位数量所统计出来的，在一定方面反映了该语言的市场需求情况（注意是市场需求，不是语言好坏）。这些数据可以作为你学习语言和找工作时的一些参考。由于这些数据统计的是国外的招聘情况，所以其排名也不可尽信。

Indeed工作趋势搜索：http://www.indeed.com/jobtrends

这里还有一个招聘统计网站（http://www.simplyhired.com/a/jobtrends/home），可以进行对比作为参考。Simply Hired也号称全球最大的招聘网站。

8.Firefox OS的2013回顾和2014展望

Firefox OS是一个采用开放Web技术、完全基于HTML5开发的移动操作系统，其目标是提供一个平台，使得用户在移动设备、桌面电脑、平板或者任何可以连到网络的设备上获得相同的应用体验。

2013年，Mozilla度过了15岁的生日，这一年，Mozilla正式发布了Firefox OS，高调进入移动领域。本文就来回顾一下2013年Firefox的历程，并展望它在2014年的发展。

Firefox OS的2013

2013年初，Mozilla在全球移动通信大会（MWC）上正式发布了Firefox OS。

面对两大强敌――Android、iOS，Windows Phone在微软和诺基亚强大的背景下非常艰难地抢占了一点市场份额，移动领域的竞争已经进入了白热化状态，Mozilla为何还要趟这个浑水呢？

对于这个问题，Mozilla表示，这些操作系统及其生态都不是真正的开放，应该有这么一个真正开放的生态来替代它们。基于Web的灵活性和强大的功能，用户可以在任何平台上获得体验一致的应用程序，而不需要依赖特定的设备。

Firefox OS的代码是开源的，这样用户可以看到该系统不断进化完善的过程，在个人资料处理和安全性方面，开源的系统会更加可靠。

下面来看看Firefox OS 2013年大事记。

2013年2月，Mozilla发布 Firefox OS及首款设备
2013年4月，Firefox OS开发者预览版手机开卖，上线数小时即售罄
2013年5月，Mozilla发布Firefox OS模拟器3.0，用户可以在浏览器中体验Firefox OS
2013年5月，Firefox OS迎来大玩家富士康，Firefox OS联盟的其他成员还有索尼、中兴、华为等手机厂商以及全球包括中国联通在内的17个移动运营商
2013年10月，Firefox OS 1.1版本发布
2013年12月，Firefox OS 1.2版本发布

Firefox OS的2014

Firefox OS系统和相关手机如今都已经面市，在经过了2013年一年时间的铺垫，今年势必成为Firefox OS高速发展的最佳时机。

新的移动Web生态标准
新的部署形式
新的市场

生活不易，码农辛苦
如果您觉得本网站对您的学习有所帮助,可以手机扫描二维码进行捐赠
程序员人生

------分隔线----------------------------

上一篇 Manhattan，Twitter规模的实时、多租户分布式数据库

下一篇 Unity将收购Applifier，并引入Everyplay和GameAds两大平台

分享到:

------分隔线----------------------------

为码而活

积分：4237

15粉丝

7关注

栏目热点