如何使用 array.filter() 方法过滤 JavaScript 数组?

我有一个 JavaScript 对象 ( filters),它具有布尔值。我还有一个对象数组 ( mainSubArray)。基于 JavaScript Object,filteredArray如果布尔值为真,我想返回一个新数组 ( ),如果布尔值为假,我想不返回新数组。


到目前为止,我已经尝试了以下方法:


// The main array that needs to be filtered

const mainSubArray = [{

    MenB_Classification: "NOT Required",

    CONTROL: "Public",

    Enrollment: "892"

  },

  {

    MenB_Classification: "Required",

    CONTROL: "Private",

    Enrollment: "1601"

  },

  {

    MenB_Classification: "NOT Required",

    CONTROL: "Private",

    Enrollment: "447"

  },

  {

    MenB_Classification: "NOT Required",

    CONTROL: "Public",

    Enrollment: "1203"

  },

  {

    MenB_Classification: "Required",

    CONTROL: "Private",

    Enrollment: "32"

  },

  {

    MenB_Classification: "NOT Required",

    CONTROL: "Public",

    Enrollment: "98"

  },

  {

    MenB_Classification: "Recommended",

    CONTROL: "Private",

    Enrollment: "654"

  },

  {

    MenB_Classification: "NOT Required",

    CONTROL: "Private",

    Enrollment: "345318"

  },

  {

    MenB_Classification: "NOT Required",

    CONTROL: "Private",

    Enrollment: "13324"

  },

  {

    MenB_Classification: "Recommended",

    CONTROL: "Private",

    Enrollment: "39"

  },

  {

    MenB_Classification: "NOT Required",

    CONTROL: "Private",

    Enrollment: "4"

  },

  {

    MenB_Classification: "NOT Required",

    CONTROL: "Private",

    Enrollment: "910"

  },

  {

    MenB_Classification: "NOT Required",

    CONTROL: "Private",

    Enrollment: "23453"

  }

]



// Object with boolean values

var filters = {

  required: true,

  recomended: true,

  notRequired: false,

  publics: true,

  privates: true,

  ennrollmentOne: true,

  ennrollmentTwo: false,

  ennrollmentThree: false,

  ennrollmentFour: false,

}


// New Array using array.filter() method

var filteredArray = mainSubArray.filter(function(d) {

    return true;

  } else {

    return false;

  }


});


console.log(filteredArray);


当 I 时console.log(filteredArray),我取回原始数组。


输出应该是一个新数组,其中只有filters对象中设置为 true 的值。


犯罪嫌疑人X
浏览 218回答 3
3回答

蛊毒传说

