Как убрать запятые при выводе массива js
Перейти к содержимому

Как убрать запятые при выводе массива js

  • автор:

Array.prototype.join()

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

Интерактивный пример

Синтаксис

arr.join([separator])

Параметры

separator Необязательный

Определяет строку, разделяющую элементы массива. В случае необходимости тип разделителя приводится к типу Строка. Если он не задан, элементы массива разделяются запятой ‘,‘. Если разделитель — пустая строка, элементы массива ничем не разделяются в возвращаемой строке.

Возвращаемое значение

Строка, содержащая все элементы массива. Если arr.length == 0 , то будет возвращена пустая строка.

Описание

Преобразует все элементы массива в строки и объединяет их в одну большую строку. Элемент массива с типом undefined или null преобразуется в пустую строку.

Примеры

Соединение массива четырьмя различными способами

В следующем примере создаётся массив a с тремя элементами, затем они четыре раза объединяются в строку: с использованием разделителя по умолчанию, запятой с пробелом, плюса, окружённого пробелами, и пустой строки.

var a = ["Ветер", "Дождь", "Огонь"]; var myVar1 = a.join(); // присвоит 'Ветер,Дождь,Огонь' переменной myVar1 var myVar2 = a.join(", "); // присвоит 'Ветер, Дождь, Огонь' переменной myVar2 var myVar3 = a.join(" + "); // присвоит 'Ветер + Дождь + Огонь' переменной myVar3 var myVar4 = a.join(""); // присвоит 'ВетерДождьОгонь' переменной myVar4 

Соединение элементов массивоподобного объекта

В следующем примере соединяется массивоподобный объект (в данном случае список аргументов функции) с использованием вызова Function.prototype.call для Array.prototype.join .

function f(a, b, c)  var s = Array.prototype.join.call(arguments); console.log(s); // '1,a,true' > f(1, "a", true); 

Спецификации

Specification
ECMAScript Language Specification
# sec-array.prototype.join

Совместимость с браузерами

BCD tables only load in the browser

Смотрите также

  • String.prototype.split()
  • Array.prototype.toString()
  • TypedArray.prototype.join()

Found a content problem with this page?

  • Edit the page on GitHub.
  • Report the content issue.
  • View the source on GitHub.

This page was last modified on 20 янв. 2024 г. by MDN contributors.

Your blueprint for a better internet.

MDN

Support

  • Product help
  • Report an issue

Our communities

Developers

  • Web Technologies
  • Learn Web Development
  • MDN Plus
  • Hacks Blog
  • Website Privacy Notice
  • Cookies
  • Legal
  • Community Participation Guidelines

Visit Mozilla Corporation’s not-for-profit parent, the Mozilla Foundation.
Portions of this content are ©1998– 2024 by individual mozilla.org contributors. Content available under a Creative Commons license.

Удалить запятые из массива JS

У меня есть массив. Он отображает название и цену товара и кнопку, а после кнопки запятая, как убрать запятую?

const products = [< id: 1, title: 'Notebook', price: 1000 >, < id: 2, title: 'Mouse', price: 100 >, < id: 3, title: 'Keyboard', price: 250 >, < id: 4, title: 'Gamepad', price: 150 >, ]; const renderProduct = (title, price) => < return `
$

$

`; >; const renderProducts = list => < const productList = list.map(item =>renderProduct(item.title, item.price)); document.querySelector('.products').innerHTML = productList; >; renderProducts(products);

Отслеживать
4,037 2 2 золотых знака 12 12 серебряных знаков 28 28 бронзовых знаков
задан 9 янв 2022 в 11:00
15 1 1 серебряный знак 5 5 бронзовых знаков
Не надо так данные в разметку подставлять.
9 янв 2022 в 11:29

2 ответа 2

Сортировка: Сброс на вариант по умолчанию

При присваивании массива свойству .innerHTML , у него автоматически вызывается метод .toString , который эквивалентен вызову метода .join(‘,’) .

Таким образом, если разделители не нужны, необходимо вызвать .join явно, передав ему в качества параметра пустую строку:

.innerHTML = productList.join('') 

Отслеживать
ответ дан 9 янв 2022 в 11:07
81.1k 9 9 золотых знаков 78 78 серебряных знаков 135 135 бронзовых знаков
Да! Супер, спасибо!
9 янв 2022 в 11:11

Так как Вы используете innerHTML которое ожидает в качестве объекта приваивания строку, будет логичнее использовать функцию массива reduce которая может использоваться для массива в любой легальный объект, в данном случае в строку:

const products = [< id: 1, title: 'Notebook', price: 1000 >, < id: 2, title: 'Mouse', price: 100 >, < id: 3, title: 'Keyboard', price: 250 >, < id: 4, title: 'Gamepad', price: 150 >, ]; const renderProduct = (title, price) => < return `
$

$

`; >; const renderProducts = list => < const productList = list.reduce((acc, item) =>acc + renderProduct(item.title, item.price), ''); document.querySelector('.products').innerHTML = productList; >; renderProducts(products);

String.prototype.trim()

Метод trim() удаляет пробельные символы с начала и конца строки. Пробельными символами в этом контексте считаются все собственно пробельные символы (пробел, табуляция, неразрывный пробел и прочие) и все символы конца строки (LF, CR и прочие).

Синтаксис

str.trim()

Описание

Метод trim() возвращает строку с вырезанными пробельными символами с её концов. Метод trim() не изменяет значение самой строки.

Примеры

Пример: использование метода trim()

Следующий пример покажет строку ‘foo’ :

