()filter.

          ابن حسام 
            بازدید : 97
          یکشنبه 03 شهریور 1398
           نظرات (0)
        

چه می‌شود اگر آرایه‌ای داشته باشیم که تنها به برخی از عناصر آن نیاز داشته باشیم؟ همین جا است که ()filter. به کار می‌آید. داده‌های ما به صورت زیر هستند:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22

varpilots=[
  {
    id:2,
    name:"Wedge Antilles",
    faction:"Rebels",
  },
  {
    id:8,
    name:"Ciena Ree",
    faction:"Empire",
  },
  {
    id:40,
    name:"Iden Versio",
    faction:"Empire",
  },
  {
    id:66,
    name:"Thane Kyrell",
    faction:"Rebels",
  }
];

فرض کنید می‌خواهیم دو آرایه داشته باشیم که یکی برای خلبان‌های تازه‌کار و دیگری برای خلبان‌های کهنه‌کار است. انجام این کار با استفاده از ()filter. بسیار آسان است:

1
2
3
4
5
6

varrebels=pilots.filter(function(pilot){
  returnpilot.faction==="Rebels";
});
varempire=pilots.filter(function(pilot){
  returnpilot.faction==="Empire";
});

به همین سادگی این کار را انجام دادیم. با استفاده از تابع‌های Arrow از این هم ساده‌تر می‌شود:

1
2

constrebels=pilots.filter(pilot=>pilot.faction==="Rebels");
constempire=pilots.filter(pilot=>pilot.faction==="Empire");

اگر تابع callback مقدار true بازمی‌گرداند، عنصر کنونی در آرایه حاصل خواهد بود؛ اما اگر مقدار بازگشتی false باشد نخواهد بود.

ترکیب ()map() ، .reduce. و ()filter.

از آنجا که هر سه این متدها روی آرایه استفاده می‌شوند و ()map. و ()filter. مقدار آرایه‌ای بازمی‌گردانند، ما می‌توانیم فراخوانی‌های خود را به سادگی زنجیره‌سازی کنیم. در ادامه مثال دیگری را بررسی می‌کنیم. داده‌های ما چنین است:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37

varpersonnel=[
  {
    id:5,
    name:"Luke Skywalker",
    pilotingScore:98,
    shootingScore:56,
    isForceUser:true,
  },
  {
    id:82,
    name:"Sabine Wren",
    pilotingScore:73,
    shootingScore:99,
    isForceUser:false,
  },
  {
    id:22,
    name:"Zeb Orellios",
    pilotingScore:20,
    shootingScore:59,
    isForceUser:false,
  },
  {
    id:15,
    name:"Ezra Bridger",
    pilotingScore:43,
    shootingScore:67,
    isForceUser:true,
  },
  {
    id:11,
    name:"Caleb Dume",
    pilotingScore:71,
    shootingScore:85,
    isForceUser:true,
  },
];

هدف ما این است که امتیاز کلی نیروهای نظامی را به دست آوریم. این کار را گام به گام اجرا می‌کنیم. ابتدا باید کارکنانی که نمی‌توانند در نیروی نظامی استفاده شوند را حذف کنیم:

1
2
3
4

varjediPersonnel=personnel.filter(function(person){
  returnperson.isForceUser;
});
// Result: [{...}, {...}, {...}] (Luke, Ezra and Caleb)

بدین ترتیب سه عنصر در آرایه حاصل باقی می‌ماند. ما باید یک آرایه شامل امتیاز کلی هر نیرو ایجاد کنیم:

1
2
3
4

varjediScores=jediPersonnel.map(function(jedi){
  returnjedi.pilotingScore+jedi.shootingScore;
});
// Result: [154, 110, 156]

همچنین از reduce برای دریافت امتیاز کلی استفاده می‌کنیم:

1
2
3
4

vartotalJediScore=jediScores.reduce(function(acc,score){
  returnacc+score;
},0);
// Result: 420

اکنون به بخش جذاب ماجرا می‌رسیم. ما می‌توانیم همه این موارد را به صورت زنجیره‌ای در یک خط کد اجرا کنیم:

1
2
3
4
5
6
7
8
9
10

vartotalJediScore=personnel
  .filter(function(person){
    returnperson.isForceUser;
  })
  .map(function(jedi){
    returnjedi.pilotingScore+jedi.shootingScore;
  })
  .reduce(function(acc,score){
    returnacc+score;
  },0);

با استفاده از تابع‌های arrow بسیار جذاب‌تر به نظر می‌رسد:

1
2
3
4

consttotalJediScore=personnel
  .filter(person=>person.isForceUser)
  .map(jedi=>jedi.pilotingScore+jedi.shootingScore)
  .reduce((acc,score)=>acc+score,0);

دقت کنید که در مثال قبلی ()map. و ()filter. ضروری نبودند. ما می‌توانیم به سادگی همین نتیجه را تنها با ()reduce. به دست آوریم. ما آن‌ها را صرفاً به منظور ارائه مثال آنجا قرار داده‌ایم. آیا می‌توانید حدس بزنید که چگونه صرفاً با حفظ ()reduce. می‌توانیم همین نتیجه را با تنها یک خط کد به دست آوریم؟