要件: バックエンドから渡されるデータが多すぎるため、フロントエンドは配列内の特定の値の最大値と最小値を計算する必要があります。最も一般的に使用される方法は、トラバーサル後に比較するか、 sortメソッドなど同僚に教えてもらいました配列オブジェクトの最大値と最小値を一文で取得できますそれはlinq プラグインを使うことですとても使いやすく、使い方はとても簡単なのでシェアさせていただきます〜
1. 配列オブジェクトのプロパティの最大値と最小値を見つける
方法 1、linq プラグインを使用する
1.1 まずはダウンロード
npm install linq -S1.2 インポートは、独自のニーズに応じてローカルまたはグローバルに行うことができます
import Enumerable from 'linq';1.3 使用方法
const items: [
{ id: 0, value: -5 },
{ id: 1, value: 10 },
{ id: 2, value: -15 },
{ id: 3, value: 44 },
{ id: 4, value: 44 },
{ id: 5, value: -5 }
],
// 筛选最大值和最小值
const min = Enumerable.from(this.items).min(item => item.value);
const max = Enumerable.from(this.items).max(item => item.value);
方法 2、数学を使用して実装します。この方法は良くないため、スクリーニングする必要があります。
let arr=[2,4,56,5,7,33];
var obj=Math.max.apply(null,arr);
var min=Math.min.apply(null,arr);
console.log(obj,'最大值')
console.log(min,'最大值')2. 条件に応じて必要な値をフィルタリングします
// 条件筛选出偶数，得到的值一定是满足where中条件的
const arr = [1, 2, 3, 4, 5];
this.result = Enumerable.from(arr)
.where(x => x % 2 === 0)
.toArray();
console.log(this.result); // [2, 4]3. 配列オブジェクトの重複排除
const items= [
{ id: 0, value: -5 },
{ id: 1, value: 10 },
{ id: 2, value: -15 },
{ id: 3, value: 44 },
{ id: 4, value: 44 },
{ id: 5, value: -5 }
// { id: 3, value: "-220" }
],
// linq的去重
this.quchong = Enumerable.from(this.items)
.distinct(item => item.value)
.toArray();
4. 特定の値をフィルタリングしてクエリします。これはフィルタの機能です。
// 筛选查询特定的值
this.select = Enumerable.from(this.items)
.select(item => item.value)
.toArray();
5. 昇順および降順機能
var myList = [
{ Name: 'Jim', Age: 20 },
{ Name: 'Kate', Age: 21 },
{ Name: 'Lilei', Age: 18 },
{ Name: 'John', Age: 14 },
{ Name: 'LinTao', Age: 25 }
];
this.orderByup = Enumerable.from(this.items)
.orderBy(x => x.value)
.toArray(); //升序
this.orderBydown = Enumerable.from(myList)
.orderByDescending(x => x.Age)
.toArray(); //降序
6. 完全なサンプルコード
<template>
<div class="content-box">
<div class="container">
<span>原数组{
{ items }}</span>
<br />
<span>最小值：{
{ min }}，最大值：{
{ max }}</span>
<br />
<span>筛选后的值{
{ result }}</span>
<br />
<span>去重后的数组{
{ quchong }}</span>
<br />
<span>只要value的值{
{ select }}</span>
<br />
<span>升序:{
{ orderByup }}</span>
<br />
降序：{
{ orderBydown }}
</div>
</div>
</template>
<script>
import Enumerable from 'linq';
export default {
data() {
return {
items: [
{ id: 0, value: -5 },
{ id: 1, value: 10 },
{ id: 2, value: -15 },
{ id: 3, value: 44 },
{ id: 4, value: 44 },
{ id: 5, value: -5 }
// { id: 3, value: "-220" }
],
min: 0,
max: 0,
result: [],
quchong: [],
select: [],
groupBy: [],
orderByup: [],
orderBydown: []
};
},
mounted() {
this.query();
},
methods: {
query() {
// 筛选最大值和最小值
this.min = Enumerable.from(this.items).min(item => item.value);
this.max = Enumerable.from(this.items).max(item => item.value);
// 条件筛选出偶数，得到的值一定是满足where中条件的
const arr = [1, 2, 3, 4, 5];
this.result = Enumerable.from(arr)
.where(x => x % 2 === 0)
.toArray();
console.log(this.result); // [2, 4]
// linq的去重
this.quchong = Enumerable.from(this.items)
.distinct(item => item.value)
.toArray();
// 筛选查询特定的值
this.select = Enumerable.from(this.items)
.select(item => item.value)
.toArray();
// 分组
var myList = [
{ Name: 'Jim', Age: 20 },
{ Name: 'Kate', Age: 21 },
{ Name: 'Lilei', Age: 18 },
{ Name: 'John', Age: 14 },
{ Name: 'LinTao', Age: 25 }
];
this.orderByup = Enumerable.from(this.items)
.orderBy(x => x.value)
.toArray(); //升序
this.orderBydown = Enumerable.from(myList)
.orderByDescending(x => x.Age)
.toArray(); //降序
var array1 = [1, 412, 5, 3, 5, 412, 7];
var array2 = [20, 12, 5, 5, 7, 310];
const except = Enumerable.from(array1).except(array2).toArray(); //结果3,412,1
console.log(except, '取差集，差集就是俩个数组中不相同的值');
var array1 = [1, 412, 5, 3, 5, 412, 7];
var array2 = [20, 12, 5, 5, 7, 310];
const intersect = Enumerable.from(array1).intersect(array2).toArray();
//结果5,7
console.log(intersect, '取交集，交集就是俩个数组相同的值');
}
}
};
</script>
<style lang="scss" scoped></style>
一般的に使用される方法はこれですべてです。他にも自分で探索できる方法がいくつかあります。これで記事は終わりです。お役に立てば幸いです。