2017年最佳JavaScript框架,库和工具

JavaScript框架,库和工具似乎比他们的开发人员多出很多。截至2017年5月,在 GitHub 上快速搜索 JavaScript 项目显示已经超过110万个。npmjs.org 有 50 万个可用的软件包,每月下载量近100亿次。

2017.05.29:该文章已更新,以反映 JavaScript 生态的当前状态。

本文将努力解释最流行的客户端 JavaScript 框架、库和工具之间的基本内容和差异。他们对你来说是否是 “最好的” 选择是另一个问题。选择一些东西,坚持一段时间。你需要知道的是:你最喜欢的选项终将被“更好”的东西取代,无论你选择什么! 继续阅读

《React.js 小书》— 也许是最好的 React.js 入门教程

先放《React.js 小书》在线免费阅读地址:huziketang.com/books/react

React.js 是 Facebook 推出的一个用户帮助我们更方便构建大型 Web 应用程序的视图库。经过了多年的发展和开发,React.js 已经日趋成熟并且被大量地应用在了各种项目当中,和 Angular.js、Vue.js 一起并称为 Web 前端开发的三大框架(库)。已经越来越多的公司把熟练掌握 React.js 开发作为 Web 前端人才甄选的重要指标。

学习 React.js 已经逐渐成为了 Web 前端开发的必经之路之一。但 React.js 因为其颠覆性的 JSX、Virtual DOM、CSS in JS 的特性,以及它本身所带来的函数式编程的思想,给 Web 前端开发带来便利的同时也增加了学习的门槛。很多从 jQuery、DOM API 编程经历过来的初学者可能学习起来会非常吃力,感觉很多概念生涩难懂、匪夷所思。

而《React.js 小书》(在线免费阅读:huziketang.com/books/react)就是解决这一问题而生。《React.js 小书》是一本开源的、免费的、专业的 React.js 入门教程。作者具有丰富的 React.js 一线开发经验,并且熟知 React.js 学习过程中可能会经历的心路历程。所以, 《React.js 小书》抛弃了已有的教程的束缚,经过对从初学者心理角度出发,从刚入门者的认知角度出发,用读者已有的知识一步步地解决、优化一个一个问题,把读者的思维方式逐渐地在不知不觉中转变成 React.js 的思维方式。
继续阅读

JavaScript: 2016年回顾

翻译自:https://www.sitepoint.com/javascript-2016-in-review/

2016年是意义重大的,奇怪的,欢欣鼓舞 / 可怕的一年,这取决于你的观点。与其他事件相比,只专注于JavaScript可能看起来无关紧要,但它是每个Web开发人员的工作生活的一个巨大的一部分。

JavaScript 人气持续爆涨。不是每个人都喜欢这门语言,但是现在你可能很少听到十年前嘲笑的评论。就个人而言,我一直喜欢JavaScript – 即使在早期,令人沮丧的年头。那些从C++,Java或PHP方向过来使用它的人可能首先会感到困惑:JavaScript看起来似曾相识,却又如此陌生。克服你的推断,你会欣赏它简单的优雅,实用性和灵活性。(That said, date handling is still a nightmare!,这就是说,日期处理仍然是一场噩梦!愚人码头看不懂这句是什么意思。)

JavaScript在五月迎来了它第21个生日,让我们回顾一下它刚成熟的第一年……

ECMAScript演变

ES6 / 2015是这门语言自诞生以来最重要的更新。这份规范花了7年才完成,但现在浏览器和其他运行运行环境终于开始支持箭头函数,let,const,代理和更多令人喜悦的特性。ES6的兼容性也慢慢变得很好

如果你需要支持更老版本的浏览器,完全切换到ES6可能还有点早。更老版本的意思是,一年多前发布的任何东西。您可以使用编译器将ES6转译为ES5,如Babel,但是如果你不引入额外的构建步骤,开发就会变得复杂。

ES7/2016比起革命更像是一种进化。一个令人激动的新特性是async,它允许以同步的方式编写异步代码,而不需要回调或Promise的复杂语法(它让我一直很头疼)。 继续阅读

React入门:关于虚拟DOM(Virtual DOM)

Virtual DOM 是一个模拟 DOM 树的 JavaScript 对象。 React 使用 Virtual DOM 来渲染 UI,当组件状态 state 有更改的时候,React 会自动调用组件的 render 方法重新渲染整个组件的 UI。

React 主要的目标是提供一套不同的, 高效的方案来更新 DOM.不是通过直接把 DOM 变成可变的数据, 而是通过构建 “Virtual DOM”, 虚拟的 DOM, 随后 React 处理真实的 DOM 上的更新来进行模拟相应的更新。

引入额外的一个层怎么就更快了呢?

那不是意味着浏览器的 DOM 操作不是最优的, 如果在上边加上一层能让整体变快的话?是有这个意思, 只不过 virtual DOM 在语义上和真实的 DOM 有所差别.最主要的是, virtual DOM 的操作, 不保证马上就会产生真实的效果.这样就使得 React 能够等到事件循环的结尾, 而在之前完全不用操作真实的 DOM。在这基础上, React 计算出几乎最小的 diff, 以最小的步骤将 diff 作用到真实的 DOM 上。批量处理 DOM 操作和作用最少的 diff 是应用自身都能做到的.任何应用做了这个, 都能变得跟 React 一样地高效。但人工处理出来非常繁琐, 而且容易出错. React 可以替你做到。

前面提到 virtual DOM 和真实的 DOM 有着不用的语义, 但同时也有明显不同的 API。

DOM 树上的节点被称为元素, 而 virtual DOM 是完全不同的抽象, 叫做 components。

component 的使用在 React 里极为重要, 因为 components 的存在让计算 DOM diff 更高效。 继续阅读

React入门:关于JSX语法

JSX语法,像是在Javascript代码里直接写XML的语法,实质上这只是一个语法糖,每一个XML标签都会被JSX转换88.b0T_u,4d寭法32 posthm_u,.3urce=AD_0需胳Java何东转换88.b0T_uscr的最016年毭法u,.3urce法重新等数e法重框架、关系噩梊去的䊠清act 可以噩_u,可以r04月29r0tlasrumenutf8s7 t/spanums:1">//u,.3u 不调用( lass=<ent> 8" height<ent> 8" heightight<ent> React 中文文档:不ElScrip cry-teElScrip( 8" strumg/不C29class, 8" [objeprops], 8" [tp:ld ...] ) 可re就潓变npmj本容易 符串式硨示 js/"法准发老兊的tmar者 不C29="c垛弃OM 树式硨示第21环的装》的殚OM 法重用縀二>npmj本 M 树式r者异。䭗典带容et="_b保因的.任兊的l DO固S参romi传 re后库和tua改接倃让我从一三>npmj本行运et="环库。本应认作。䅊的l D子䅊的模拟相-->

H/head3">地化么就d寭.3us="c似ipt代码里地化人原保蚄个模拟 et="的l DO糖》S参,䭐䅊的,每一用彜。本传给动蟥不cry-teElScrip件皿发表于 继续阅读