您可以使用一组字符串作为过滤器对象的键,并根据函数检查对象的所需键及其所需值。在过滤器函数中,如果需要一个函数并且结果是 ,则迭代关键函数数组并提前退出true。结果是来自原始 13 个对象的 12 个对象的数组。var data = [{ MenB_Classification: "NOT Required", CONTROL: "Public", Enrollment: "892" }, { MenB_Classification: "Required", CONTROL: "Private", Enrollment: "1601" }, { MenB_Classification: "NOT Required", CONTROL: "Private", Enrollment: "447" }, { MenB_Classification: "NOT Required", CONTROL: "Public", Enrollment: "1203" }, { MenB_Classification: "Required", CONTROL: "Private", Enrollment: "32" }, { MenB_Classification: "NOT Required", CONTROL: "Public", Enrollment: "98" }, { MenB_Classification: "Recommended", CONTROL: "Private", Enrollment: "654" }, { MenB_Classification: "NOT Required", CONTROL: "33033764030", Enrollment: "345318" }, { MenB_Classification: "NOT Required", CONTROL: "Private", Enrollment: "13324" }, { MenB_Classification: "Recommended", CONTROL: "Private", Enrollment: "39" }, { MenB_Classification: "NOT Required", CONTROL: "Private", Enrollment: "4" }, { MenB_Classification: "NOT Required", CONTROL: "Private", Enrollment: "910" }, { MenB_Classification: "NOT Required", CONTROL: "Private", Enrollment: "23453" }],&nbsp; &nbsp; filters = {&nbsp; &nbsp; &nbsp; &nbsp; required: true,&nbsp; &nbsp; &nbsp; &nbsp; recomended: true,&nbsp; &nbsp; &nbsp; &nbsp; notRequired: false,&nbsp; &nbsp; &nbsp; &nbsp; publics: true,&nbsp; &nbsp; &nbsp; &nbsp; privates: true,&nbsp; &nbsp; &nbsp; &nbsp; ennrollmentOne: true,&nbsp; &nbsp; &nbsp; &nbsp; ennrollmentTwo: false,&nbsp; &nbsp; &nbsp; &nbsp; ennrollmentThree: false,&nbsp; &nbsp; &nbsp; &nbsp; ennrollmentFour: false,&nbsp; &nbsp; },&nbsp; &nbsp; fn = [&nbsp; &nbsp; &nbsp; &nbsp; ['required', o => o.MenB_Classification === 'Required'],&nbsp; &nbsp; &nbsp; &nbsp; ['recomended', o => o.MenB_Classification === 'Recommended'],&nbsp; &nbsp; &nbsp; &nbsp; ['notRequired', o => o.MenB_Classification === 'NOT Required'],&nbsp; &nbsp; &nbsp; &nbsp; ['publics', o => o.CONTROL === 'Public'],&nbsp; &nbsp; &nbsp; &nbsp; ['privates', o => o.CONTROL === 'Private'],&nbsp; &nbsp; &nbsp; &nbsp; ['ennrollmentOne', o => o.Enrollment < 100],&nbsp; &nbsp; &nbsp; &nbsp; ['ennrollmentTwo', o => o.Enrollment >= 100 && o.Enrollment < 1000],&nbsp; &nbsp; &nbsp; &nbsp; ['ennrollmentThree', o => o.Enrollment >= 1000 && o.Enrollment < 5000],&nbsp; &nbsp; &nbsp; &nbsp; ['ennrollmentFour', o => o.Enrollment >= 5000]&nbsp; &nbsp; ],&nbsp; &nbsp; result = data.filter(o => fn.some(([k, f]) => filters[k] && f(o)));console.log(result);.as-console-wrapper { max-height: 100% !important; top: 0; }

隔江千里

它有效,但您的条件几乎涵盖了所有情况。即使在您的情况下,它也能工作,因为结果包含 12 个元素而不是 13 个。它不包含:{&nbsp; &nbsp; MenB_Classification: "NOT Required",&nbsp; &nbsp; CONTROL: "33033764030",&nbsp; &nbsp; Enrollment: "345318"&nbsp; },

慕的地6264312

