how to remove element in array javascript

Question

how to find new array when delete element array (It looks like your post is mostly code; please add some more details.) sorry i can't think a long question.

mdwqndlnqwfndeqfnlknflkjvnsjnvjksnklds lknsalndlksam mnalmfd;emq qmf;wnlfcnlsaclacfem lwqmf;lmqwlfnleksdnflkcwe lwmflmqwklfn eanfklcewkl s;qmjf;wqmfeqfwqklnfdkleqnfklenqlk nlkeqn lkvc ewklc eqlkv elkv elqv ejkf jkqeflcen qklfnlwkrn vle lkfewnlf wfklenqlfkneqklf

> i have init array ...
[{
        "idProduct": 1,
        "id":1,
        "name": "MacBook Air M1 2020 (RAM 8GB | 256GB SSD)",
        "image": "https://i.ibb.co/tzNm2jB/macbookairm1.png",
        "price": 20000000,
        "ram": "8GB",
        "color": "#fbecd3",
        "storage": "256GB"
      },
      {
        "idProduct": 2,
        "id":1
        "name": "MacBook Air M1 2020 (RAM 16GB | 256GB SSD)",
        "image": "https://i.ibb.co/tzNm2jB/macbookairm1.png",
        "price": 25000000,
        "ram": "16GB",
        "color": "#fbecd3",
        "storage": "256GB"
      },
      {
        "idProduct": 3,
        "id":1,
        "name": "MacBook Air M1 2020 (RAM 8GB | 512GB SSD)",
        "image": "https://i.ibb.co/tzNm2jB/macbookairm1.png",
        "price": 23000000,
        "ram": "8GB",
        "color": "#fbecd3",
        "storage": "512GB"
      },
      {
        "idProduct": 4,
        "id":1,
        "name": "MacBook Air M1 2020 (RAM 16GB | 512GB SSD)",
        "image": "https://i.ibb.co/tzNm2jB/macbookairm1.png",
        "price": 28000000,
        "ram": "16GB",
        "color": "#fbecd3",
        "storage": "512GB"
      },
      
        "idProduct": 1,
        "id":2,
        "name": "iPhone 13 Pro Max 256GB",
        "image": "https://i.ibb.co/9qFqM5g/iphone-13-pro-green-profile.png",
        "price": 30000000,
        "color": "green",
        "storage": "256GB"
      },
      {
        "idProduct": 2,
        "id":2,
        "name": "iPhone 13 Pro Max 128GB",
        "price": 28000000,
        "image": "https://i.ibb.co/9VGBNV6/iphone-13-pro-gold-profile.png",
        "color": "#fbecd3",
        "storage": "128GB"
      },
      {
        "idProduct": 3,
        "id":2,
        "name": "iPhone 13 Pro Max 256GB",
        "price": 30500000,
        "image": "https://i.ibb.co/9VGBNV6/iphone-13-pro-gold-profile.png",
        "color": "#fbecd3",
        "storage": "256GB"
      },
      {
        "idProduct": 4,
        "id":2,
        "name": "iPhone 13 Pro Max 128GB",
        "price": 27000000,
        "image": "https://i.ibb.co/9qFqM5g/iphone-13-pro-green-profile.png",
        "color": "green",
        "storage": "128GB"
      }
]

and element array:
      {
        "idProduct": 3,
        "id":2,
        "name": "iPhone 13 Pro Max 256GB",
        "price": 30500000,
        "image": "https://i.ibb.co/9VGBNV6/iphone-13-pro-gold-profile.png",
        "color": "#fbecd3",
        "storage": "256GB"
      },


 


result i need

[{
        "idProduct": 1,
        "id":1,
        "name": "MacBook Air M1 2020 (RAM 8GB | 256GB SSD)",
        "image": "https://i.ibb.co/tzNm2jB/macbookairm1.png",
        "price": 20000000,
        "ram": "8GB",
        "color": "#fbecd3",
        "storage": "256GB"
      },
      {
        "idProduct": 2,
        "id":1
        "name": "MacBook Air M1 2020 (RAM 16GB | 256GB SSD)",
        "image": "https://i.ibb.co/tzNm2jB/macbookairm1.png",
        "price": 25000000,
        "ram": "16GB",
        "color": "#fbecd3",
        "storage": "256GB"
      },
      {
        "idProduct": 3,
        "id":1,
        "name": "MacBook Air M1 2020 (RAM 8GB | 512GB SSD)",
        "image": "https://i.ibb.co/tzNm2jB/macbookairm1.png",
        "price": 23000000,
        "ram": "8GB",
        "color": "#fbecd3",
        "storage": "512GB"
      },
      {
        "idProduct": 4,
        "id":1,
        "name": "MacBook Air M1 2020 (RAM 16GB | 512GB SSD)",
        "image": "https://i.ibb.co/tzNm2jB/macbookairm1.png",
        "price": 28000000,
        "ram": "16GB",
        "color": "#fbecd3",
        "storage": "512GB"
      },
      
        "idProduct": 1,
        "id":2,
        "name": "iPhone 13 Pro Max 256GB",
        "image": "https://i.ibb.co/9qFqM5g/iphone-13-pro-green-profile.png",
        "price": 30000000,
        "color": "green",
        "storage": "256GB"
      },
      {
        "idProduct": 2,
        "id":2,
        "name": "iPhone 13 Pro Max 128GB",
        "price": 28000000,
        "image": "https://i.ibb.co/9VGBNV6/iphone-13-pro-gold-profile.png",
        "color": "#fbecd3",
        "storage": "128GB"
      },
      {
        "idProduct": 4,
        "id":2,
        "name": "iPhone 13 Pro Max 128GB",
        "price": 27000000,
        "image": "https://i.ibb.co/9qFqM5g/iphone-13-pro-green-profile.png",
        "color": "green",
        "storage": "128GB"
      }
]

