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

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

我不想详细比较jQuery和AngularJS。


当前回答

请收听播客JavaScript Jabber:第32集,其中介绍了AngularJS的原创创作者:Misko Hevery&Igor Minar。他们谈论了很多来自其他JavaScript背景,特别是jQuery的AngularJS的感觉。

播客中的一点让我对你的问题有了很多看法:

MISKO:[…]在Angular中,我们很难想到的一件事是,我们如何提供大量逃生舱口,以便您能够逃出去,并基本上找到解决问题的方法。对我们来说,答案是“指令”。有了指令,你就基本上变成了一个普通的小jQueryJavaScript,你可以做任何你想做的事情。IGOR:所以把指令想象成编译器的指令,当你在模板中遇到这个特定的元素或这个CSS时,它会告诉你,你保留这类代码,而这类代码负责DOM树中元素及其下面的所有内容。

可以通过上面提供的链接获得整个事件的记录。

所以,直接回答你的问题:AngularJS非常固执己见,是一个真正的MV*框架。然而,您仍然可以在指令中使用jQuery完成所有您知道和喜爱的非常酷的事情。这不是“我如何做我在jQuery中曾经做过的事情?”的问题,而是“我如何用我在jQuery中曾经做的所有事情来补充AngularJS?”

这是两种截然不同的心态。

其他回答

实际上,如果您使用的是AngularJS,那么就不再需要jQuery了。AngularJS本身具有绑定和指令,这是一个非常好的“替代品”,可以替代jQuery中的大多数功能。

我通常使用AngularJS和Cordova开发移动应用程序。jQuery中我唯一需要的就是选择器。

通过谷歌搜索,我发现有一个独立的jQuery选择器模块。这是Sizzle。

我决定制作一个小代码片段,帮助我利用jQuery Selector(使用Sizzle)的强大功能快速启动一个使用AngularJS的网站。

我在这里分享了我的代码:https://github.com/huytd/Sizzular

这些都是很好但很长的答案。

总结我的经验:

控制器和提供者(服务、工厂等)用于修改数据模型,而不是HTML。HTML和指令定义了模型的布局和绑定。如果需要在控制器之间共享数据,请创建一个服务或工厂-它们是在应用程序中共享的单体。如果您需要HTML小部件,请创建一个指令。如果您有一些数据并且正在尝试更新HTML。。。停下!更新模型,并确保HTML绑定到模型。

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

命令与声明

使用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 Jabber:第32集,其中介绍了AngularJS的原创创作者:Misko Hevery&Igor Minar。他们谈论了很多来自其他JavaScript背景,特别是jQuery的AngularJS的感觉。

播客中的一点让我对你的问题有了很多看法:

MISKO:[…]在Angular中,我们很难想到的一件事是,我们如何提供大量逃生舱口,以便您能够逃出去,并基本上找到解决问题的方法。对我们来说,答案是“指令”。有了指令,你就基本上变成了一个普通的小jQueryJavaScript,你可以做任何你想做的事情。IGOR:所以把指令想象成编译器的指令,当你在模板中遇到这个特定的元素或这个CSS时,它会告诉你,你保留这类代码,而这类代码负责DOM树中元素及其下面的所有内容。

可以通过上面提供的链接获得整个事件的记录。

所以,直接回答你的问题:AngularJS非常固执己见,是一个真正的MV*框架。然而,您仍然可以在指令中使用jQuery完成所有您知道和喜爱的非常酷的事情。这不是“我如何做我在jQuery中曾经做过的事情?”的问题,而是“我如何用我在jQuery中曾经做的所有事情来补充AngularJS?”

这是两种截然不同的心态。