我假设你想这样做:var data = [{ MenB_Classification: "NOT Required", CONTROL: "Public", Enrollment: "892" }, { MenB_Classification: "Required", CONTROL: "Private", Enrollment: "1601" }, { MenB_Classification: "NOT Required", CONTROL: "Private", Enrollment: "447" }, { MenB_Classification: "NOT Required", CONTROL: "Public", Enrollment: "1203" }, { MenB_Classification: "Required", CONTROL: "Private", Enrollment: "32" }, { MenB_Classification: "NOT Required", CONTROL: "Public", Enrollment: "98" }, { MenB_Classification: "Recommended", CONTROL: "Private", Enrollment: "654" }, { MenB_Classification: "NOT Required", CONTROL: "33033764030", Enrollment: "345318" }, { MenB_Classification: "NOT Required", CONTROL: "Private", Enrollment: "13324" }, { MenB_Classification: "Recommended", CONTROL: "Private", Enrollment: "39" }, { MenB_Classification: "NOT Required", CONTROL: "Private", Enrollment: "4" }, { MenB_Classification: "NOT Required", CONTROL: "Private", Enrollment: "910" }, { MenB_Classification: "NOT Required", CONTROL: "Private", Enrollment: "23453" }],&nbsp; &nbsp; filters = {&nbsp; &nbsp; &nbsp; &nbsp; required: true,&nbsp; &nbsp; &nbsp; &nbsp; recomended: true,&nbsp; &nbsp; &nbsp; &nbsp; notRequired: false,&nbsp; &nbsp; &nbsp; &nbsp; publics: true,&nbsp; &nbsp; &nbsp; &nbsp; privates: true,&nbsp; &nbsp; &nbsp; &nbsp; ennrollmentOne: true,&nbsp; &nbsp; &nbsp; &nbsp; ennrollmentTwo: false,&nbsp; &nbsp; &nbsp; &nbsp; ennrollmentThree: false,&nbsp; &nbsp; &nbsp; &nbsp; ennrollmentFour: false,&nbsp; &nbsp; },&nbsp; &nbsp; filteredArray = data.filter(function (d) {&nbsp; &nbsp; &nbsp; return ( // check MenB_Classification&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;(filters.required && d.MenB_Classification === "Required")&nbsp; &nbsp; &nbsp; &nbsp; || (filters.recomended && d.MenB_Classification === "Recommended")&nbsp; &nbsp; &nbsp; &nbsp; || (filters.notRequired && d.MenB_Classification === "NOT Required")&nbsp; &nbsp; &nbsp; ) && ( // check CONTROL&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;(filters.publics && d.CONTROL === "Public")&nbsp; &nbsp; &nbsp; &nbsp; || (filters.privates && d.CONTROL === "Private")&nbsp; &nbsp; &nbsp; ) && ( // check Enrollment&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;(filters.ennrollmentOne && d.Enrollment < 100)&nbsp; &nbsp; &nbsp; &nbsp; || (filters.ennrollmentTwo && d.Enrollment >= 100 && d.Enrollment < 1000)&nbsp; &nbsp; &nbsp; &nbsp; || (filters.ennrollmentThree && d.Enrollment >= 1000 && d.Enrollment < 5000)&nbsp; &nbsp; &nbsp; &nbsp; || (filters.ennrollmentFour && d.Enrollment > 5000)&nbsp; &nbsp; &nbsp; );&nbsp; &nbsp; });console.log(filteredArray);这里有一个更详细的版本。我已将过滤器分离为每个属性的一个函数:我不知道这是否与您相关,但我还添加了没有为属性设置过滤器的情况。function filterByClassification(d){&nbsp; &nbsp; return (filters.required && d.MenB_Classification === "Required")&nbsp; &nbsp; &nbsp; &nbsp; || (filters.recomended && d.MenB_Classification === "Recommended")&nbsp; &nbsp; &nbsp; &nbsp; || (filters.notRequired && d.MenB_Classification === "NOT Required")&nbsp; &nbsp; &nbsp; &nbsp; // or no filter set for MenB_Classification&nbsp; &nbsp; &nbsp; &nbsp; || (!filters.required && !filters.recomended && !filters.notRequired);}function filterByControl(d){&nbsp; &nbsp; return (filters.publics && d.CONTROL === "Public")&nbsp; &nbsp; &nbsp; &nbsp; || (filters.privates && d.CONTROL === "Private")&nbsp; &nbsp; &nbsp; &nbsp; // or no filter set for CONTROL&nbsp; &nbsp; &nbsp; &nbsp; || (!filters.publics && !filters.privates);}function filterByEnrollment(d){&nbsp; &nbsp; return (filters.ennrollmentOne && d.Enrollment < 100)&nbsp; &nbsp; &nbsp; &nbsp; || (filters.ennrollmentTwo && d.Enrollment >= 100 && d.Enrollment < 1000)&nbsp; &nbsp; &nbsp; &nbsp; || (filters.ennrollmentThree && d.Enrollment >= 1000 && d.Enrollment < 5000)&nbsp; &nbsp; &nbsp; &nbsp; || (filters.ennrollmentFour && d.Enrollment > 5000)&nbsp; &nbsp; &nbsp; &nbsp; // or no filter set for Enrollment&nbsp; &nbsp; &nbsp; &nbsp; || (!filters.ennrollmentOne && !filters.ennrollmentTwo && !filters.ennrollmentThree && !filters.ennrollmentFour);&nbsp;}filteredArray = data.filter(function (d) {&nbsp; &nbsp; // for every property, there must be one filter fulfilled&nbsp; &nbsp; return filterByClassification(d)&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; && filterByControl(d)&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; && filterByEnrollment(d);});而您的代码相当于:filteredArray = data.filter(function (d) {&nbsp; &nbsp; // if any condition at all is fulfilled, keep the item&nbsp; &nbsp; return filterByClassification(d)&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; || filterByControl(d)&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; || filterByEnrollment(d);});`
打开App,查看更多内容
随时随地看视频慕课网APP

相关分类

JavaScript