var orig = " foo "; console.log(orig.trim()); // 'foo' // Другой пример, в котором .trim() убирает пробельные символы только с одной стороны. var orig = "foo "; console.log(orig.trim()); // 'foo' 

Полифил

Запуск следующего кода до любого другого создаст метод trim() , если он ещё не реализуется браузером.

if (!String.prototype.trim)  (function ()  // Вырезаем BOM и неразрывный пробел String.prototype.trim = function ()  return this.replace(/^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g, ""); >; >)(); > 

Спецификации

Specification
ECMAScript Language Specification
# sec-string.prototype.trim

Совместимость с браузерами

BCD tables only load in the browser

Смотрите также

  • String.prototype.trimLeft() Non-standard
  • String.prototype.trimRight() Non-standard

Found a content problem with this page?

  • Edit the page on GitHub.
  • Report the content issue.
  • View the source on GitHub.

This page was last modified on 20 янв. 2024 г. by MDN contributors.

Your blueprint for a better internet.

MDN

Support

  • Product help
  • Report an issue

Our communities

Developers

  • Web Technologies
  • Learn Web Development
  • MDN Plus
  • Hacks Blog
  • Website Privacy Notice
  • Cookies
  • Legal
  • Community Participation Guidelines

Visit Mozilla Corporation’s not-for-profit parent, the Mozilla Foundation.
Portions of this content are ©1998– 2024 by individual mozilla.org contributors. Content available under a Creative Commons license.

Как убрать запятые при выводе массива js

Сформировали список тэгов, расставляя после каждого «,». После последнего тоже запятая… надо убрать.

Наверное многие это уже знают, но всё же:

$str = 'tag1, tag2, tag3,'; echo substr($str, 0, -1);

Кстати, это можно решить ещё во время формирования строки.

Комментарии RSS по email OK

Psih 17 июля 2008 г., 17:56:02

Можно ещё проще $str = ‘tag1, tag2, . tagN,’; $str = trim($str, ‘,’); Как решить во время форматирования я тоже отписал свой вариант в той записи.

Ktulhu 17 июля 2008 г., 17:56:08

Позволю с вами совсем не согласиться. Для этого есть chop() (который алиас rtrim()) Вызывается легко и непринужденно chop($str, ‘,’); А еще лучше chop($str, ‘ ,’); Объясню почему — в конце строки у вас может получиться так, что будет мусор, типа » , «. Тогда вам придется делать echo substr(trim($str), 0, -1); — что есть ненужная нагрузка, когда есть chop, которому мы в конце скармливаем список символов для рубки 🙂

Sam 17 июля 2008 г., 18:29:53

Ktulhu trim тоже принимает список символов, но chop конечно более подходящая штука для данного случая.

Евгений 17 июля 2008 г., 19:03:56

А зачем формировать список тегов именно так, не удобней ли: $tags = array(‘tag1’, ‘tag2’, ‘tag3’); echo implode(‘, ‘, $tags);

Sam 17 июля 2008 г., 19:09:02

Чаще всего удобней, но иногда не выходит. Например, если массив многомерный… это не обязательно тэги.

$links = array( 0 => array( 'name' => 'link1', 'link' => 'http://name1.com/'), 1 => array( 'name' => 'link2', 'link' => 'http://name2.com/'), );

Splurov 17 июля 2008 г., 21:30:47
Sam, тогда так может проще? 🙂

$result = array(); foreach ( $links as $v )  $result[] = '' . $v[ 'link' ] . '">' . $v[ 'name' ] . ' '; > $result = implode( ', ', $result );

Sam 17 июля 2008 г., 21:40:11

Splurov Так немного медленней, чем с формированием строки и chop(). Проявляется при обработке массива от 1000 элементов.

Splurov 17 июля 2008 г., 22:05:52
Sam, к счастью, нам не приходиться выводить пользователю списки из тысячи и более составляющих
Евгений 18 июля 2008 г., 2:03:08

Ну я то именно такой массив для тегов и представлял, но не хотел менять исходные данные. Потестил тут немного для массива вида:

$links = array( 0 => array( 'name' => 'link1', 'link' => 'http://name1.com/'), 1 => array( 'name' => 'link2', 'link' => 'http://name2.com/'), );~~~ три варианта: 1) [code=php]function html_link($v)  return '' . $v[ 'link' ] . '">' . $v[ 'name' ] . ' '; > $result = implode(', ', array_map('html_link', $links));

2) как предложил Splurov [code=php]$result = array(); foreach ( $links as $v ) < $result[] = '' . $v[ 'name' ] . ''; > $result = implode( ‘, ‘, $result );

3) без массивов с chop

[php] $result = »; foreach ( $links as $v ) < $result .= '' . $v[ 'name' ] . ', '; > $result = chop($result, ‘ ,’); ~~~ Для массива $links из 10 элементов (как наиболее типичный для тегов) и 100000 повторений получилось (в секундах все): 1) 7.84984397888 2) 2.80158305168 3) 2.40084600449, просто сборка без chop 1.68192100525

Евгений 18 июля 2008 г., 2:07:38
Не очень удачно запостился коммент, предварительный просмотр не повредил бы. 1)

function html_link($v)  return '' . $v[ 'link' ] . '">' . $v[ 'name' ] . ' '; > $result = implode(', ', array_map('html_link', $links));
$result = array(); foreach ( $links as $v )  $result[] = '' . $v[ 'link' ] . '">' . $v[ 'name' ] . ' '; > $result = implode( ', ', $result );

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *