假设我熟悉在jQuery中开发客户端应用程序,但现在我想开始使用AngularJS。你能描述一下必要的范式转变吗?以下几个问题可能有助于您确定答案:

如何以不同的方式构建和设计客户端web应用程序?最大的区别是什么?我应该停止做什么/使用什么;我应该开始做什么?是否有服务器端的考虑/限制?

我不想详细比较jQuery和AngularJS。


当前回答

你能描述一下必要的范式转变吗?

命令与声明

使用jQuery,您可以一步一步地告诉DOM需要发生什么。使用AngularJS,您可以描述您想要的结果,但不描述如何实现。还有,看看马克·拉乔克的答案。

如何以不同的方式构建和设计客户端web应用程序?

AngularJS是一个使用MVC模式的完整客户端框架(查看它们的图形表示)。它非常注重关注点的分离。

最大的区别是什么?我应该停止做什么/使用什么;我应该开始做什么?

jQuery是一个库

AngularJS是一个漂亮的客户端框架,高度可测试,它结合了许多很酷的东西,如MVC、依赖注入、数据绑定等等。

它专注于关注点和测试的分离(单元测试和端到端测试),这有助于测试驱动开发。

最好的开始方式是完成他们很棒的教程。你可以在几个小时内完成这些步骤;然而,如果你想掌握幕后的概念,它们包括大量的参考资料以供进一步阅读。

是否有服务器端的考虑/限制?

您可以在已经使用纯jQuery的现有应用程序上使用它。然而,如果您想充分利用AngularJS特性,可以考虑使用RESTful方法对服务器端进行编码。

这样做将允许您利用他们的资源工厂,这将创建服务器端RESTful API的抽象,并使服务器端调用(获取、保存、删除等)变得异常简单。

其他回答

jQuery

jQuery使getElementByHerpDerp等长得离谱的JavaScript命令变得更短,并且跨浏览器。

角度JS

AngularJS允许您制作自己的HTML标记/属性,这些标记/属性可以很好地处理动态web应用程序(因为HTML是为静态页面设计的)。

编辑:

说“我有jQuery背景,我在AngularJS中如何思考?”就像说“我拥有HTML背景,我如何在JavaScript中思考?”你问这个问题的事实表明你很可能不理解这两个资源的基本目的。这就是为什么我选择通过简单地指出根本区别来回答这个问题,而不是通过列表来回答“AngularJS使用指令,而jQuery使用CSS选择器来创建一个jQuery对象,该对象执行这和那等操作……”。这个问题不需要冗长的回答。

jQuery是一种使浏览器中的JavaScript编程更容易的方法。更短的跨浏览器命令等。

AngularJS扩展了HTML,因此您不必为了创建应用程序而到处放置<div>。它使HTML实际上适用于应用程序,而不是它的设计目的,即静态的教育网页。它使用JavaScript以迂回的方式实现了这一点,但基本上它是HTML的扩展,而不是JavaScript。

我觉得这个问题很有趣,因为我第一次认真接触JavaScript编程是Node.js和AngularJS。我从未学习过jQuery,我想这是一件好事,因为我不必忘记任何东西。事实上,我积极避免使用jQuery解决我的问题,而是只寻找一种“AngularJS方法”来解决它们。因此,我想我对这个问题的回答基本上可以归结为,“像从未学习过jQuery的人一样思考”,并避免任何直接合并jQuery的诱惑(显然AngularJS在某种程度上在幕后使用了它)。

它们是苹果和橘子。你不想比较它们。它们是两种不同的东西。AngularJs已经内置了jQuery lite,它允许您执行基本的DOM操作,甚至不包括完整的jQuery版本。

jQuery完全是关于DOM操作的。它解决了所有跨浏览器的问题,否则您将不得不处理,但它不是一个允许您将应用程序划分为AngularJS等组件的框架。

AngularJs的一个优点是它允许您在指令中分离/隔离DOM操作。有内置指令可供您使用,例如ng-click。您可以创建自己的自定义指令,这些指令将包含所有视图逻辑或DOM操作,这样您就不会在应该处理业务逻辑的控制器或服务中混合DOM操作代码。

Angular将应用程序分解为-控制器-服务-视图-等等。

还有一件事,那就是指令。它是一个可以附加到任何DOM元素的属性,您可以在其中使用jQuery,而不必担心jQuery会与AngularJs组件冲突或破坏其架构。

我从我参加的一次会议上听到,Angular的创始人之一表示,他们非常努力地将DOM操作分离出来,所以不要试图将它们重新纳入其中。

jQuery是一个DOM操作库。

AngularJS是一个MV*框架。

事实上,AngularJS是为数不多的JavaScript MV*框架之一(许多JavaScript MVC工具仍然属于类别库)。

作为一个框架,它托管您的代码,并决定何时调用什么!

AngularJS本身包含一个jQuery-lite版本。因此,对于一些基本的DOM选择/操作,您真的不必包含jQuery库(它节省了许多在网络上运行的字节)

AngularJS为DOM操作和设计可重用UI组件提供了“指令”的概念,因此当您觉得需要做与DOM操作相关的事情时,应该使用它(指令是在使用AngularJS时编写jQuery代码的唯一地方)。

AngularJS涉及一些学习曲线(不仅仅是jQuery:-)。

-->对于任何来自jQuery背景的开发人员,我的第一个建议是“在跳到像AngularJS这样的富框架之前,将JavaScript作为第一类语言学习!”我很难了解到上述事实。

祝你好运

为了描述“范式转变”,我认为一个简短的答案就足够了。

AngularJS改变了查找元素的方式

在jQuery中,通常使用选择器来查找元素,然后将它们连接起来:$('#id.class').click(doStuff);

在AngularJS中,您使用指令直接标记元素,将它们连接起来:<a ng click=“doStuff()”>

AngularJS不需要(也不希望)使用选择器查找元素——AngularJS的jqLite与完整的jQuery之间的主要区别是jqLite不支持选择器。

因此,当人们说“根本不包括jQuery”时,主要是因为他们不希望您使用选择器;他们希望你学会使用指令。直接,而不是选择!