Hướng dẫn remove() javascript - remove () javascript

Xin chào mọi người, sau một hồi lướt trên internet thì mình tìm được một bài khá hay về Javascript. Nên mình xin phép dịch lại nội dung bài viết đó.

Bạn có thể tham khảo bài viêt gốc ở đây

13 Methods To Remove/Filter an Item in an Array (and Array of Objects) in JavaScript

I know small stones doesn’t make much difference but if we get thousand of stones it will and for that I will come with new stone tomorrow. Stay tuned

Hướng dẫn remove() javascript - remove () javascript

Chúng ta có thể tìm ra một hay nhiều cách khác nhau để có thể xóa một phần tử trong mảng hoặc là mảng các object dựa trên một hoặc nhiều thuộc tính của phần tử đó. Hôm nay chúng ta cùng tìm hiểu các cách để xóa hoặc lọc một phần tử từ một mảng dựa trên các thuộc tính của nó trong Javascript.

1. pop()

let arrayshifttest = [2, 1, 2, 5, 6, 7, 8, 9, 9, 10];
let testshift = arrayshifttest.shift();

console.log("array shift", testshift,"-", arrayshifttest);
// array shift 2 - [1, 2, 5, 6, 7, 8, 9, 9, 10]
2 method sẽ xóa đi phần tử cuối cùng của một mảng và trả về phần tử đó. Khi sử dụng
let arrayshifttest = [2, 1, 2, 5, 6, 7, 8, 9, 9, 10];
let testshift = arrayshifttest.shift();

console.log("array shift", testshift,"-", arrayshifttest);
// array shift 2 - [1, 2, 5, 6, 7, 8, 9, 9, 10]
3 thì nó sẽ thực hiện xóa trực tiếp vào mảng ban đầu.

Array:

let arraypoptest = [2, 1, 2, 5, 6, 7, 8, 9, 9, 10];
let testpop = arraypoptest.pop();

console.log("array pop", testpop,"-", arraypoptest);
// array pop 10 - [2, 1, 2, 5, 6, 7, 8, 9, 9];

Array of objects:

let users1 = [
{ id: 1, name: "ted" },
{ id: 2, name: "mike" },
{ id: 3, name: "bob" },
{ id: 4, name: "sara" }
];
let testpop1 = users1.pop();

console.log("array of objects pop", SON.stringify(testpop1),  "-", JSON.stringify(users1)
);
// array of objects pop {"id":4,"name":"sara"} - [{"id":1,"name":"ted"},{"id":2,"name":"mike"},{"id":3,"name":"bob"}]

2. shift()

Ngược lại với

let arrayshifttest = [2, 1, 2, 5, 6, 7, 8, 9, 9, 10];
let testshift = arrayshifttest.shift();

console.log("array shift", testshift,"-", arrayshifttest);
// array shift 2 - [1, 2, 5, 6, 7, 8, 9, 9, 10]
2,
let arrayshifttest = [2, 1, 2, 5, 6, 7, 8, 9, 9, 10];
let testshift = arrayshifttest.shift();

console.log("array shift", testshift,"-", arrayshifttest);
// array shift 2 - [1, 2, 5, 6, 7, 8, 9, 9, 10]
5 sẽ xóa đi phần tử đầu tiên của mảng và trả về phần tử đó. Nó cũng sẽ xóa trực tiếp vào mảng ban đầu.

Array:

let arrayshifttest = [2, 1, 2, 5, 6, 7, 8, 9, 9, 10];
let testshift = arrayshifttest.shift();

console.log("array shift", testshift,"-", arrayshifttest);
// array shift 2 - [1, 2, 5, 6, 7, 8, 9, 9, 10]

Array of objects:

let users2 = [
{ id: 1, name: "ted" },
{ id: 2, name: "mike" },
{ id: 3, name: "bob" },
{ id: 4, name: "sara" }
];
let testshift1 = users2.shift();