_“sorry i can't think a long question”_ — How about adding your research or your attempts? See [How much research effort is expected of Stack Overflow users?](//meta.stackoverflow.com/q/261592/4642212). — Sebastian Simon, Nov 17 '22 at 01:54
Get familiar with [how to access and process objects, arrays, or JSON](/q/11922383/4642212), how to [access properties](//developer.mozilla.org/en/docs/Web/JavaScript/Reference/Operators/Property_Accessors), and use the static and instance methods of [`Array`](//developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array#Static_methods) . Read the [documentation](//developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/filter). — Sebastian Simon, Nov 17 '22 at 01:57
I guess it is a little hard for you. But let's try to do our best. In general, a question format should be "I have [your array, input, etc...], I want [what you want, output,...], and this is my tryout [your implementation], but..." — hoangdv, Nov 17 '22 at 02:01
@hoangdv i've try do but i don't think it so i post question and hope a helpful answer — Minh Quang, Nov 17 '22 at 02:06

score 0 · Accepted Answer · edited Nov 17 '22 at 02:10

In order to check the elements of the array, you need to loop through the array and find the element to remove.

Array.filter is the easiest way to filter out the elements of the array without mutating the original array.

Array.filter()

You can use filter to filter out the array elements. Array.filter checks for the return value of the provided function. If the function returns truthful (true), it includes the element in the array otherwise it removes the element from the new array being generated.

const filteredArray = originalElementArray.filter(element => !(element.id ==2 && element.idProduct == 3));

Try this out:

const originalElementArray = [{
  "idProduct": 1,
  "id":1,
  "name": "MacBook Air M1 2020 (RAM 8GB | 256GB SSD)",
  "image": "https://i.ibb.co/tzNm2jB/macbookairm1.png",
  "price": 20000000,
  "ram": "8GB",
  "color": "#fbecd3",
  "storage": "256GB"
},
{
  "idProduct": 2,
  "id":1,
  "name": "MacBook Air M1 2020 (RAM 16GB | 256GB SSD)",
  "image": "https://i.ibb.co/tzNm2jB/macbookairm1.png",
  "price": 25000000,
  "ram": "16GB",
  "color": "#fbecd3",
  "storage": "256GB"
},
{
  "idProduct": 3,
  "id":1,
  "name": "MacBook Air M1 2020 (RAM 8GB | 512GB SSD)",
  "image": "https://i.ibb.co/tzNm2jB/macbookairm1.png",
  "price": 23000000,
  "ram": "8GB",
  "color": "#fbecd3",
  "storage": "512GB"
},
{
  "idProduct": 4,
  "id":1,
  "name": "MacBook Air M1 2020 (RAM 16GB | 512GB SSD)",
  "image": "https://i.ibb.co/tzNm2jB/macbookairm1.png",
  "price": 28000000,
  "ram": "16GB",
  "color": "#fbecd3",
  "storage": "512GB"
},
{
  "idProduct": 1,
  "id":2,
  "name": "iPhone 13 Pro Max 256GB",
  "image": "https://i.ibb.co/9qFqM5g/iphone-13-pro-green-profile.png",
  "price": 30000000,
  "color": "green",
  "storage": "256GB"
},
{
  "idProduct": 2,
  "id":2,
  "name": "iPhone 13 Pro Max 128GB",
  "price": 28000000,
  "image": "https://i.ibb.co/9VGBNV6/iphone-13-pro-gold-profile.png",
  "color": "#fbecd3",
  "storage": "128GB"
},
{
  "idProduct": 3,
  "id":2,
  "name": "iPhone 13 Pro Max 256GB",
  "price": 30500000,
  "image": "https://i.ibb.co/9VGBNV6/iphone-13-pro-gold-profile.png",
  "color": "#fbecd3",
  "storage": "256GB"
},
{
  "idProduct": 4,
  "id":2,
  "name": "iPhone 13 Pro Max 128GB",
  "price": 27000000,
  "image": "https://i.ibb.co/9qFqM5g/iphone-13-pro-green-profile.png",
  "color": "green",
  "storage": "128GB"
}
]

const elementToBeRemoved = {
      "idProduct": 3,
      "id":2,
      "name": "iPhone 13 Pro Max 256GB",
      "price": 30500000,
      "image": "https://i.ibb.co/9VGBNV6/iphone-13-pro-gold-profile.png",
      "color": "#fbecd3",
      "storage": "256GB"
    }

const filteredArray = originalElementArray.filter(element => !(element.id === elementToBeRemoved.id && element.idProduct === elementToBeRemoved.idProduct));

console.log(filteredArray)

thanks u so much, i don't think it is a simple question :(( i complex a issue — Minh Quang, Nov 17 '22 at 02:13
@MinhQuang Filtering objects by two properties using logical operators isn’t a complex issue at all. Read the [documentation](//developer.mozilla.org/en/docs/Web/JavaScript/Reference) and a good [tutorial](//developer.mozilla.org/en/docs/Web/JavaScript/Guide) to get a firm grasp of these fundamental concepts: [Arrow function expressions](//developer.mozilla.org/en/docs/Web/JavaScript/Reference/Functions/Arrow_functions), [Expressions and operators](//developer.mozilla.org/en/docs/Web/JavaScript/Reference/Operators), especially the “logical” ones, and everything already linked above. — Sebastian Simon, Nov 17 '22 at 06:38

how to remove element in array javascript

1 Answers1

Array.filter()