jquery - پیدا کردن و حذف اشیاء در یک آرایه بر اساس مقدار کلید در جاوااسکریپت

من چندین روش مختلف را امتحان کردهام برای اینکه چگونه یک شیء را در یک آرایه پیدا کنم، جایی که ID=var باشد، و اگر پیدا شد، شیء را از آرایه حذف کرده و آرایه جدید اشیاء را بازگردانم.

دادهها:

[
    {"id":"88","name":"Lets go testing"},
    {"id":"99","name":"Have fun boys and girls"},
    {"id":"108","name":"You are awesome!"}
]

من قادر هستم با استفاده از jQuery $grep آرایه را جستجو کنم

var id = 88;

var result = $.grep(data, function(e){
     return e.id == id;
});

اما چطور میتوانم کل شیء را وقتی id == 88 حذف کنم و دادهها را مانند زیر برگردانم؟

دادهها:

[
    {"id":"99", "name":"Have fun boys and girls"},
    {"id":"108", "name":"You are awesome!"}
]

پاسخ شماره ۱

در اینجا یک راه حل وجود دارد اگر از jQuery استفاده نمیکنید:

myArray = myArray.filter(function( obj ) {
  return obj.id !== id;
});

پاسخ شماره ۲

من میتوانم آرایه را برای شناسه جستجو کنم، اما چگونه میتوانم کل شیء که id == 88 است را حذف کنم

به سادگی با گزارهٔ مخالف فیلتر کنید:

var data = $.grep(data, function(e){ 
     return e.id != id; 
});

پاسخ شماره ۳

شما میتوانید این را سادهتر کنید، و در واقع نیازی به استفاده از jQuery اینجا نیست.

var id = 88;

for(var i = 0; i < data.length; i++) {
    if(data[i].id == id) {
        data.splice(i, 1);
        break;
    }
}

فقط از طریق لیست تکرار کنید، شناسهی مطابق را پیدا کنید، تقسیم کنید و سپس برای خروج از حلقه توقف کنید.

پاسخ شماره ۴

یک روش جدید برای انجام این کار در ES6/2015 با استفاده از findIndex و عملگر گسترش آرایه وجود دارد:

const index = data.findIndex(obj => obj.id === id);
const newData = [
    ...data.slice(0, index),
    ...data.slice(index + 1)
]

شما میتوانید آن را به یک تابع برای استفاده مجدد بعدی تبدیل کنید، به این صورت:

function remove(array, key, value) {
    const index = array.findIndex(obj => obj[key] === value);
    return index >= 0 ? [
        ...array.slice(0, index),
        ...array.slice(index + 1)
    ] : array;
}

به این ترتیب، میتوانید آیتمها را با کلیدهای مختلف با استفاده از یک روش حذف کنید (و اگر هیچ شیئی که معیارها را برآورده کند وجود نداشته باشد، آرایهی اصلی بازگردانده میشود):

const newData = remove(data, "id", "88");
const newData2 = remove(data, "name", "You are awesome!");

یا میتوانید آن را روی Array.prototype خود قرار دهید:

Array.prototype.remove = function (key, value) {
    const index = this.findIndex(obj => obj[key] === value);
    return index >= 0 ? [
        ...this.slice(0, index),
        ...this.slice(index + 1)
    ] : this;
};

و اینطور از آن استفاده کنید:

const newData = data.remove("id", "88");
const newData2 = data.remove("name", "You are awesome!");

پاسخ شماره ۵

راهحل بومی ES6:

const pos = data.findIndex(el => el.id === ID_TO_REMOVE);
if (pos >= 0)
    data.splice(pos, 1);

اگر مطمئن هستید که عنصر حتماً در آرایه وجود دارد:

data.splice(data.findIndex(el => el.id === ID_TO_REMOVE), 1);

نمونه اولیه:

Array.prototype.removeByProp = function(prop,val) {
    const pos = this.findIndex(x => x[prop] === val);
    if (pos >= 0)
        return this.splice(pos, 1);
};

// usage:
ar.removeByProp('id', ID_TO_REMOVE);

http://jsfiddle.net/oriadam/72kgprw5/

توجه: این مورد را بهصورت محل اصلی حذف میکند. اگر به یک آرایه جدید نیاز دارید، از filter همانطور که در پاسخهای قبلی ذکر شده استفاده کنید.

پاسخ شماره ۶

var items = [
  {"id":"88","name":"Lets go testing"},
  {"id":"99","name":"Have fun boys and girls"},
  {"id":"108","name":"You are awesome!"}
];

اگر از jQuery استفاده میکنید، از jQuery.grep به این صورت استفاده کنید:

items = $.grep(items, function(item) { 
  return item.id !== '88';
});
// items => [{ id: "99" }, { id: "108" }]

استفاده از Array.prototype.filter در ES5:

items = items.filter(function(item) { 
  return item.id !== '88'; 
});
// items => [{ id: "99" }, { id: "108" }]