console.log("array of objects shift", JSON.stringify(testshift1),"-", JSON.stringify(users2));
// array of objects shift {"id":1,"name":"ted"} - [{"id":2,"name":"mike"},{"id":3,"name":"bob"},{"id":4,"name":"sara"}]

2. shift()

Ngược lại với

let arrayshifttest = [2, 1, 2, 5, 6, 7, 8, 9, 9, 10];
let testshift = arrayshifttest.shift();

console.log("array shift", testshift,"-", arrayshifttest);
// array shift 2 - [1, 2, 5, 6, 7, 8, 9, 9, 10]
2,
let arrayshifttest = [2, 1, 2, 5, 6, 7, 8, 9, 9, 10];
let testshift = arrayshifttest.shift();

console.log("array shift", testshift,"-", arrayshifttest);
// array shift 2 - [1, 2, 5, 6, 7, 8, 9, 9, 10]
5 sẽ xóa đi phần tử đầu tiên của mảng và trả về phần tử đó. Nó cũng sẽ xóa trực tiếp vào mảng ban đầu.

Array:

let arrayslicetest = [2, 1, 2, 5, 6, 7, 8, 9, 9, 10];
let testslice = arrayslicetest.slice(0, 3);

console.log("array slice", testslice, arrayslicetest); 
//not changed original array
// array slice [2, 1, 2] - [2, 1, 2, 5, 6, 7, 8, 9, 9, 10]

Array of objects:

let users3 = [
{ id: 1, name: "ted" },
{ id: 2, name: "mike" },
{ id: 3, name: "bob" },
{ id: 4, name: "sara" }
];
let testslice1 = users3.slice(0, 3);

console.log("array of objects slice", JSON.stringify(testslice1));
//not changed original array
// array of objects slice [{"id":1,"name":"ted"},{"id":2,"name":"mike"},{"id":3,"name":"bob"}]

2. shift()

Ngược lại với

let arrayshifttest = [2, 1, 2, 5, 6, 7, 8, 9, 9, 10];
let testshift = arrayshifttest.shift();

console.log("array shift", testshift,"-", arrayshifttest);
// array shift 2 - [1, 2, 5, 6, 7, 8, 9, 9, 10]
2,
let arrayshifttest = [2, 1, 2, 5, 6, 7, 8, 9, 9, 10];
let testshift = arrayshifttest.shift();

console.log("array shift", testshift,"-", arrayshifttest);
// array shift 2 - [1, 2, 5, 6, 7, 8, 9, 9, 10]
5 sẽ xóa đi phần tử đầu tiên của mảng và trả về phần tử đó. Nó cũng sẽ xóa trực tiếp vào mảng ban đầu.

Array:

let arraysplicetest = [2, 1, 2, 5, 6, 7, 8, 9, 9, 10];
let testsplice = arraysplicetest.splice(0, 3);

console.log("array splice", JSON.stringify(testsplice),"-", JSON.stringify(arraysplicetest));
// array splice [2, 1, 2] - [5, 6, 7, 8, 9, 9, 10]

Array of objects:

let users4 = [
{ id: 1, name: "ted" },
{ id: 2, name: "mike" },
{ id: 3, name: "bob" },
{ id: 4, name: "sara" }
];
let testspice1 = users3.splice(0, 3);

console.log("array of objects splice", JSON.stringify(testsplice));
// array of objects splice [{"id":1,"name":"ted"},{"id":2,"name":"mike"},{"id":3,"name":"bob"}]

2. shift()

Array:

let arr = [2, 1, 2, 5, 6, 7, 8, 9, 9, 10];
for (var i = 0; i < arr.length; i++) {
    if (arr[i] === 5) {
        arr.splice(i, 1);
    }
}

console.log("splice with specific value", arr);
// splice with specific value [2, 1, 2, 6, 7, 8, 9, 9, 10]

Array of objects:

let users5 = [
{ id: 1, name: "ted" },
{ id: 2, name: "mike" },
{ id: 3, name: "bob" },
{ id: 4, name: "sara" }
];
for (var i = 0; i < users5.length; i++) {
    if (users5[i].name === "ted") {
        users5.splice(i, 1);
    }
}

console.log("splice with specific value array of objects", JSON.stringify( users5));
// splice with specific value array of objects [{"id":2,"name":"mike"},{"id":3,"name":"bob"},{"id":4,"name":"sara"}]

2. shift()

Ngược lại với

let arrayshifttest = [2, 1, 2, 5, 6, 7, 8, 9, 9, 10];
let testshift = arrayshifttest.shift();

console.log("array shift", testshift,"-", arrayshifttest);
// array shift 2 - [1, 2, 5, 6, 7, 8, 9, 9, 10]
2,
let arrayshifttest = [2, 1, 2, 5, 6, 7, 8, 9, 9, 10];
let testshift = arrayshifttest.shift();

console.log("array shift", testshift,"-", arrayshifttest);
// array shift 2 - [1, 2, 5, 6, 7, 8, 9, 9, 10]
5 sẽ xóa đi phần tử đầu tiên của mảng và trả về phần tử đó. Nó cũng sẽ xóa trực tiếp vào mảng ban đầu.

Array:

let users1 = [
{ id: 1, name: "ted" },
{ id: 2, name: "mike" },
{ id: 3, name: "bob" },
{ id: 4, name: "sara" }
];
let testpop1 = users1.pop();

console.log("array of objects pop", SON.stringify(testpop1),  "-", JSON.stringify(users1)
);
// array of objects pop {"id":4,"name":"sara"} - [{"id":1,"name":"ted"},{"id":2,"name":"mike"},{"id":3,"name":"bob"}]
0

Array of objects:

let users1 = [
{ id: 1, name: "ted" },
{ id: 2, name: "mike" },
{ id: 3, name: "bob" },
{ id: 4, name: "sara" }
];
let testpop1 = users1.pop();

console.log("array of objects pop", SON.stringify(testpop1),  "-", JSON.stringify(users1)
);
// array of objects pop {"id":4,"name":"sara"} - [{"id":1,"name":"ted"},{"id":2,"name":"mike"},{"id":3,"name":"bob"}]
1

2. shift()

Ngược lại với

let arrayshifttest = [2, 1, 2, 5, 6, 7, 8, 9, 9, 10];
let testshift = arrayshifttest.shift();

console.log("array shift", testshift,"-", arrayshifttest);
// array shift 2 - [1, 2, 5, 6, 7, 8, 9, 9, 10]
2,
let arrayshifttest = [2, 1, 2, 5, 6, 7, 8, 9, 9, 10];
let testshift = arrayshifttest.shift();

console.log("array shift", testshift,"-", arrayshifttest);
// array shift 2 - [1, 2, 5, 6, 7, 8, 9, 9, 10]
5 sẽ xóa đi phần tử đầu tiên của mảng và trả về phần tử đó. Nó cũng sẽ xóa trực tiếp vào mảng ban đầu.

Array:

let users1 = [
{ id: 1, name: "ted" },
{ id: 2, name: "mike" },
{ id: 3, name: "bob" },
{ id: 4, name: "sara" }
];
let testpop1 = users1.pop();

console.log("array of objects pop", SON.stringify(testpop1),  "-", JSON.stringify(users1)
);
// array of objects pop {"id":4,"name":"sara"} - [{"id":1,"name":"ted"},{"id":2,"name":"mike"},{"id":3,"name":"bob"}]
2

3. slice()

let users1 = [
{ id: 1, name: "ted" },
{ id: 2, name: "mike" },
{ id: 3, name: "bob" },
{ id: 4, name: "sara" }
];
let testpop1 = users1.pop();

console.log("array of objects pop", SON.stringify(testpop1),  "-", JSON.stringify(users1)
);
// array of objects pop {"id":4,"name":"sara"} - [{"id":1,"name":"ted"},{"id":2,"name":"mike"},{"id":3,"name":"bob"}]
3

