سرچ در یک آبجکت با استفاده از input

سلام میخوام در این آموزش یک سرچ ساده در یک آبجکت انجام بدیم که مقدار اولیه از یک input گرفته میشود

در مرحله اول باید قسمت html کار رو بنویسیم

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>hello world</title>
    
</head>
<body>
    <input type="text" id="input-search">
</body>
<script src="app.js"></script>
</html>

در مرحله بعد در فایل app.js یک آبجیکت تعیرف میکنیم که شامل مقادیری می باشد که باید درآن سرچ شود که ممکن است این آبجکت از از داکیومنت html گرفته شود

const products = [
    {
        title:'node js learning'
    },
    {
        title:'es6 js learning'
    },
    {
        title:'php'
    },
]

در مرحله بعد یک أبجکت تعریف میکنیم که مقادیر سرچ شده را در درون خود نگه میدارد

const filters = {
    searchItem:''
}

و در ادامه یک تابع که در درون آبجکت فیلتر انجام میدهد و مقادیر را درون آبجکت filters ذخیره میکند

const rebderProdoucrs = function(products, filter){
    const filP = products.filter(function(item){
        return item.title.toLowerCase().includes(filter.searchItem.toLowerCase())
    })
    console.log(filP)
}

و حالا باید مقادیر که مقادیر را از input بگیریم و بر روی تابع اعمال کنیم

document.querySelector('#input-search').addEventListener('input', function(e){
    filters.searchItem = e.target.value
    rebderProdoucrs(products, filters) 
})