- Как удалить элемент массива в TypeScript?
- 5 ответов
- TypeScript – How to Remove Items from Array
- Remove an Array Item in TypeScript
- Use splice() to Remove an Array Item in TypeScript
- Use shift() to Remove an Array Item in TypeScript
- Use pop() to Remove an Array Item in TypeScript
- Use delete Operator to Remove an Array Item in TypeScript
- Related Article — TypeScript Array
Как удалить элемент массива в TypeScript?
У меня есть массив, который я создал в TypeScript, и у него есть свойство, которое я использую в качестве ключа. Если у меня есть этот ключ, как я могу удалить элемент из него?
5 ответов
Обратите внимание, что это устанавливает элемент в undefined . Лучше использовать функцию Array.prototype.splice :
var index = myArray.indexOf(key, 0); if (index > -1)
@Chris Хотя это очевидно в этом простом случае, он может помочь вам быстрее диагностировать ошибки, если вы определите тип для каждой переменной явно. Вы уже используете index более чем в одном месте, и в одном из этих мест ( splice ) нужно увидеть число, иначе вы получите ошибку. В настоящее время компилятор не может помешать вам делать ошибки там.
@JochemKuijpers Нет, компилятор создаст другую переменную для всех других индексных переменных. Итак, когда вы объявляете свои переменные с помощью var, let, const, все должно быть в порядке.
Он не устанавливает для элемента значение null , он удаляет свойство, поэтому при обращении к нему он будет считаться undefined .
@blorkfish хорошо бы отметить, что если у вас есть список объектов, вы можете использовать var index = myArray.findIndex(x => x.prop==key.prop); ,
@ Cirelli94 — вы отвечаете на более старую ветку, но ответ на ваш вопрос заключается в том, что удаление элемента массива не меняет его длину и не переиндексирует массив. Поскольку массивы являются объектами в JavaScript, delete myArr[2] буквально удаляет свойство 2 myArr , которое также отличается от myArr[2] = undefined . Мораль этой истории состоит в том, чтобы просто использовать splice для этой задачи, потому что это безопасный способ получить желаемый эффект, не путая побочные эффекты.
Если массив является типом объектов, то самым простым способом является
let foo_object // Item to remove this.foo_objects = this.foo_objects.filter(obj => obj !== foo_object);
@ user573434 да, вы правы, как видно из названия. Но это простой подход в случае, когда вы хотите удалить объект при успешном удалении вызова API и т. Д.
Это отлично сработало для меня с массивом объектов без уникального свойства ключа. @ user573434 метод filter возвращает новый массив без фильтруемого объекта, поэтому результирующий массив действительно удаляет объект.
Я думаю, чтобы вернуть его как объект, вы должны сделать это this.foo_objects = this.foo_objects.filter(obj => obj !== foo_object)[0];
Это самое простое решение, мне оно нравится! Я продолжал задаваться вопросом о любых сценариях, в которых вы хотели бы изменить фактический массив вместо создания его новой копии, но не могли придумать ни одного.
@ mik-t Я полагаю, что под покровом это и есть движок javascript, потому что массивы имеют статический размер.
Это не работает!! Я использовал массив для отслеживания routerLinks в моем приложении Angular, и когда я использовал приведенный выше код, он вообще не удалял ссылку !! Сплайс работает как шарм.
Вы можете использовать метод splice для массива для удаления элементов.
например, если у вас есть массив с именем arr , используйте следующее:
так что элемент с индексом 2 будет отправной точкой, а аргумент 2 определит, сколько элементов нужно удалить.
Если вы хотите удалить последний элемент массива с именем arr , сделайте следующее:
Это вернет arr с удаленным последним элементом.
TypeScript – How to Remove Items from Array
An array in TypeScript, once initialized, cannot be resized. The items in an array can be modified but cannot be removed (or added) without creating a new array.
So there are essentially two approaches to remove an item from an array:
- Setting the element null/undefined without resizing the array.
- Remove the element and create a new array of remaining elements.
Learn to remove or pop items from an array in TypeScript using pop(), shift(), splice(), filter() and delete operator with examples.
let array: number[] = [0, 1, 2, 3, 4, 5, 6]; //Remove from the end let removedElement = array.pop(); //[0, 1, 2, 3, 4, 5] //Remove from the beginning removedElement = array.shift(); //[1, 2, 3, 4] //Remove from specified index let index = array.indexOf(1); let elementsToRemove = 2; let removedElementsArray = array.splice(index, elementsToRemove); //[1, 2] //Remove from specified index let itemIndex = array.indexOf(3); let newArray = array.filter((e, i) => i !== itemIndex); //[4, 5] //Delete the value at specified index without resizing the array delete array[1]; //[3, , 5]
In TypeScript, like JavaScript, Array types are homogenous collections of values. We can define an array in the following ways. First, we can declare and initialize the array in the same line:
let list: number[] = [1, 2, 3]; let list: Array = [1, 2, 3]; let array:number[] = new Array(1, 2, 3);
Or, we can declare an array and populate it later.
let array:number[] = new Array(3) for(let i = 0;i
2. Remove Item from End using array.pop()
The pop() method removes the last element from an array and returns it. If the array is empty, undefined is returned and the array is not modified.
let removedElement = array.pop();
Let us see an example of removing an item from the end of the array.
let array: number[] = [0, 1, 2, 3, 4, 5, 6]; //Remove from the end let removedElement = array.pop(); //[0, 1, 2, 3, 4, 5] console.log(removedElement); //6 console.log(array); //[0, 1, 2, 3, 4, 5]
3. Remove Item from Start using array.shift()
The array.shift() method removes an item from the beginning of the array and shifts the existing items to the left. It returns the element that has been removed. If the array is empty, undefined is returned, and the array is not modified.
let removedElement = array.shift();
Let us see an example of shifting the array items.
let array: number[] = [0, 1, 2, 3, 4, 5, 6]; removedElement = array.shift(); //[1, 2, 3, 4, 6] console.log(removedElement); //0 console.log(array); //[1, 2, 3, 4, 5, 6]
4. Removing Items at Specified Index Position using splice()
Sometimes, we will need to remove the items in an array at the specified index position. We can use the array.splice() method for this purpose. To remove an item via its index, first, we need to find the index of the item.
The splice() method returns an array of the elements that have been removed from the array. The syntax of splice() method is:
let removedElementsArray = array.splice(index, countOfElemsToRemove);
- index − Index at which to start changing the array.
- countOfElemsToRemove − An integer indicating the number of elements to remove.
In the following example, we are adding new elements from index location 2. Notice that splice() method modifies the original array.
let array: number[] = [0, 1, 2, 3, 4, 5, 6]; let index = array.indexOf(1); let elementsToRemove = 2; let removedElementsArray = array.splice(index, elementsToRemove); console.log(removedElementsArray); //[1, 2] console.log(array); //[0, 3, 4, 5, 6]
5. Removing All Matching Items from Array using filter()
If we want to remove multiple items of the same value from the array, we can use the filter() method. Notice that filter() method does not change the original array, rather it creates a new array of the remaining items.
let array: number[] = [0, 1, 1, 2, 3, 5, 6]; //Remove all elements with value '1' let itemIndex = array.indexOf(3); let newArray = array.filter((e, i) => e !== 1); console.log(array); //[0, 1, 1, 2, 3, 5, 6] console.log(newArray); //[0, 2, 3, 5, 6]
6. Remove Item without Resizing the Array using delete Operator
It is not recommended, and we should use it carefully. The delete keyword removes the element from the array without changing the length of the array. The array.length remains same before and after the delete operation and thus can produce incorrect results if not used carefully.
let array: number[] = [0, 1, 2, 3, 5, 6]; //Delete the value at specified index without resizing the array delete array[1]; //[0, , 2, 3, 5, 6] console.log(array.length); //6 console.log(array[1]); //undefined
We can see the issue during iterating the array as iteration happened only 5 times in the above example. The deleted key in the array is not part of the iteration.
let array: number[] = [0, 1, 2, 3, 5, 6]; delete array[1]; //[0, , 2, 3, 5, 6] array.forEach((element, index) => console.log(index)); // 0 2 3 4 5 6
This tutorial taught us to remove items from an array in TypeScript. We learned to remove items from the beginning, from the end and from any specified index location. We also learned to delete elements without resizing the array.
Remove an Array Item in TypeScript
- Use splice() to Remove an Array Item in TypeScript
- Use shift() to Remove an Array Item in TypeScript
- Use pop() to Remove an Array Item in TypeScript
- Use delete Operator to Remove an Array Item in TypeScript
Removing an array item can be achieved using multiple methods in TypeScript. The methods that are used to achieve the above functionalities are splice() , shift() , pop() , and delete operator.
In this post, we’ll look at several different methods for removing an array item using TypeScript.
Use splice() to Remove an Array Item in TypeScript
- It does not create a new object, and it removes the item instantly.
- After removing an element, it does not leave the array index as null but rather appropriately updates the array.
array.splice(array_index, no_of_elements, [element1][, . elementN]);
- array_index : Specifies where the alteration should begin.
- no_of_elements : Specifies the number of elements that should be removed after the specified array_index .
- element1 : The element/elements that should be added to the array, if there is/are any.
let array = ["white", "yellow", "black", "green", "blue"]; let removed = array.splice(3, 1, "red"); console.log("The new array is : " + array ); console.log("The color that was removed is : " + removed);
The new array is : white,yellow,black,red,blue The color that was removed is: green
Use shift() to Remove an Array Item in TypeScript
The shift() method can delete an element from an array in TypeScript, but its capacity is limited. Using shift() is only possible to remove the first element of a particular array and return it.
Furthermore, it has no arguments that need to be passed to the function as it only does one task.
let array = ["white", "yellow", "black", "green", "blue"].shift(); console.log("The removed color is : " + array );
The removed color is : white
Use pop() to Remove an Array Item in TypeScript
pop() has similar functionality as shift() , but the difference between the two functions is that while shift() removes the first element of an array, pop() removes the last element of an array and returns it.
let array = ["white", "yellow", "black", "green", "blue"].pop(); console.log("The removed color is : " + array );
The removed color is : blue
Use delete Operator to Remove an Array Item in TypeScript
The delete operator in TypeScript completely deletes the value of the property and the object’s property, but we can still achieve the functionality of removing elements using the operator. The property cannot be used again when deleted unless it is added back again.
Using the delete operator is not recommended as we can achieve the same result in a much more efficient and safe way by using the methods of splice() , shift(), and pop() .
let array = ["white", "yellow", "black", "green", "blue"]; delete array[1]; console.log("The array after deletion : " + array);
The array after deletion : white,,black,green,blue
Nimesha is a Full-stack Software Engineer for more than five years, he loves technology, as technology has the power to solve our many problems within just a minute. He have been contributing to various projects over the last 5+ years and working with almost all the so-called 03 tiers(DB, M-Tier, and Client). Recently, he has started working with DevOps technologies such as Azure administration, Kubernetes, Terraform automation, and Bash scripting as well.