Array of objects:

let users1 = [
{ id: 1, name: "ted" },
{ id: 2, name: "mike" },
{ id: 3, name: "bob" },
{ id: 4, name: "sara" }
];
let testpop1 = users1.pop();

console.log("array of objects pop", SON.stringify(testpop1),  "-", JSON.stringify(users1)
);
// array of objects pop {"id":4,"name":"sara"} - [{"id":1,"name":"ted"},{"id":2,"name":"mike"},{"id":3,"name":"bob"}]
4

2. shift()

Ngược lại với

let arrayshifttest = [2, 1, 2, 5, 6, 7, 8, 9, 9, 10];
let testshift = arrayshifttest.shift();

console.log("array shift", testshift,"-", arrayshifttest);
// array shift 2 - [1, 2, 5, 6, 7, 8, 9, 9, 10]
2,
let arrayshifttest = [2, 1, 2, 5, 6, 7, 8, 9, 9, 10];
let testshift = arrayshifttest.shift();

console.log("array shift", testshift,"-", arrayshifttest);
// array shift 2 - [1, 2, 5, 6, 7, 8, 9, 9, 10]
5 sẽ xóa đi phần tử đầu tiên của mảng và trả về phần tử đó. Nó cũng sẽ xóa trực tiếp vào mảng ban đầu.

let users1 = [
{ id: 1, name: "ted" },
{ id: 2, name: "mike" },
{ id: 3, name: "bob" },
{ id: 4, name: "sara" }
];
let testpop1 = users1.pop();

console.log("array of objects pop", SON.stringify(testpop1),  "-", JSON.stringify(users1)
);
// array of objects pop {"id":4,"name":"sara"} - [{"id":1,"name":"ted"},{"id":2,"name":"mike"},{"id":3,"name":"bob"}]
5

3. slice()

let arrayshifttest = [2, 1, 2, 5, 6, 7, 8, 9, 9, 10];
let testshift = arrayshifttest.shift();

console.log("array shift", testshift,"-", arrayshifttest);
// array shift 2 - [1, 2, 5, 6, 7, 8, 9, 9, 10]
6 method sẽ trả về một mảng mới bao gồm các phần tử của mảng bắt đầu từ vị trí
let arrayshifttest = [2, 1, 2, 5, 6, 7, 8, 9, 9, 10];
let testshift = arrayshifttest.shift();

console.log("array shift", testshift,"-", arrayshifttest);
// array shift 2 - [1, 2, 5, 6, 7, 8, 9, 9, 10]
7 đến
let arrayshifttest = [2, 1, 2, 5, 6, 7, 8, 9, 9, 10];
let testshift = arrayshifttest.shift();

console.log("array shift", testshift,"-", arrayshifttest);
// array shift 2 - [1, 2, 5, 6, 7, 8, 9, 9, 10]
8 (không bao gồm mảng ở vị trí
let arrayshifttest = [2, 1, 2, 5, 6, 7, 8, 9, 9, 10];
let testshift = arrayshifttest.shift();

console.log("array shift", testshift,"-", arrayshifttest);
// array shift 2 - [1, 2, 5, 6, 7, 8, 9, 9, 10]
8) của mảng ban đầu. Trong đó các giá trị
let arrayshifttest = [2, 1, 2, 5, 6, 7, 8, 9, 9, 10];
let testshift = arrayshifttest.shift();

console.log("array shift", testshift,"-", arrayshifttest);
// array shift 2 - [1, 2, 5, 6, 7, 8, 9, 9, 10]
7 và
let arrayshifttest = [2, 1, 2, 5, 6, 7, 8, 9, 9, 10];
let testshift = arrayshifttest.shift();

console.log("array shift", testshift,"-", arrayshifttest);
// array shift 2 - [1, 2, 5, 6, 7, 8, 9, 9, 10]
8 tương đương với giá trị index của mảng. Mảng ban đầu sẽ không bị thay đổi giá trị.

