Здравствуйте и добро пожаловать в Codipher. Сегодня в этой статье мы узнаем, как преобразовать массив в строку в JavaScript. Мы поймем 4 простых метода преобразования массива в строку в JavaScript. Кроме того, мы будем использовать реальное использование этих методов. Так что не теряя времени. Начнем с первого метода.

преобразовать массив в строку в javascript

Как преобразовать массив в строку в JavaScript

1. Использование метода toString()

Использование метода toString() для любого массива (например, Array.toString()) вернет строковое представление элементов массива.

Синтаксис

Array.toString()

Этот метод не принимает никаких параметров. Этот метод возвращает строку со всеми значениями массива, разделенными запятыми.

Также прочтите: Объяснение функций высшего порядка JavaScript

  • имеют пустое строковое представление, поэтому они будут преобразованы в пустую строку.
  • Также метод toString() не изменяет исходный массив.

2. Использование метода Array.join()

Метод array.join() объединяет все элементы массива в строку и возвращает эту строку. Элементы результирующей строки будут разделены указанным разделителем.

Синтаксис

Array.join(separator)

Этот метод принимает один параметр. Этот параметр является «разделителем». Значение по умолчанию для этого разделителя — запятая.

Что такое сепаратор

Разделитель — это строка, которая разделяет каждую пару соседних элементов массива в результирующей строке.

Этот метод возвращает строку со всеми значениями массива, разделенными указанным разделителем.

Также прочтите:Последние функции JavaScript, которые должен знать каждый веб-разработчик

Пример

let fruits = ['apple', 'mango', 'banana', 'orange'] console.log(fruits.join(" ")) //output- apple mango banana orange console.log(fruits.join(";")) //output- apple;mango;banana;orange console.log(fruits.join()) //output- apple,mango,banana,orange

Этот метод не изменит исходный массив.

3. Приведение массива к строке

Мы можем воспользоваться преимуществами типа принуждения в JavaScript. Мы знаем, что оператор + складывает два числа или объединяет две строки. Но что произойдет, если мы присоединим массив с помощью чего-то другого, кроме оператора +.

Поскольку JavaScript — язык со свободной типизацией, он не приведет к сбою нашей программы. Вместо этого он знает, как объединять строки, он преобразует все в строку.

Пример

let fruits = ['apple', 'mango', 'banana', 'orange'] console.log(fruits + "") //output- apple,mango,banana,orange console.log(fruits + []) //output- apple,mango,banana,orange

4. Использование метода JSON.stringify()

Что, если у нас есть вложенный массив. Такой вот массив массивов. Последние 3 метода не будут работать должным образом на вложенных массивах, здесь вам нужно будет использовать метод JSON.stringify().

Также читайте:Ускорьте работу своего веб-сайта с помощью этих простых советов по CSS

Метод JSON.stringify() преобразует объект JavaScript или любое значение в строку.

Пример

let fruits = ['apple', 'mango', 'banana', 'orange'] let nestedFruits = ['apple', ['mango'], 'banana', 'orange'] console.log(JSON.stringify(fruits)) //output- ["apple, "mango", "banana", "orange"] console.log(JSON.stringify(nestedFruits)) //output- ["apple, ["mango"], "banana", "orange"]

Как очистить массив в javascript

Есть 3 способа очистить массив в javascript. Давайте посмотрим на эти 3 способа.

1. Установка свойства длины на 0 (ноль)

При установке для array.length значения 0 все элементы массива будут удалены.

let arr = [1, 2, 3, 4, 5] arr.length = 0 console.log(arr) //output- []

ПРИМЕЧАНИЕ. Этот метод изменяет исходную ссылку. Это означает, что вы будете присваивать одну ссылку на массив другой с помощью оператора присваивания (=). Применение этого метода к одному массиву очистит два других.

2. Присвоение новому пустому массиву

Это самый быстрый способ. Это установит arr в новый пустой массив. Это идеально, если у вас нет ссылок из других мест на оригинальный обр.

Если вы это сделаете, эти ссылки не будут обновлены, и в этих местах будет продолжать использоваться старый массив.

