breeze.linalg

Agbonghama Collins对这篇文章进行了同行评审。 感谢所有SitePoint的同行评审员使SitePoint内容达到最佳状态!

数据量正在Swift增长,并且维护变得越来越复杂。 许多开发人员希望避免在工作过程中由于数据问题引起的问题和头痛。

Breeze.js是使我们的工作更轻松的库之一 。 在本文中,我们将讨论如何使用Breeze.js编写更好的查询。 但是首先,我们应该知道什么是Breeze.js以及为什么创建它。

什么是Breeze.js?

Breeze.js是一个JavaScript库,可以帮助我们管理富客户端应用程序中的数据。 Breeze本机运行在每种浏览器中,并支持客户端查询,缓存和动态对象图 。

Breeze.js的最好之处在于它不镜像服务器端模型,而是动态创建的。 使用Breeze,缓存的数据在客户端。 它不需要查询服务器,因为它可以查询缓存。 它将缓存本地和离线保存。 重新连接后,它会同步更改。

Breeze.js的两个优点是丰富的查询和更改跟踪。 四种强大的查询方式是过滤器 , 排序 , 分页和投影 。 查询需要帮助来执行,这是Breeze EntityManager进入的地方。每个实体都跟踪其自己的更改状态。 我们将在后面讨论。

Breeze.js在许多框架(包括AngularJS,Backbone.js,Knockout,Node.js等)中都可以很好地工作。

现在让我们看一下如何设置环境并进行编码。

如何安装

可以从GitHub上的存储库下载Breeze。 Breeze最常见的版本是:

  • breeze.debug.js —这是我建议使用的标准客户端库。 它支持第三方数据库,包括Backbone和Knockout。
  • breeze.min.js — Breeze.min.js是缩小的breeze.debug.js,与breeze.debug.js的大小602 KB相比,其大小为175 KB。

还有两种获取微风的方法:通过Bower和npm 。 我更喜欢使用Bower,因为我对它更加熟悉。 打开终端,然后转到客户端目录并运行以下两个命令以获取Breeze:

bower install breeze-client
bower install breeze-client-labs

为了将Breeze包含到项目中,您应该在页面的<body>中包含以下脚本标记:

<script src="bower_components/breeze-client/build/breeze.debug.js"></script>

不支持ECMAScript 5的旧版浏览器可能会导致Breeze出现问题。 必须具备填充程序库才能在这些浏览器上启用ES5语法。 对于Internet Explorer用户,建议在<head>标记内输入此代码,以避免兼容性模式问题。

<meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/>

Breeze还需要一些扩展才能正常工作 :

  • 数据服务
  • 一个执行AJAX请求JavaScript组件
  • 用于数据绑定的模型库(例如Knockout)
  • 一个承诺库

为了演示Breeze的实际作用,在下一部分中,我将向您展示如何启动和运行Breeze的示例应用程序之一。 这将包括所有这些现成的东西。

示例应用程序的先决条件

为了运行示例应用程序,您将需要在计算机上安装Node.js和MongoDB。

Node.js是免费使用的,可以从项目的主页下载。 如果您的计算机上装有Bower或npm,则还需要安装Node。 如果您在安装Node时遇到问题,请查看有关npm的教程(包括有关此内容的部分): npm入门指南

可以从其下载页面下载MongoDB。 他们提供了有关如何在所有主要操作系统上进行安装的指南 。

设置示例应用

首先要做的是获取Breeze JavaScript Client示例应用程序的副本。 最简单的方法是使用Git:

git clone https://github.com/Breeze/breeze.js.samples.git

在项目内,导航到node/zza-node-mongo文件夹:

cd breeze.js.samples/node/zza-node-mongo

免费学习PHP!

全面介绍PHP和MySQL,从而实现服务器端编程的飞跃。

原价$ 11.95 您的完全免费

免费获得这本书

在这里,您可以看到三个文件夹: clientdatabaseserver 。 在database文件夹中,解压缩zza-mongo-database.zip

cd database
unzip zza-mongo-database.zip

现在我们需要找出MongoDB用于读取和写入其数据的目录的名称。 默认情况下,在Linux和OS X上为/data/db ,在Windows上为\data\db 。 但是,如果您使用软件包管理器安装了MongoDB,请检查软件包提供的/etc/mongod.conf文件以查看指定的目录。 对我来说(在Linux上)是/var/lib/mongodb

现在将文件移动到该目录:

sudo mv zza.0 zza.1 zza.ns /var/lib/mongodb/

并将文件的所有权更改为mongodb:nogroup

sudo chown mongodb:nogroup /var/lib/mongodb/zza.*

如果mongodb服务器未运行,请在指向此数据库目录的同时启动它:

sudo service mongod start

返回客户端文件夹/node/zza-node-mongo/client安装Bower软件包:

bower install

安装Bower组件后,您需要导航到服务器文件夹/node/zza-node-mongo/server并安装Node模块:

npm install

然后,从同一文件夹中启动应用服务器:

node server.js

最后一步是打开浏览器并导航到http:// localhost:3000 。 如果您看到下图,则已按照所有正确的步骤进行操作。 如果不是,请返回上述步骤以确保您正确完成了所有操作,然后查阅此页面以获取更多信息。

编写更好的查询

在检查CRUD应用程序体系结构之前,最好了解一些Breeze组件,这些组件可以帮助我们编写更好的查询。 首先要了解的是Breeze EntityManager 。 EntityManager是持久性服务的网关,并保存应用程序正在使用的实体的缓存。 这些包括已被查询,添加,更新和标记为删除的实体。

var serviceName = 'breeze/todos';
var manager = new breeze.EntityManager(serviceName);

serviceName用于查找服务端点和到Web API控制器的路由。

筛选器

使用Breeze编写查询非常简单明了。 例如,查看此查询,该查询显示2010年2月1日之后下的订单。

var query = EntityQuery.from('Orders')
.where('OrderDate', '>', new Date(2010, 1, 1))

使用Breeze编写查询的另一种好方法是通过带谓词的复合条件。 谓词是对或错的条件。 让我们将两个谓词与.and()AND运算符)结合起来AND以创建一个对两个条件都成立的表达式。

在下面的示例中,第一个谓词选择所有价格超过60美元的披萨。 第二个选择所有2015年1月15日之后下的订单。当它们与.and()结合使用时,它们会创建一个查询,该查询将选择所有价格超过60美元且在2015年1月15日之后订购的披萨。

var q1 = new Predicate('Pizza', '>;', 60);
var q2 = new Predicate('OrderDate', '>', new Date(2015, 0, 15));
var query = baseQuery.where(q1.and(q2));

排序

另一种查询类型是排序。 用于按名称降序对产品进行排序的Breeze代码如下所示。 它的代码可读性强。

var query = EntityQuery.from('Products')
.orderBy('ProductName desc');

微风分为三种类型 。 这些是单属性排序,多属性排序和相关属性排序。

分页

分页是在较小的数据子集(即页面)中返回查询结果的过程。 Breeze中的分页可以通过skip()take()两种方式完成。

为了获得以字母“ E”开头的前五个产品,我们可以执行以下操作:

var query = EntityQuery.from('Products')
.where('ProductName', 'startsWith', 'E')
.take(5)

当您不想获取指定数量的对象,而是返回剩余的对象时,将使用“跳过”。 下面的代码跳过前五个产品,并返回其余的产品。 必须将.orderBy().skip()因为许多服务器端数据服务都需.skip()

var query = EntityQuery.from('Products')
.orderBy('ProductName')
.skip(5);

投影

投影查询使您可以精确查询实际需要的实体的那些属性。 让我们看一个示例,该示例在Breeze中显示一个简单的投影,该投影返回以字母“ C”开头的客户名称。

var query = EntityQuery.from('Customers')
.where('CompanyName', 'startsWith', 'C')
.select('CompanyName');