Array:

let users1 = [
{ id: 1, name: "ted" },
{ id: 2, name: "mike" },
{ id: 3, name: "bob" },
{ id: 4, name: "sara" }
];
let testpop1 = users1.pop();

console.log("array of objects pop", SON.stringify(testpop1),  "-", JSON.stringify(users1)
);
// array of objects pop {"id":4,"name":"sara"} - [{"id":1,"name":"ted"},{"id":2,"name":"mike"},{"id":3,"name":"bob"}]
6

Array of objects:

let users1 = [
{ id: 1, name: "ted" },
{ id: 2, name: "mike" },
{ id: 3, name: "bob" },
{ id: 4, name: "sara" }
];
let testpop1 = users1.pop();

console.log("array of objects pop", SON.stringify(testpop1),  "-", JSON.stringify(users1)
);
// array of objects pop {"id":4,"name":"sara"} - [{"id":1,"name":"ted"},{"id":2,"name":"mike"},{"id":3,"name":"bob"}]
7

2. shift()

Ngược lại với

let arrayshifttest = [2, 1, 2, 5, 6, 7, 8, 9, 9, 10];
let testshift = arrayshifttest.shift();

console.log("array shift", testshift,"-", arrayshifttest);
// array shift 2 - [1, 2, 5, 6, 7, 8, 9, 9, 10]
2,
let arrayshifttest = [2, 1, 2, 5, 6, 7, 8, 9, 9, 10];
let testshift = arrayshifttest.shift();

console.log("array shift", testshift,"-", arrayshifttest);
// array shift 2 - [1, 2, 5, 6, 7, 8, 9, 9, 10]
5 sẽ xóa đi phần tử đầu tiên của mảng và trả về phần tử đó. Nó cũng sẽ xóa trực tiếp vào mảng ban đầu.

let users1 = [
{ id: 1, name: "ted" },
{ id: 2, name: "mike" },
{ id: 3, name: "bob" },
{ id: 4, name: "sara" }
];
let testpop1 = users1.pop();

console.log("array of objects pop", SON.stringify(testpop1),  "-", JSON.stringify(users1)
);
// array of objects pop {"id":4,"name":"sara"} - [{"id":1,"name":"ted"},{"id":2,"name":"mike"},{"id":3,"name":"bob"}]
8

3. slice()

let arrayshifttest = [2, 1, 2, 5, 6, 7, 8, 9, 9, 10];
let testshift = arrayshifttest.shift();

console.log("array shift", testshift,"-", arrayshifttest);
// array shift 2 - [1, 2, 5, 6, 7, 8, 9, 9, 10]
6 method sẽ trả về một mảng mới bao gồm các phần tử của mảng bắt đầu từ vị trí
let arrayshifttest = [2, 1, 2, 5, 6, 7, 8, 9, 9, 10];
let testshift = arrayshifttest.shift();

console.log("array shift", testshift,"-", arrayshifttest);
// array shift 2 - [1, 2, 5, 6, 7, 8, 9, 9, 10]
7 đến
let arrayshifttest = [2, 1, 2, 5, 6, 7, 8, 9, 9, 10];
let testshift = arrayshifttest.shift();

console.log("array shift", testshift,"-", arrayshifttest);
// array shift 2 - [1, 2, 5, 6, 7, 8, 9, 9, 10]
8 (không bao gồm mảng ở vị trí
let arrayshifttest = [2, 1, 2, 5, 6, 7, 8, 9, 9, 10];
let testshift = arrayshifttest.shift();

console.log("array shift", testshift,"-", arrayshifttest);
// array shift 2 - [1, 2, 5, 6, 7, 8, 9, 9, 10]
8) của mảng ban đầu. Trong đó các giá trị
let arrayshifttest = [2, 1, 2, 5, 6, 7, 8, 9, 9, 10];
let testshift = arrayshifttest.shift();

console.log("array shift", testshift,"-", arrayshifttest);
// array shift 2 - [1, 2, 5, 6, 7, 8, 9, 9, 10]
7 và
let arrayshifttest = [2, 1, 2, 5, 6, 7, 8, 9, 9, 10];
let testshift = arrayshifttest.shift();

console.log("array shift", testshift,"-", arrayshifttest);
// array shift 2 - [1, 2, 5, 6, 7, 8, 9, 9, 10]
8 tương đương với giá trị index của mảng. Mảng ban đầu sẽ không bị thay đổi giá trị.

let users1 = [
{ id: 1, name: "ted" },
{ id: 2, name: "mike" },
{ id: 3, name: "bob" },
{ id: 4, name: "sara" }
];
let testpop1 = users1.pop();

console.log("array of objects pop", SON.stringify(testpop1),  "-", JSON.stringify(users1)
);
// array of objects pop {"id":4,"name":"sara"} - [{"id":1,"name":"ted"},{"id":2,"name":"mike"},{"id":3,"name":"bob"}]
9

4. splice()

let users2 = [
{ id: 1, name: "ted" },
{ id: 2, name: "mike" },
{ id: 3, name: "bob" },
{ id: 4, name: "sara" }
];
let testshift1 = users2.shift();

console.log("array of objects shift", JSON.stringify(testshift1),"-", JSON.stringify(users2));
// array of objects shift {"id":1,"name":"ted"} - [{"id":2,"name":"mike"},{"id":3,"name":"bob"},{"id":4,"name":"sara"}]
2 method được sử dụng để thay đổi giá trị của mảng như là xóa hoặc thay thế một phần tử tỏng mảng hoặc là thêm một phần tử mới vào một vị trí trong mảng.

let arrayshifttest = [2, 1, 2, 5, 6, 7, 8, 9, 9, 10];
let testshift = arrayshifttest.shift();

console.log("array shift", testshift,"-", arrayshifttest);
// array shift 2 - [1, 2, 5, 6, 7, 8, 9, 9, 10]
0

5. Xóa một phần tử bất kỳ trong mảng sử dụng splice

6. Xóa một phần tử bất kỳ trong mảng sử dụng splice - cách ngắn gọn hơn

let arrayshifttest = [2, 1, 2, 5, 6, 7, 8, 9, 9, 10];
let testshift = arrayshifttest.shift();

console.log("array shift", testshift,"-", arrayshifttest);
// array shift 2 - [1, 2, 5, 6, 7, 8, 9, 9, 10]
1

Mình xin nhắc lại, let users2 = [ { id: 1, name: "ted" }, { id: 2, name: "mike" }, { id: 3, name: "bob" }, { id: 4, name: "sara" } ]; let testshift1 = users2.shift(); console.log("array of objects shift", JSON.stringify(testshift1),"-", JSON.stringify(users2)); // array of objects shift {"id":1,"name":"ted"} - [{"id":2,"name":"mike"},{"id":3,"name":"bob"},{"id":4,"name":"sara"}] 2 method có thể thay đổi nội dung của một mảng bằng cách xóa hoặc thay thế phần tử đã tồn tại hoặc là thêm phần tử mới vào mảng. let users2 = [ { id: 1, name: "ted" }, { id: 2, name: "mike" }, { id: 3, name: "bob" }, { id: 4, name: "sara" } ]; let testshift1 = users2.shift(); console.log("array of objects shift", JSON.stringify(testshift1),"-", JSON.stringify(users2)); // array of objects shift {"id":1,"name":"ted"} - [{"id":2,"name":"mike"},{"id":3,"name":"bob"},{"id":4,"name":"sara"}] 4 method trả về index của phần tử đầu tiên tìm thấy trong mảng và nó sẽ trả về -1 nếu phần tử đó không có trong mảng.

https://javascript.plainenglish.io/13-methods-to-remove-filter-an-item-in-an-array-and-array-of-objects-in-javascript-f02b71206d9d