let arr = [1, 2, 3, 4, 5] arr = [] console.log(arr) //output- []

3. Использование метода splice()

Вы можете использовать метод splice() для удаления всех элементов из массива.

let arr = [1, 2, 3, 4, 5] arr.splice(0, arr.length) console.log(arr) //output- []

В методе splice() первым аргументом является индекс массива, с которого начинается удаление элемента.

Второй аргумент — это количество элементов, которые вы хотите удалить из элемента индекса.

Методы Javascript, которые вы должны знать

1. в строку

Метод toString возвращает строку, представляющую исходный код функции.

function sum(a, b) { return a + b } console.log(sum.toString()) //expected output: "function sum(a, b) { // return a + b // } console.log(Math.abs.toString()) //expected output: "function abs() { [native code] }"

2. Нажмите

Метод push добавляет один или несколько элементов в конец массива.

const animals = ['pigs', 'goats', 'sheep'] const count = animals.push('cows') console.log(count) //expected output: 4 console.log(animals) //expected output: Array ['pigs', 'goats', 'sheep', 'cows'] animals.push('chickens', 'cats', 'dogs') console.log(animals) //expected output: Array ['pigs', 'goats', 'sheep', 'cows', 'chickens', 'cats', 'dogs']

3. Поп

Метод pop изменяет длину массива. Он удаляет последний элемент и возвращает этот элемент.

const plants = ['broccoli', 'cauliflower', 'cabbage', 'kale', 'tomato'] console.log(plants.pop()) //expected output: 'tomato' console.log(plants) //expected output: Array ['broccoli', 'cauliflower', 'cabbage', 'kale'] plants.pop() console.log(plants) //expected output: ['broccoli', 'cauliflower', 'cabbage']

4. Реверс

Метод reverse переворачивает массив на месте. Первый элемент массива становится последним, а последний становится первым.

const array1 = ['one', 'two', 'three'] console.log('array1:', array1) //expected output: 'array1:" Array ["one", "two", "three"] const reversed = array1.reverse() console.log('reversed:', reversed) //expected output: "reversed:" Array ["three", "two", "one"] //careful reverse is destructive -- it changes the original array console.log('array1:', array1) //expected output: "array1:" Array ["three", "two", "one"]

5. индекс

Метод indexOf возвращает индекс в вызывающем строковом объекте первого вхождения указанного значения.

const str = 'Brawe new world' console.log('Index of first w from start is ' + str.indexOf('w)) //logs- 8 console.log('Index of "new" from start is ' + str.indexOf('new')) //logs- 6

6. Поиск

Метод поиска выполняет поиск соответствия между регулярным выражением и строковым объектом.

const paragraph = 'The quick brown fox jumps over the lazy dog. If the dog barked, was it really lazy?' //any character that is not a word character or whitespace const regex = /[^\w\s]/g console.log(paragraph.search(regex)) /expected output: 43 console.log(paragraph[paragraph.search(regex)]) //expected output: "."

7. Заменить

Метод replace возвращает новую строку, в которой некоторые или все совпадения шаблона заменены заменой.

let str = 'Twas the night before Xmas...' let newstr = str.replace(/xmas/i, 'Christmas') console.log(newstr) //Twas the night before Christmas

8. Присоединяйтесь

Метод соединения создает и возвращает новую строку путем объединения всех элементов массива, разделенных запятыми или заданной строкой-разделителем.

Также прочтите:Последние функции JavaScript, которые должен знать каждый веб-разработчик

const elements = ['fire', 'air', 'water'] console.log(elements.join()) //expected output: "fire,air,water console.log(elements.join('')) //expected output l: "fireairwater" console.log(elements.join('-')) //expected output: "fire-air-water

Это все для этого поста, ребята. Это 4 самых простых способа, с помощью которых вы можете преобразовать массив в строку в javascript. Надеюсь, вам понравилась эта статья и вы узнали что-то новое из этой статьи. Не забудьте оставить комментарий ниже.

Подробное руководство по перечисленным выше 4 методам см. на следующих страницах:

Хотите больше контента, подобного этому Нажмите здесь

Первоначально опубликовано на https://codipher.com 6 марта 2022 г.