属性投影有四种类型 :单个数据,单个导航,多个属性和相关的属性投影。

如果您想了解有关Breeze查询的更多信息,可以查阅其大量文档 。

简单的应用架构

现在,让我们回到上一部分中已启动并运行的应用程序(如果一切顺利,则仍可以在http:// localhost:3000上找到该应用程序 )。

za! 是一个CRUD应用程序,用于订购比萨饼,沙拉和饮料。 它使用BMEAN堆栈 (代表Breeze + MEAN)。

如前所述,我们感兴趣的应用程序部分( breeze.js.samples/node/zza-node-mongo )包含代表客户端,服务器和数据库的文件夹。 database文件夹包含数据库(顾名思义)。 server文件夹包含相关的Node和Express文件。 现在,让我们专注于客户端,看看client folder

这些是最重要的组件:

  • index.html此文件的大部分index.html CSS和JavaScript文件加载占用。
  • app -该文件夹包含AngularJS应用模块,它的指令,服务和意见。
  • bower在此文件夹中,您可以找到我们通过命令行在客户端安装的所有组件。
  • css所有应用程序的样式表都位于此处。
  • images -在该文件夹中可以找到应用程序的图像和字形。

index.html (这是应用程序的大门)的内部,加载了许多CSS和JavaScript文件。 在index.html的主体中有一些布局,但是大多数<script>标签会导致Angular组件,应用程序脚本,控制器和服务。

<body class="ng-cloak" data-ng-app="app">
<!--  Shell of the Sample App  -->
<div data-ui-view="header"></div>
<div id="shell-content" data-ui-view="content"></div>
<div data-ui-view="footer"></div>
<!--  Vendor Scripts  -->
...
<!--  Application scripts  -->
<script src="app/app.js"></script>  <!-- must load first -->
<script src="app/appStart.js"></script>
<!-- Feature Areas: controllers -->
...
<!-- Directives & Routing -->
...
<!-- Services -->
<script src="app/services/config.js"></script>
...
</body>

AngularJS是应用程序的强大力量。 它动态加载模板视图以及页眉和页脚。 您可能会注意到三个div标签,每个标签都有一个data-ui-view属性。 模板视图就是在这里加载的。 大多数应用程序活动都在具有id shell-contentdiv标签内进行。 这显示了订单页面,产品页面以及我们看到的大部分内容。

Breeze控制所有应用程序的数据动作和移动。 Breeze EntityManager专注于查询,缓存,更改跟踪,验证和保存实体数据。 在此应用程序中,控制器通过dataservice发出数据请求,该请求可在client/app/services/dataservice

结论

在本文中,我们讨论了Breeze.js,其功能以及一些示例查询,以演示Breeze如何简化我们作为开发人员的工作。 希望您现在对如何设置Breeze和了解示例应用程序的体系结构有了一个想法。

Breeze是一个很好的工具,因为它减少了我们需要编写的代码量,从而节省了时间并提高了生产力。 如果你们正在处理有关项目的大量数据,我强烈建议学习Breeze。 我很想在下面的评论中听到您对Breeze.js的想法。

翻译自: https://www.sitepoint.com/better-queries-with-breeze-js/

breeze.linalg

breeze.linalg_使用Breeze.js编写更好的查询相关推荐

  1. 使用Breeze.js编写更好的查询

    Agbonghama Collins对这篇文章进行了同行评审. 感谢所有SitePoint的同行评审人员使SitePoint内容达到最佳状态! 数据量正在迅速增长,并且维护变得越来越复杂. 许多开发人 ...

  2. filter vue 循环_详解在Vue.js编写更好的v-for循环的6种技巧

    在vuejs中,v-for循环是每个项目都会使用的东西,它允许您在模板代码中编写for循环. 在最基本的用法中,它们的用法如下. {{ product.name }} 但是,在本文中,我将介绍六种方法 ...

  3. 使用 ES6 编写更好的 JavaScript Part II:深入探究 [类]

    本文讲的是使用 ES6 编写更好的 JavaScript Part II:深入探究 [类], 在本文的开始,我们要说明一件事: 从本质上说,ES6 的 classes 主要是给创建老式构造函数提供了一 ...

  4. 用p5.js编写简单的动态图形——波纹扩散

    用p5.js编写简单的动态图形--波纹扩散 第一次使用p5.js写程序,如有错误请指出,多多指教. 没有下载p5.js的小伙伴可以直接使用网页版的,简单注册一个账号之后就可以保存代码啦. 网站:htt ...

  5. js array formdata_开源软件分享:一个免ROOT支持用JS编写自动化脚本的神器

    最近在逛github时发现一个不错的安卓开源项目,支持用javascript编写自动化脚本,可以模拟人工点击.滑动等一系列操作. auto.js Auto.js 简介 一个支持无障碍服务的Androi ...

  6. 第 1 节 JavaScript简介、JS的HelloWorld、JS编写位置

    第1节 JavaScript简介 JavaScript简介 实现 特点 JS的HelloWorld JS编写位置 JavaScript简介 实现 ECMAScript 是一个标准,一般情况下这两个词被 ...

  7. 开源三级联动,Vue.js编写省份、城市、区、县三级联动源码

    开源三级联动,Vue.js编写省份.城市.区.县三级联动源码 1.三级联动框样式 上图: 请访问:这里!! 查看三级联动器效果. 2.如何在html里面引用 文件的目录路径为: data.js是存放我 ...

  8. 如何编写更好的SQL查询:终极指南-第二部分

    上一篇文章中,我们学习了 SQL 查询是如何执行的以及在编写 SQL 查询语句时需要注意的地方. 下面,我进一步学习查询方法以及查询优化. 基于集合和程序的方法进行查询 反向模型中隐含的事实是,建立查 ...

  9. 如何编写更好的SQL查询:终极指南-第三部分

    本次我们学习<如何编写更好的SQL查询>系列的最后一篇文章. 时间复杂度和大O符号 通过前两篇文章,我们已经对查询计划有了一定了解.接下来,我们还可以借助计算复杂度理论,来进一步深入地挖掘 ...

最新文章

  1. ndarray维度认识及np.concatenate函数详解
  2. 我的总结SVN的使用
  3. log4j无法显示mybatis sql
  4. 6000字思考!一篇看懂促销系统的底层逻辑
  5. debian mysql开机启动_自动启动debian和lighttpd+mysql
  6. c语言编程运动会分数统计系统报告,独家稿件:定稿运动会分数统计系统设计报告_完整版...
  7. 《JavaScript模式》读书笔记一:基本技巧
  8. 服务器磁盘操作系统双机软件集成,实战:ROSE HA双机热备系统安装指南
  9. 【MySQL】MySQL warnings 的使用
  10. redis-cli批量删除时的坑
  11. 非biztalk项目的部署
  12. excel筛选排序从小到大_Excel按颜色排序或筛选
  13. 关于Layer UI表格列日期格式化及取消自动填充日期
  14. keil 不能F12跳转到定义
  15. linux命令行测试上网,如何使用linux命令行来测试网速
  16. 域名泛解析,二级域名转向问题- -完美解决
  17. android 渠道包 作用,谈谈我的Android多渠道打包方式
  18. php面试题之四——PHP面向对象(基础部分)
  19. ffmpeg通过OpenGL给视频添加下雪特效源码
  20. 计算机 dc代表什么意思,dc和ac代表什么意思

热门文章

  1. 项目团队如何有效沟通?
  2. 量化投资学习-38:通过非线性函数的极值看股市的运行规律
  3. 百度校园招聘---(部分)
  4. 分离单词,瓦尔登英语单词出现频率
  5. 连接小皮PhpStudy数据库
  6. SAP JCO 配置
  7. Chrome模拟平板调试
  8. ColorTextView(随视频帧变化颜色的TextView)
  9. ExoPlayer之seekto掉帧解决办法
  10. 2022中国国潮发展新动向