2016年10月3日,
感觉学习JavaScript在2016年
没有JavaScript在本文的写作框架创建。
下面是灵感来自这篇文章从圆CI“未来”。你可以阅读原始在这里。这篇文章只是一个意见,就像任何JavaScript框架,它不应该太当回事。
嘿,我有了这个新的web项目,但老实说我没有编码的web几年后,我听说景观改变了一点。在这里你是最web开发产品质量对吧?
——实际是前端工程师,但我是的,正确的人。在2016年我做的网页。可视化效果,音乐播放器,飞行的无人机,踢足球,你的名字。我刚从JsConf和ReactConf回来,所以我知道最新的技术来创建web应用程序。
酷。我需要创建一个页面,该页面显示用户的最新活动,所以我只需要得到来自REST端点的数据并将其显示在某种可滤过的表,如果在服务器中的任何改变和更新。我在想也许使用jQuery来获取和显示数据?
-哦我的上帝,不使用jQuery了。你应该试着学习的反应,是2016。
哦,好吧。是什么反应?
——是一个超级酷的图书馆由一些人在Facebook,它真的让应用程序控制和性能,通过允许您处理任何视图很容易变化。
这听起来不错。我可以用反应显示来自服务器的数据?
-是的,但是首先您需要添加反应和反应DOM作为一个图书馆在你的网页上。
等等,为什么两个库?
——一个是实际的库,第二个是操纵DOM,在JSX现在你可以描述。
JSX吗?JSX是什么?
jsx只是一个JavaScript语法扩展XML看起来很像。它的另一种描述DOM,认为它是一个更好的HTML。
HTML有什么问题吗?
- 2016。没有人直接编码的HTML了。
正确的。无论如何,如果我把这两个库,那么我可以用反应?
——相当。您需要添加巴别塔,然后你可以使用反应。
另一个图书馆吗?巴别塔是什么?
-哦,巴别塔是一个transpiler,允许您针对特定版本的JavaScript,当你在任何版本的JavaScript代码。你不必使用ReactJS包括巴别塔,但除非你做什么,你坚持使用ES5,我们是真实的,是2016,你应该编码ES2016 +其余的酷孩子一样。
ES5吗?ES2016 + ?我迷失在这里。ES5和ES2016 +是什么?
es5代表ECMAScript 5。版的,大多数人的目标,因为它现在已经被大多数浏览器实现。
ECMAScript吗?
-是的,你知道,标准JavaScript脚本是基于在1999年首次发布于1995年,当时当JavaScript被任命为Livescript Netscape Navigator,只有跑。当时很混乱,但值得庆幸的是现在情况非常清楚,我们像7版本的实现。
7版本。为真实的。和ES5和ES2016 + ?
——分别第五和第七版。
六等,发生了什么?
-你ES6意味着什么?是的,我的意思是,每一个版本都是前一个的超集,因此,如果您使用的是ES2016 +,您使用的是以前版本的功能。
正确的。为什么使用ES2016 + ES6呢?
-嗯,你可以使用ES6,而是使用很酷的功能,如异步和等待,你需要使用ES2016 +。否则你是坚持ES6发电机与协同程序阻止异步调用适当的控制流。
我不知道你刚才说什么,这些名字都是混乱的。看,我只是从服务器加载大量的数据,我只能够使用包括jQuery CDN与AJAX调用获取数据,为什么我就不能呢?
——2016年的人,没有人再使用jQuery,最终在一群意大利面条式代码。每个人都知道。
正确的。所以我的选择是加载三库获取数据并显示一个HTML表格。
-嗯,你包括这三个库但包一个模块管理器只加载一个文件。
我明白了。一个模块管理器是什么?
——定义依赖于环境,但在web通常指任何支持AMD或CommonJS模块。
Riiight。AMD和CommonJS…吗?
定义。有很多方法来描述多个JavaScript库和类应该是如何交互的。你知道,出口和要求?你可以写多个JavaScript文件定义AMD或CommonJS API,您可以使用类似Browserify包。
我想好了,这是有道理的…。Browserify是什么?
——它是一个工具,允许你把CommonJS描述文件的依赖关系,可以在浏览器中运行。创建它,因为大多数人在npm注册表中发布这些依赖项。
npm注册中心?
——它是一个非常大的公共存储库,聪明的人把代码和依赖模块。
像一个CDN ?
不是真的。它更像是一个中央数据库,任何人都可以发布和下载库,所以你可以使用它们在当地的发展,然后上传到一个CDN如果你想。
哦,像保尔一样!
是的,但现在是2016年,没有人使用凉亭了。
哦,我明白了…所以我需要从npm下载库呢?
-是的。例如,如果您想要使用的反应,你下载代码中的反应模块和导入它。你可以做几乎所有流行的JavaScript库。
哦,像角!
角是2015。但,是的。角会出现在那里,除了VueJS或RxJS和其他酷2016库。想了解这些吗?
让我们坚持的反应,现在我已经学习太多的事情。所以,如果我需要使用从这个npm反应我取回它,然后使用这个Browserify啊?
-是的。
似乎过于复杂,仅仅抓住一群依赖关系并把它们组合在一起。
——这就是为什么你使用像繁重的任务管理器或吞咽或花椰菜Browserify自动化运行。见鬼,你甚至可以用含羞草。
繁重吗?杯吗?西兰花吗?含羞草?我们现在谈论的究竟是什么?
任务经理。但他们不酷了。在2015年,我们使用它们,那么我们使用makefile,但现在我们包装与Webpack一切。
makefile吗?我认为主要是使用C或c++项目。
-是的,但显然在web我们做爱的事情复杂,然后回到基础。我们每年都这样做,只是等待,我们要做组装在一年或两年的网络。
叹息。你提到了一个叫做Webpack吗?
——为浏览器的另一个模块经理时一种任务跑。就像一个更好的版本Browserify。
哦,好吧。为什么它是更好的?
-嗯,也许不是更好,只是更固执己见的应该如何绑你的依赖关系。Webpack允许您使用不同的模块经理,不仅CommonJS的,比如本地ES6支持模块。
我非常困惑这整个CommonJS / ES6的事情。
每个人都是,但你不应该关心与SystemJS了。
耶稣基督,另一个noun-js。好的,这个SystemJS是什么?
-嗯,不像Browserify Webpack 1。x, SystemJS模块是一个动态的加载程序,允许你将多个模块在多个文件而不是捆绑在一个大的文件。
等,但我认为我们想建库在一个大文件和加载!
是的,但现在因为HTTP / 2来了多个HTTP请求实际上是更好的。
等等,所以我们不能添加三个原始库反应? ?
不是真的。我的意思是,你可以把它们从一个CDN外部脚本,但是您仍然需要包括巴别塔。
叹息。这是不好的对吧?
是的,你将是包括整个babel-core,它不会有效的生产。生产需要执行一系列pre-tasks准备你的项目,让撒旦仪式召唤看起来像个煮鸡蛋的方法。你需要缩小资产,糟蹋,内联css上面,推迟脚本,以及-
我明白了,我明白了。所以如果你不包括库直接在CDN,你会怎么做?
我将从打印稿transpile使用Webpack + SystemJS +巴别塔组合。
打印稿?我以为我们在JavaScript编码!
打印稿是JavaScript,或更好说,JavaScript的超集,更具体地说版本ES6 JavaScript。你知道,第六版我们以前谈过吗?
我认为ES2016 +已经ES6的超集!为什么我们现在需要这个东西叫做打印稿?
-哦,因为它允许我们使用JavaScript作为一个类型语言,并减少运行时错误。是2016,你应该添加一些类型你的JavaScript代码。
显然,打印稿呢。
流式,尽管它只检查输入而打印稿是需要编译的JavaScript的超集。
叹息…和流程是什么?
——它是一种静态类型检查器由有些人在Facebook。他们编码OCaml,因为功能编程是太棒了。
OCaml吗?函数式编程吗?
——就是酷孩子使用现在的男人,你知道的,2016 ?函数式编程吗?高阶函数?鞭笞?纯函数?
我不知道你刚才说什么。
-没有一个开始。看,你只需要知道,函数式编程比OOP和2016年我们应该使用。
等等,我在大学学会了OOP,我认为这是好吗?
所以被甲骨文收购之前是Java。我的意思是,OOP回到天很好,今天它仍然有它的使用,但是现在每个人都意识到修改状态相当于踢婴儿,所以现在每个人都搬到不可变对象和函数式编程。Haskell人多年来一直叫它,,别让我开始榆树的家伙,但幸运的是在web现在我们有图书馆像Ramda允许我们使用纯JavaScript函数式编程。
你滴名字为了吗?Ramnda到底是什么?
-不。Ramda。像λ。你知道,大卫·钱伯斯的图书馆吗?
大卫是谁?
的节日。很酷的家伙。扮演一个意思是政变的游戏。Ramda的贡献者之一。您还应该检查埃里克·梅耶尔如果你认真学习函数式编程。
和埃里克·梅耶尔是…?
函数式编程的家伙。可怕的家伙。他有很多演讲,他淘汰了敏捷在使用这个奇怪的彩色衬衫。您还应该检查的一些东西从Tj, Jash凯纳斯,Sindre Sorhus,保罗•爱尔兰阿迪他-
好的。我要阻止你。都很好,很好,但是我认为是如此复杂和不必要的抓取数据并显示它。我很确定我不需要知道这些人或学习所有这些事情与动态数据创建一个表。让我们回到反应。我怎么能从服务器获取数据和反应?
-嗯,你实际上不获取数据和反应,你就显示数据的反应。
哦,该死的我。你用来获取数据?
你使用从服务器获取数据的获取。
我很抱歉?你使用获取获取数据?谁是命名这些东西需要一本同义词典。
-我知道对吧?取的名字本机实现对服务器执行xmlhttprequest。
哦,所以AJAX。
ajax只是使用xmlhttprequest。但确定。获取允许您基于AJAX的承诺,然后你可以解决避免回调地狱。
回调地狱吗?
-是的。每次执行异步请求的服务器,你需要等待它的反应,这样会让你在一个函数添加一个函数,称为回调金字塔从地狱。
哦,好吧。这一承诺的事情解决了吗?
——实际上。通过操纵你的回调的承诺,您可以编写更容易理解的代码,模拟和测试,以及同时发生的请求执行一次,等到他们被加载。
这可以用卖?
是的,但前提是你的用户使用一个常绿浏览器,否则你需要包括取回polyfill或使用要求,蓝鸟或Axios。
我需要知道多少图书馆在上帝的份上?有多少?
——它的JavaScript。必须有成千上万的库都做同样的事情。我们知道库,事实上,我们有最好的图书馆。我们的图书馆的保育,有时我们包括家伙费李瑞的照片。
你刚才说人费李瑞?让我们把这个做完。这些蓝知更鸟,请求,Axios图书馆做什么?
——库来执行xmlhttprequest回报的承诺。
没有jQuery AJAX方法开始返回承诺吗?
我们不使用2016年的“J”字了。只使用取回,polyfill当它并不是在浏览器或者使用蓝知更鸟,请求或Axios代替。然后用等待管理承诺在一个异步函数和繁荣,你有适当的控制流。
这是第三次你提到等待,但我不知道它是什么。
等待允许你阻止异步调用,让你有更好的控制,当数据被获取和整体提高代码的可读性。太棒了,你只需要确保你添加第三阶段预设在巴别塔,或者使用syntax-async-functions和transform-async-to-generator插件。
这是疯狂的。
-不,疯狂的是你需要预编译打印稿代码然后transpile巴别塔使用等待。
窟?不包括在打印稿?
——在接下来的版本,但只目标ES6 1.7版本,所以如果你想在浏览器中使用等待,首先你需要编译打印稿代码针对ES6然后巴贝尔目标ES5屎。
在这一点上我不知道该说些什么。
文采,很容易。代码中所有打印稿。使用获取的所有模块编译目标ES6, transpile第三阶段预设与巴别塔,与SystemJS加载它们。如果你没有取回,polyfill它,或者使用蓝知更鸟,请求或Axios,处理与等待你所有的承诺。
我们有不同的定义,简单。所以,仪式我最后获取数据,现在可以显示它与反应对吗?
是您的应用程序将处理任何状态变化?
呃,我不这么认为。我只需要显示的数据。
-哦,感谢上帝。否则我将不得不解释你流量,实现像失败一样,Alt, Fluxible。虽然说实话你应该回来的。
我要飞越这些名字。再一次,我只需要显示数据。
-哦,如果你只是显示的数据不需要反应。你会一直好模板引擎。
你是在和我开玩笑吗?你认为这是有趣的吗?你如何对待你爱的人吗?
我只是解释你可以使用。
停止。停下来。
-我的意思是,即使只是使用模板引擎,我仍将使用打印稿+ SystemJS +巴别塔组合如果我是你。
我需要在页面上显示数据,而不是执行子零的原始可死亡。告诉我使用什么模板引擎,从那里我就要它了。
有很多,你熟悉哪一个?
呃,不记得这个名字。这是很久以前的事了。
-jTemplates吗?jQote吗?纯吗?
呃,不想起。另一个吗?
透明吗?JSRender吗?MarkupJS吗?KnockoutJS吗?一个双向绑定。
另一个吗?
-PlatesJS吗?jQuery-tmpl吗?车把吗?有些人仍然使用它。
也许吧。有类似于最后一个吗?
胡子,下划线?我认为现在甚至lodash说实话,但这些都是2014。
呃. .也许是新的。
玉吗?DustJS吗?
不。
-DotJS吗?EJS吗?
不。
-Nunjucks吗?等吗?
不。
mah,反正没有人喜欢Coffeescript语法。玉吗?
不,你已经说玉。
我意味着哈巴狗。我的意思是说玉。我的意思是,现在玉哈巴狗。
叹息。不。不记得了。你会用哪一个?
或许只是ES6本地模板字符串。
让我猜一猜。这需要ES6。
正确。
这取决于我在用什么浏览器需要巴别塔。
正确。
,如果我想整个核心库包括在不增加,我需要从npm装载它作为一个模块。
正确。
,需要Browserify Wepback或者叫SystemJS最有可能,其他的事情。
正确。
除非是Webpack,理想情况下,应该由跑步者的任务。
正确。
但是,自从我应该使用函数式编程类型语言,我首先需要预编译打印稿或添加这个流东西。
正确。
然后发送到巴别塔如果我想等待使用。
正确。
所以我可以使用取回,承诺,和控制流和魔法。
——别忘了polyfill取回如果不支持,Safari仍然不能处理它。
你知道。我认为我们在这里完成。事实上,我认为我完成了。我完成了web,我完成了完全使用JavaScript。
——很好,几年后我们都将被编码在榆树或WebAssembly。
我要回到后台。我不能处理这些许多变化和版本和版本,编译器和transpilers。JavaScript社区是疯了如果它认为任何人都能跟上。
我听到你的声音。你应该试试然后Python社区。
为什么?
曾经听说过Python 3 ?
更新:谢谢你指出错误和错误,我会更新这篇文章。讨论HackerNews和Reddit。
