Непонятные undefined
Есть строка
const s = 'Давно выяснено, что при <colored>оценке</colored> дизайна и <tooltip>композиции читаемый</tooltip> текст мешает'
Нужно разбить ее на части, где разделителем являются теги и их содержимое. Написал регулярку, разбил но в результирующем массиве появились непонятные undefined от куда они, как исправить регулярку что бы их не было ?
const s = 'Давно выяснено, что при <colored>оценке</colored> дизайна и <tooltip>композиции читаемый</tooltip> текст мешает'
console.log(s.split(/\s*(<colored\s*.*>.*<\/colored>)\s*|\s*(<tooltip\s*.*>.*<\/tooltip>)\s*/));Ответы (1 шт):
undefined происходит от того, что все группы в скобках должны добавить в массив своё соответствие. У вас каждый раз при выборе из возможных вариантов (символ |) одна пара имеет соответствие, а другая нет, она-то и производит undefined.
Вместо скобок, чтобы сохранить разделители, можно использовать загляднывание вперёд и назад нулевой длины. При них, правда, станут мешать опциональные пробелы по бокам тегов, они произведут дополнительные элементы массива с пробелами. Поэтому их можно убрать из регулярки и заменить на обработку элементов при помощи trim():
const s = 'Давно выяснено, что при <colored>оценке</colored> дизайна и <tooltip>композиции читаемый</tooltip> текст мешает'
console.log(
s.split(/(?=<colored\b.*?>.*?<\/colored>|<tooltip\b.*?>.*?<\/tooltip>)|(?<=<colored\b.*?>.*?<\/colored>|<tooltip\b.*?>.*?<\/tooltip>)/)
.map(substring => substring.trim())
);Однако некоторые старые браузеры и Safari не поддерживают заглядывание назад, так что проверяйте ваш целевой диапазон: