JS系列——Linq to js使用小结

以你之姓@ 2022-07-13 02:54 191阅读 0赞

前言：前面几篇介绍了下C\#基础技术中的几个：[反射][Link 1]、[特性][Link 2]、[泛型][Link 3]、[序列化][Link 4]、[扩展方法][Link 5]、[Linq to Xml][]等，本来还有两三个知识点没有写完，比如委托、多线程、异步等，后面会陆续将它们补起来，以便作为一套完整的系列。之所以有这篇是因为目前BS项目中前端经常需要对Json的数组对象进行筛选、查找、判断是否存在等操作。这时就想到了好用的Linq。博主几年前用过Linq to js，那个时候还觉得那样写很别扭，于是没有重视。现在随着前段业务的越来越复杂，对前端的数据处理要求也越来越高，使用一种快捷的集合操作方式就变得越来越必要。今天正好趁系统升级Win 10，所以在此做个小结，以后也可以留着当文档使用。O(∩\_∩)O~

1、什么是Linq to js :C\# 3.0推出了.Net独有的新特性：Linq。自从有了Linq，程序员再也不用担心对集合的操作了。同理，Linq to js 当然也就是对前端集合变量进行操作的一种技术框架。

2、怎么使用：因为是前端框架，所以你懂得，只需要引用一个js文件即可。这里还是附上官网地址：[http://jslinq.codeplex.com/][http_jslinq.codeplex.com].这上面有文件和Demo，可以上去看看。使用方式主要有两种：使用方法一、直接引用js文件；使用方法二、使用Nuget Package 安装Linq to js。在PM安装控制台中输入Install-Package jslinq。

本篇以Linq to js的lamada表达式写法的方式来以此介绍常用方法。我们从官网上面下载下载的文件如下图

![301151172517162.png][]

我们只需要引用linq.js文件即可。

（1）条件查询：Where

![复制代码][copycode.gif]

var myList = [
                { Name: "Jim", Age: 20 },
                { Name: "Kate", Age: 21 },
                { Name: "Lilei", Age: 18 },
                { Name: "John", Age: 14 },
                { Name: "LinTao", Age: 25 }
        ];
        var arrRes = Enumerable.From(myList).Where("x=>x.Name=='Jim'").ToArray();

![复制代码][copycode.gif]

arrRes的结果为 \[\{"Name":"Jim","Age":20\}\]

我们来看看这种写Lamada表达式的原型：

var arrRes = Enumerable.From(myList).Where(function (i) { return i.Name=='Jim'; });

参数i是对应的集合里面的实体模型，返回类型为bool类型。有没有和C\#里面的扩展函数Where的定义很像：public static IEnumerable<TSource> Where<TSource>(this IEnumerable<TSource> source, Func<TSource, bool> predicate);参数Func<TSource, bool> predicate为匿名委托，需要传入实体模型TSource，然后返回值为bool类型。其实感觉linq to js的使用就是参照c\#里面的定义来的。

（2）条件选择：Select

![复制代码][copycode.gif]

arrRes得到结果 \[200,210,180,140,250\]

（3）排序、去重：OrderBy、Distinct

![复制代码][copycode.gif]

得到的结果会按照Age排序。

![复制代码][copycode.gif]

var myList = [
                { Name: "Jim", Age: 20 },
                { Name: "Kate", Age: 20 },
                { Name: "Lilei", Age: 20 },
                { Name: "John", Age: 14 },
                { Name: "LinTao", Age: 25 }
        ];
        var arrRes = Enumerable.From(myList).Distinct("x=>x.Age").ToArray();

![复制代码][copycode.gif]

得到的结果集合的数量为3个：\[ \{ Name: "Jim", Age: 20 \}, \{ Name: "John", Age: 14 \}, \{ Name: "LinTao", Age: 25 \}\]。

（4）遍历：ForEach

![复制代码][copycode.gif]

![复制代码][copycode.gif]

很显然两个参数：一个是值，另一个是当前索引

（5）取唯一对象：First、FirstOrDefault、Last、LastOrDefault、Single、SingleOrDefault

![复制代码][copycode.gif]

var myList = [
                { Name: "Jim", Age: 20 },
                { Name: "Kate", Age: 20 },
                { Name: "Lilei", Age: 20 },
                { Name: "John", Age: 14 },
                { Name: "LinTao", Age: 25 }
        ];
    
        var arrRes = Enumerable.From(myList).FirstOrDefault("x=>x.Age>18");

![复制代码][copycode.gif]

其他几个用法和这个类似。这个没什么好说的。

（6）Skip、Take

Enumerable.Range(1,10).Skip(5)//结果[6,7,8,9,10]
    Enumerable.Range(1,10).Take(5)//结果[1,2,3,4,5]

（7）取交集、取差集、合并

var array1 = [1,412,5,3,5,412,7];
    var array2 = [20,12,5,5,7,310];
    Enumerable.From(array1).Except(array2)
    //结果3,412,1

var array1 = [1,412,5,3,5,412,7];
    var array2 = [20,12,5,5,7,310];
    Enumerable.From(array1).Intersect(array2)
    //结果5,7

var array1 = [1,412,5,3,5,412,7];
    var array2 = [20,12,5,5,7,310];
    Enumerable.From(array1).Union(array2)
    //结果是两个结果集里面所有值，并自动去重

当然还有其他一些不常用的方法。有兴趣可以查看文档。其实linq to js还有一种支持jquery的写法。如下：

Enumerable.Range(1,10).Where("$%2==0")
    //等价于
    Enumerable.Range(1,10).Where("x=>x%2==0")

但引用文件的时候需要引用jquery.linq.js这个文件。就是写法不同，效果完全一样，选哪一种就是习惯问题了。博主更加倾向lamada方式的写法，因为和C\#用法可以保持一致。

我把网上下载的文档传了一份到博客园上面：[linq.js\_ver2.2.0.2.rar][linq.js_ver2.2.0.2.rar]

[Link 1]: http://www.cnblogs.com/landeanfen/p/4642814.html
[Link 2]: http://www.cnblogs.com/landeanfen/p/4642819.html
[Link 3]: http://www.cnblogs.com/landeanfen/p/4642820.html
[Link 4]: http://www.cnblogs.com/landeanfen/p/4627383.html
[Link 5]: http://www.cnblogs.com/landeanfen/p/4632467.html
[Linq to Xml]: http://www.cnblogs.com/landeanfen/p/4636102.html
[http_jslinq.codeplex.com]: http://jslinq.codeplex.com/
[301151172517162.png]: /images/20220713/cdabf12543c74eec848576e898039989.png
[copycode.gif]: /images/20220713/674bd8813b2641a1a4411bba5606025b.png
[linq.js_ver2.2.0.2.rar]: http://files.cnblogs.com/files/landeanfen/linq.js_ver2.2.0.2.rar