Как Переберите массив объектов и проверить, если значение соответствует либо строку в объект или значение в массиве элементов с помощью lodash

У меня есть массив объектов, который выглядит примерно так:Как Переберите массив объектов и проверить, если значение соответствует либо строку в объект или значение в массиве элементов с помощью lodash

[{ 
    "title": "first footer", 
    "section": "structure", 
    "categoryId": "footer", 
    "image": "http://placehold.it/350x220", 
    "hashtags": ["#popin", "#wobble"], 
    "uId": "footerA" 
    },{ 
    "title": "second footer", 
    "section": "structure", 
    "categoryId": "footer", 
    "image": "http://placehold.it/350x220", 
    "hashtags": ["#popin", "#wibble"], 
    "uId": "footerB" 
    }, 
    { 
    "title": "first header", 
    "section": "structure", 
    "categoryId": "header", 
    "image": "http://placehold.it/350x220", 
    "hashtags": ["#popin", "#wibble"], 
    "uId": "headerA" 
    }, 
    { 
    "title": "second header", 
    "section": "structure", 
    "categoryId": "header", 
    "image": "http://placehold.it/350x220", 
    "hashtags": ["#popin", "#wibble"], 
    "uId": "headerB" 
    }, 
    { 
    "title": "first landing", 
    "section": "structure", 
    "categoryId": "landing", 
    "image": "http://placehold.it/350x220", 
    "hashtags": ["#popin", "#wibble"], 
    "uId": "landingA" 
    }, 
    { 
    "title": "second landing", 
    "section": "structure", 
    "categoryId": "landing", 
    "image": "http://placehold.it/350x220", 
    "hashtags": ["#popin", "#wibble"], 
    "uId": "landingB" 
    }, 
    { 
    "title": "third landing", 
    "section": "structure", 
    "categoryId": "landing", 
    "image": "http://placehold.it/350x220", 
    "hashtags": ["#popin", "#wibble"], 
    "uId": "landingC" 
    }, 
    { 
    "title": "first nav", 
    "section": "structure", 
    "categoryId": "navigation", 
    "image": "http://placehold.it/350x220", 
    "hashtags": ["#popin", "#wobble"], 
    "uId": "navA" 
    },{ 
    "title": "first blog", 
    "section": "components", 
    "categoryId": "blog", 
    "image": "http://placehold.it/350x220", 
    "hashtags": ["#popin", "#wibble"], 
    "uId": "blogA" 
    }, 
    { 
    "title": "second blog sdf wicked", 
    "section": "components", 
    "categoryId": "blog", 
    "image": "http://placehold.it/350x220", 
    "hashtags": ["#popin", "#wibble"], 
    "uId": "blogB" 
    }, 
    { 
    "title": "first header", 
    "section": "components", 
    "categoryId": "contact_button", 
    "image": "http://placehold.it/350x220", 
    "hashtags": ["#popin", "#wibble"], 
    "uId": "contact_buttonA" 
    }, 
    { 
    "title": "first landing", 
    "section": "components", 
    "categoryId": "content_bloc", 
    "image": "http://placehold.it/350x220", 
    "hashtags": ["#popin", "#wibble"], 
    "uId": "content_blocA" 
    }, 
    { 
    "title": "second landing", 
    "section": "components", 
    "categoryId": "content_bloc", 
    "image": "http://placehold.it/350x220", 
    "hashtags": ["#popin", "#wibble"], 
    "uId": "content_blocB" 
    }, 
    { 
    "title": "third landing", 
    "section": "components", 
    "categoryId": "content_bloc", 
    "image": "http://placehold.it/350x220", 
    "hashtags": ["#popin", "#wibble"], 
    "uId": "content_blocC" 
    }, 
    { 
    "title": "first nav", 
    "section": "components", 
    "categoryId": "cover", 
    "image": "http://placehold.it/350x220", 
    "hashtags": ["#popin", "#wibble"], 
    "uId": "coverA" 
    }]

Когда я нажимаю кнопку, я хочу, чтобы иметь возможность фильтровать объекты в массиве, чтобы возвращать только согласованные объекты, которые кто-то искал. Например, если кто-то набрал «землю», функция должна проверить, существует ли «земля» в названии компонента или существует в массиве hashtags этого компонента.

Я использую lodash для этого, поэтому хотел бы продолжать использовать это.

Я смог выполнить тест для названия, но зациклился на том, как циклически перебирать массив hashtags при просмотре одного компонента в цикле.

Это мой код до сих пор:

_.filter(this.components, function (component) { 
    //Check if components title has 'wic' in the text or if 'wic' exists in the hashtags array 
    if(_.includes(component.title, 'wic')) { 
    console.log(component); 
    } 

});

источник

2016-11-14 saunders

Вернуть Boolean из Array.prototype.filter(). Вы можете использовать Array.prototype.some(), который также ожидает возвращаемое значение Boolean, чтобы проверить массив hashtags.

var match = "land"; 
var re = new RegExp(match); 
var res = this.components.filter(function(component) { 
    return re.test(component.title) 
     || component.hashtags.some(function(tag) { 
       return re.test(tag) 
      }) 
});

использованием lodash _.filter(), _.some()

var match = "land"; 
var re = new RegExp(match); 
var res = _.filter(this.components, function(component) { 
console.log(component.title, re.test(component.title)) 
    return re.test(component.title) 
     || _.some(component.hashtags, function(tag) { 
       return re.test(tag) 
      }) 
});

jsfiddle https://jsfiddle.net/o8ervt0x/

источник

2016-11-14 10:22:03 guest271314

Привет, это работает, но было интересно, можем ли мы использовать lodash, поскольку я использовал его на других моих страницах и хочу сохранить согласованность. – saunders

