Javascript массив очистить массив

How to Clear an Array in JavaScript

Clearing an array in JavaScript means removing all the elements in the array and leaving an empty array. Here’s 3 ways to clear out an array:

array.length = 0

The simplest solution is to assign the array’s length to the value of 0. The array length property is writable.

let array = [1, 2, 3, 4, 5]; array.length = 0; array; // []

array.splice(0, array.length)

A more verbose approach is to use the splice() method. This function will return a copy of the array before deleting the entries, which is helpful if you want to do a reassignment before clearing the array.

let array = [1, 2, 3, 4, 5]; let anotherArray = array.splice(0, array.length); anotherArray; // [1, 2, 3, 4, 5] array; // [] anotherArray === array; // false

array = []

If you want to avoid mutating the arrays in place for immutability, you can overwrite the array with an empty array [] .

let obj = < array: [1, 2, 3, 4, 5] >; obj = < . obj, array: [] >; obj.array.length; // 0

More Fundamentals Tutorials

Источник

How to Clear a JavaScript Array – JS Empty Array

Dillion Megida

There are multiple ways to empty an existing array in JavaScript. Emptying an array means removing all values from it.

In this article, I’ll show and explain two ways to clear an array.

1. How to Clear an Array by Modifying the Length Property

The length property of an array is readable and writeable.

When you read the property ( array.length ), it returns the length of the array, which is the number of values in it. When you write the property (that is, modify the array, like array.length = 10 ), it changes the length of the array and the number of values in it.

If the modified length is smaller than the original length, excess values will be removed. Here is what I mean:

const array = [1, 2, 3] array.length = 2 console.log(array) // [1, 2] 

Because the new length is smaller than the original, the excess value (3, in this case) is removed.

However, if the new length is larger than the original length, the array will be filled with undefined values to make up for the new length:

const array = [1, 2, 3] array.length = 4 console.log(array) // [1, 2, 3, undefined] 

Now that you understand how you can use the length property to modify an array, here’s how to empty an array:

const array = [1, 2, 3] array.length = 0 console.log(array) // [] 

With a length of 0, every value in the array gets removed, and the array becomes empty.

2. How to Empty an Array by Reassigning Values

You can reassign a new value (an empty array) to a variable that initially has a non-empty array assigned to it.

If you declare a variable with const , you cannot reassign it:

const array = [1, 2, 3] array = [] console.log(array) 

The above code will throw a TypeError: Assignment to constant variable error. But if you declared this variable with let , then you can reassign it with an empty array value:

let array = [1, 2, 3] array = [] console.log(array) // [] 

Now, you have the empty array.

Thank you for reading, and happy coding!

Dillion Megida

Developer Advocate and Content Creator passionate about sharing my knowledge on Tech. I simplify JavaScript / ReactJS / NodeJS / Frameworks / TypeScript / et al My YT channel: youtube.com/c/deeecode

If you read this far, tweet to the author to show them you care. Tweet a thanks

Learn to code for free. freeCodeCamp’s open source curriculum has helped more than 40,000 people get jobs as developers. Get started

freeCodeCamp is a donor-supported tax-exempt 501(c)(3) charity organization (United States Federal Tax Identification Number: 82-0779546)

Our mission: to help people learn to code for free. We accomplish this by creating thousands of videos, articles, and interactive coding lessons — all freely available to the public. We also have thousands of freeCodeCamp study groups around the world.

Donations to freeCodeCamp go toward our education initiatives, and help pay for servers, services, and staff.

Источник

13 полезных приёмов по работе с массивами в JavaScript, которые могут вам пригодиться

Массивы являются одной из самых популярных структур данных в JavaScript, потому что они используются для хранения данных. Кроме этого, массивы дают много возможностей для работы с этими самыми данными. Понимая, что для тех, кто находится в начале пути изучения JavaScript, массивы являются одной из самых основных тем, в этой статье я хотел бы познакомить вас с некоторыми полезными трюками, о которых вы могли не знать. Давайте начнем.

1. Как в массиве оставить только уникальные значения