@saunders _ «это действительно работает, но было интересно, можем ли мы использовать lodash» _ Почему нужна библиотека? '.filter()' и '.some()' определены в 'Array.prototype' – guest271314

Я изучаю loadash и хочу сохранить согласованность в том, как я выполняю эти типы функций, поскольку у меня уже есть другие, написанные на lodash, поэтому хочу сохранить согласованность – saunders

это даст объект, который имеет land слово в их названии

savedViews= [{ 
 
    "title": "first footer", 
 
    "section": "structure", 
 
    "categoryId": "footer", 
 
    "image": "http://placehold.it/350x220", 
 
    "hashtags": ["#popin", "#wobble"], 
 
    "uId": "footerA" 
 
    },{ 
 
    "title": "second footer", 
 
    "section": "structure", 
 
    "categoryId": "footer", 
 
    "image": "http://placehold.it/350x220", 
 
    "hashtags": ["#popin", "#wibble"], 
 
    "uId": "footerB" 
 
    }, 
 
    { 
 
    "title": "first header", 
 
    "section": "structure", 
 
    "categoryId": "header", 
 
    "image": "http://placehold.it/350x220", 
 
    "hashtags": ["#popin", "#wibble"], 
 
    "uId": "headerA" 
 
    }, 
 
    { 
 
    "title": "second header", 
 
    "section": "structure", 
 
    "categoryId": "header", 
 
    "image": "http://placehold.it/350x220", 
 
    "hashtags": ["#popin", "#wibble"], 
 
    "uId": "headerB" 
 
    }, 
 
    { 
 
    "title": "first landing", 
 
    "section": "structure", 
 
    "categoryId": "landing", 
 
    "image": "http://placehold.it/350x220", 
 
    "hashtags": ["#popin", "#wibble"], 
 
    "uId": "landingA" 
 
    }, 
 
    { 
 
    "title": "second landing", 
 
    "section": "structure", 
 
    "categoryId": "landing", 
 
    "image": "http://placehold.it/350x220", 
 
    "hashtags": ["#popin", "#wibble"], 
 
    "uId": "landingB" 
 
    }, 
 
    { 
 
    "title": "third landing", 
 
    "section": "structure", 
 
    "categoryId": "landing", 
 
    "image": "http://placehold.it/350x220", 
 
    "hashtags": ["#popin", "#wibble"], 
 
    "uId": "landingC" 
 
    }, 
 
    { 
 
    "title": "first nav", 
 
    "section": "structure", 
 
    "categoryId": "navigation", 
 
    "image": "http://placehold.it/350x220", 
 
    "hashtags": ["#popin", "#wobble"], 
 
    "uId": "navA" 
 
    },{ 
 
    "title": "first blog", 
 
    "section": "components", 
 
    "categoryId": "blog", 
 
    "image": "http://placehold.it/350x220", 
 
    "hashtags": ["#popin", "#wibble"], 
 
    "uId": "blogA" 
 
    }, 
 
    { 
 
    "title": "second blog sdf wicked", 
 
    "section": "components", 
 
    "categoryId": "blog", 
 
    "image": "http://placehold.it/350x220", 
 
    "hashtags": ["#popin", "#wibble"], 
 
    "uId": "blogB" 
 
    }, 
 
    { 
 
    "title": "first header", 
 
    "section": "components", 
 
    "categoryId": "contact_button", 
 
    "image": "http://placehold.it/350x220", 
 
    "hashtags": ["#popin", "#wibble"], 
 
    "uId": "contact_buttonA" 
 
    }, 
 
    { 
 
    "title": "first landing", 
 
    "section": "components", 
 
    "categoryId": "content_bloc", 
 
    "image": "http://placehold.it/350x220", 
 
    "hashtags": ["#popin", "#wibble"], 
 
    "uId": "content_blocA" 
 
    }, 
 
    { 
 
    "title": "second landing", 
 
    "section": "components", 
 
    "categoryId": "content_bloc", 
 
    "image": "http://placehold.it/350x220", 
 
    "hashtags": ["#popin", "#wibble"], 
 
    "uId": "content_blocB" 
 
    }, 
 
    { 
 
    "title": "third landing", 
 
    "section": "components", 
 
    "categoryId": "content_bloc", 
 
    "image": "http://placehold.it/350x220", 
 
    "hashtags": ["#popn", "#wibble"], 
 
    "uId": "content_blocC" 
 
    }, 
 
    { 
 
    "title": "first nav", 
 
    "section": "components", 
 
    "categoryId": "cover", 
 
    "image": "http://placehold.it/350x220", 
 
    "hashtags": ["#popn", "#wibble"], 
 
    "uId": "coverA" 
 
    }] 
 
var view = 'land'; 
 
var re = new RegExp(view); 
 
var delete_id = savedViews.filter(function (el) { 
 
    return re.test(el.title); 
 
}); 
 

 
//console.log(delete_id); 
 
var view1 = 'popin'; 
 
var re1 = new RegExp(view1); 
 
var delete_id1 = delete_id.filter(function (el) { 
 
    return re1.test(el.hashtags); 
 
}); 
 
console.log(delete_id1);

источник

2016-11-14 10:26:29 Mahi

Я уже могу фильтровать, у какого объекта есть «земля» в его названии. Мне нужно отфильтровать объекты, если у них есть «земля» в заголовке или hashtags – saunders

что это такое? – Mahi

@saunders обновленный ответ – Mahi

Как Переберите массив объектов и проверить, если значение соответствует либо строку в объект или значение в массиве элементов с помощью lodash

ответ

Смежные вопросы