Это очень популярный вопрос во время интервью на позицию Javascript-разработчика. Вот быстрое и простое решение этой задачки. Для начала вам нужно получить уникальные значения массива, для этого можно использовать new Set() (прим. перев.: структура данных Set хранит только уникальные значения). Далее нужно преобразовать структуру данных Set в массив. Я хочу познакомить вас с двумя способами, как это можно сделать: первый – с помощью метода from() , второй – с помощью оператора spread ( «…» ).

const fruits = ['banana', 'apple', 'orange', 'watermelon', 'apple', 'orange', 'grape', 'apple']; // Первый метод const uniqueFruits = Array.from(new Set(fruits)); console.log(uniqueFruits); // вернет ['banana', 'apple', 'orange', 'watermelon', 'grape'] // Второй метод const uniqueFruits2 = [. new Set(fruits)]; console.log(uniqueFruits2); // вернет ['banana', 'apple', 'orange', 'watermelon', 'grape'] 

2. Как заменить значения в массиве

Бывают такие ситуации, когда нужно заменить значения в массиве другими значениями. Для этого существует хороший метод, о котором вы, возможно, не знали – метод splice(start, value to remove, values to add) , где start – номер индекса, начиная с которого мы хотим удалить элементы массива, value to remove – число элементов, которые мы хотим удалить, а values to add – элементы, которые мы хотим вставить на место удаленных:

const fruits = ['banana', 'apple', 'orange', 'watermelon', 'apple', 'orange', 'grape', 'apple']; fruits.splice(0, 2, 'potato', 'tomato'); console.log(fruits); // вернет ["potato", "tomato", "orange", "watermelon", "apple", "orange", "grape", "apple"] 

3. Как трансформировать массив, не используя метод map()

Наверное, все знают метод массива map() , но есть и другое решение, которое может быть использовано для получения аналогичного эффекта и чистого кода. Для этого мы можем воспользоваться методом from() :

const friends = [ < name: 'John', age: 22 >, < name: 'Peter', age: 23 >, < name: 'Mark', age: 24 >, < name: 'Maria', age: 22 >, < name: 'Monica', age: 21 >, < name: 'Martha', age: 19 >, ] const friendsNames = Array.from(friends, () => name); console.log(friendsNames); // вернет ['John', 'Peter', 'Mark', 'Maria', 'Monica', 'Martha'] 

4. Как быстро очистить массив

Например, у нас есть массив, в котором много элементов. Нам нужно его очистить (неважно для какой цели), при этом мы не хотим удалять элементы один за другим. Это очень просто сделать одной строчкой кода. Чтобы очистить массив, нам нужно установить длину массива в 0, и всё!

const fruits = ['banana', 'apple', 'orange', 'watermelon', 'apple', 'orange', 'grape', 'apple']; fruits.length = 0; console.log(fruits); // вернет [] 

5. Как преобразовать массив в объект

Бывает такая ситуация: у нас есть массив, но нам нужен объект (опять неважно для какой цели) с этими данными, и самый быстрый способ преобразовать массив в объект – это использовать оператор spread ( «. « ):

const fruits = ['banana', 'apple', 'orange', 'watermelon', 'apple', 'orange', 'grape', 'apple']; const fruitsObj = < . fruits >; console.log(fruitsObj); // вернет

6. Как заполнить массив одинаковыми значениями

Бывают разные ситуации, когда мы хотим создать массив и заполнить его некоторыми значениями, или нам нужен массив с одинаковыми значениями. Метод fill() для подобных задач является отличным решением:

const newArray = new Array(10).fill('1'); console.log(newArray); // вернет ["1", "1", "1", "1", "1", "1", "1", "1", "1", "1"] 

7. Как объединить более двух массивов

Вы знаете, как объединить массивы в один, не используя метод concat() ? Существует простой способ объединить любое количество массивов в один массив одной строчкой кода. Как вы, вероятно, уже поняли, оператор spread ( «. « ) является довольно полезным инструментом при работе с массивами, как и в этом случае:

const fruits = ['apple', 'banana', 'orange']; const meat = ['poultry', 'beef', 'fish']; const vegetables = ['potato', 'tomato', 'cucumber']; const food = [. fruits, . meat, . vegetables]; console.log(food); // вернет ["apple", "banana", "orange", "poultry", "beef", "fish", "potato", "tomato", "cucumber"] 

8. Как найти пересечение двух массивов

С этой задачей вы можете столкнуться на любом JavaScript-собеседовании, потому что ее решение показывает ваши знания методов массива, а также то, как вы мыслите. Чтобы найти общие значения двух массивов, мы будем использовать один из ранее рассмотренных методов в этой статье, чтобы убедиться, что значения в массиве, который мы проверяем, не дублируются. Кроме этого, мы воспользуемся методами filter() и includes() . В результате мы получим массив с элементами, которые представлены в обоих массивах:

const numOne = [0, 2, 4, 6, 8, 8]; const numTwo = [1, 2, 3, 4, 5, 6]; const duplicatedValues = [. new Set(numOne)].filter(item => numTwo.includes(item)); console.log(duplicatedValues); // вернет [2, 4, 6] 

9. Как удалить ложные значения из массива

Для начала, давайте определим ложные значения. В Javascript ложными значениями являются: false , 0, «», null , NaN и undefined . Теперь мы можем выяснить, как удалить такие значения из нашего массива. Для достижения этой цели нам потребуется метод filter() :

const mixedArr = [0, 'blue', '', NaN, 9, true, undefined, 'white', false]; const trueArr = mixedArr.filter(Boolean); console.log(trueArr); // вернет ["blue", 9, true, "white"] 

10. Как получить рандомное значение массива

Иногда нам нужно выбрать рандомное значение массива. Чтобы решение было простым, коротким и быстрым, мы можем получить случайный номер индекса в соответствии с длиной массива. Посмотрите на этот пример:

const colors = ['blue', 'white', 'green', 'navy', 'pink', 'purple', 'orange', 'yellow', 'black', 'brown']; const randomColor = colors[(Math.floor(Math.random() * (colors.length)))]; console.log(randomColor); // вернет рандомный цвет из массива 

11. Как развернуть массив в обратную сторону

Когда нам нужно «перевернуть» наш массив, нет необходимости создавать его через сложные циклы и функции, потому что есть простой метод массива reverse() , который делает все это за нас, и одной строчкой кода мы можем «перевернуть» наш массив:

const colors = ['blue', 'white', 'green', 'navy', 'pink', 'purple', 'orange', 'yellow', 'black', 'brown']; const reversedColors = colors.reverse(); console.log(reversedColors); // вернет ["brown", "black", "yellow", "orange", "purple", "pink", "navy", "green", "white", "blue"] 

12. Метод lastIndexOf()

В JavaScript есть интересный метод lastIndexOf(elem) , который позволяет найти индекс последнего вхождения элемента elem . Например, если наш массив имеет дублированные значения, мы можем найти позицию последнего вхождения в него. Взгляните на следующий пример кода:

const nums = [1, 5, 2, 6, 3, 5, 2, 3, 6, 5, 2, 7]; const lastIndex = nums.lastIndexOf(5); console.log(lastIndex); // вернет 9 

13. Как просуммировать все значения в массиве

Еще один популярный вопрос во время собеседования на позицию JavaScript-разработчика. Сумму всех элементов можно найти одной строчкой кода, если знать метод reduce() :

const nums = [1, 5, 2, 6]; const sum = nums.reduce((x, y) => x + y); console.log(sum); // вернет 14 

Заключение

В этой статье я познакомил вас с 13 полезными приёмами, которые помогут вам писать чистый и краткий код. Кроме этого, не забывайте, что есть много различных трюков, которые вы можете использовать в Javascript и которые стоит изучить не только для работы с массивами, но и для других структур данных. Я надеюсь, что вам понравились решения, представленные в статье, и вы будете использовать их для улучшения процесса разработки.

Источник