Как я могу разбить строку на сегменты по n символов?

201

Как видно из заголовка, у меня есть строка, и я хочу разбить ее на сегменты по n символов.

Например:

var str = 'abcdefghijkl';

после некоторой магии n=3, он станет

var arr = ['abc','def','ghi','jkl'];

Есть ли способ сделать это?

Бен
источник

Ответы:

359

var str = 'abcdefghijkl';
console.log(str.match(/.{1,3}/g));

Примечание. Используйте {1,3}вместо того, {3}чтобы просто включить остаток для длин строк, не кратных 3, например:

console.log("abcd".match(/.{1,3}/g)); // ["abc", "d"]


Еще пара тонкостей:

  1. Если ваша строка может содержать символы новой строки ( которые вы хотите считать символом, а не разделять строку ), то .они не будут захватывать их. Используйте /[\s\S]{1,3}/вместо этого. (Спасибо @Mike).
  2. Если ваша строка пуста, то match()вернется, nullкогда вы можете ожидать пустой массив. Защитите от этого, добавив || [].

Таким образом, вы можете в конечном итоге:

var str = 'abcdef \t\r\nghijkl';
var parts = str.match(/[\s\S]{1,3}/g) || [];
console.log(parts);

console.log(''.match(/[\s\S]{1,3}/g) || []);

Дэвид Тан
источник
Технически это лучший ответ, поскольку он будет захватывать весь текст из строки, которая не делится поровну на 3 (последние 2 или 1 символы).
Эрик
6
Используйте [\s\S]вместо того, .чтобы не потерпеть неудачу на новых строках.
Майк Сэмюэль
2
Вы можете начать новый цикл в каждой строке. Если у вас действительно есть новые строки, они, вероятно, указывают на какой-то тип перехода. str.match (/. {1,3} / г) может быть лучшим выбором.
Кеннебек
+1 Осторожно: ''.match(/.{1,3}/g) и ''.match(/.{3}/g)вернуть nullвместо пустого массива.
Web_Designer
4
Возможно ли иметь переменную вместо номера 3?
Ана Клавдия
46

Если вы не хотите использовать регулярное выражение ...

var chunks = [];

for (var i = 0, charsLength = str.length; i < charsLength; i += 3) {
    chunks.push(str.substring(i, i + 3));
}

jsFiddle .

... в противном случае решение регулярных выражений довольно хорошо :)

Алекс
источник
1
+1, потому что я бы предпочел это, если 3переменная, как предложено ОП. Это более читабельно, чем объединение строки регулярного выражения.
Дэвид Тан
Если бы вы только могли превратить это в полезную функцию, готовую к использованию
ммм
1
Это более чем в 10 раз быстрее, чем параметр регулярных выражений, поэтому я хотел бы пойти с этим (внутри функции) jsbench.github.io/#9cb819bf1ce429575f8535a211f72d5a
Job
1
Мое предыдущее утверждение относится к Chromium (также я опоздал с редактированием предыдущего комментария, следовательно, нового). На Firefox в настоящее время «только» на 30% быстрее на моей машине, но это все же неизменно лучше.
Работа
это устойчиво на огромных длинах последовательности?
Якоб Шнайдер
22
str.match(/.{3}/g); // => ['abc', 'def', 'ghi', 'jkl']
maerics
источник
Это работает для 3меня, но возвращается nullс 250. 🤔
Джим
9

Опираясь на предыдущие ответы на этот вопрос; следующая функция разделит строку ( str) n-номер ( size) символов.

function chunk(str, size) {
    return str.match(new RegExp('.{1,' + size + '}', 'g'));
}

демонстрация

(function() {
  function chunk(str, size) {
    return str.match(new RegExp('.{1,' + size + '}', 'g'));
  }
  
  var str = 'HELLO WORLD';
  println('Simple binary representation:');
  println(chunk(textToBin(str), 8).join('\n'));
  println('\nNow for something crazy:');
  println(chunk(textToHex(str, 4), 8).map(function(h) { return '0x' + h }).join('  '));
  
  // Utiliy functions, you can ignore these.
  function textToBin(text) { return textToBase(text, 2, 8); }
  function textToHex(t, w) { return pad(textToBase(t,16,2), roundUp(t.length, w)*2, '00'); }
  function pad(val, len, chr) { return (repeat(chr, len) + val).slice(-len); }
  function print(text) { document.getElementById('out').innerHTML += (text || ''); }
  function println(text) { print((text || '') + '\n'); }
  function repeat(chr, n) { return new Array(n + 1).join(chr); }
  function textToBase(text, radix, n) {
    return text.split('').reduce(function(result, chr) {
      return result + pad(chr.charCodeAt(0).toString(radix), n, '0');
    }, '');
  }
  function roundUp(numToRound, multiple) { 
    if (multiple === 0) return numToRound;
    var remainder = numToRound % multiple;
    return remainder === 0 ? numToRound : numToRound + multiple - remainder;
  }
}());
#out {
  white-space: pre;
  font-size: 0.8em;
}
<div id="out"></div>

Мистер Поливирл
источник
2

Мое решение (синтаксис ES6):

const source = "8d7f66a9273fc766cd66d1d";
const target = [];
for (
    const array = Array.from(source);
    array.length;
    target.push(array.splice(0,2).join(''), 2));

Мы могли бы даже создать функцию с этим:

function splitStringBySegmentLength(source, segmentLength) {
    if (!segmentLength || segmentLength < 1) throw Error('Segment length must be defined and greater than/equal to 1');
    const target = [];
    for (
        const array = Array.from(source);
        array.length;
        target.push(array.splice(0,segmentLength).join('')));
    return target;
}

Затем вы можете легко вызвать функцию многоразовым способом:

const source = "8d7f66a9273fc766cd66d1d";
const target = splitStringBySegmentLength(source, 2);

ура

Хесус Гонсалес
источник
2
const chunkStr = (str, n, acc) => {     
    if (str.length === 0) {
        return acc
    } else {
        acc.push(str.substring(0, n));
        return chunkStr(str.substring(n), n, acc);
    }
}
const str = 'abcdefghijkl';
const splittedString = chunkStr(str, 3, []);

Чистый раствор без REGEX

seriouspat
источник
1
function chunk(er){
return er.match(/.{1,75}/g).join('\n');
}

Выше функция - это то, что я использую для чанкирования Base64. Это создаст разрыв строки на 75 символов.

Дэйв Браун
источник
Могли бы и сделать replace(/.{1,75}/g, '$&\n').
Алекс
1

Здесь мы добавляем строку с другой строкой каждые n символов:

export const intersperseString = (n: number, intersperseWith: string, str: string): string => {

  let ret = str.slice(0,n), remaining = str;

  while (remaining) {
    let v = remaining.slice(0, n);
    remaining = remaining.slice(v.length);
    ret += intersperseWith + v;
  }

  return ret;

};

если мы будем использовать выше, как так:

console.log(splitString(3,'|', 'aagaegeage'));

мы получили:

AAG | AAG | AEG | ЕАГ | е

и здесь мы делаем то же самое, но нажимаем на массив:

export const sperseString = (n: number, str: string): Array<string> => {

  let ret = [], remaining = str;

  while (remaining) {
    let v = remaining.slice(0, n);
    remaining = remaining.slice(v.length);
    ret.push(v);
  }

  return ret;

};

и затем запустите его:

console.log(sperseString(5, 'foobarbaztruck'));

мы получили:

['fooba', 'rbazt', 'ruck']

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

Александр Миллс
источник
Ваш первый фрагмент не работал должным образом. Я изменил здесь: jsfiddle.net/omarojo/ksvx2txb/261
omarojo
0

Некоторое чистое решение без использования регулярных выражений:

/**
* Create array with maximum chunk length = maxPartSize
* It work safe also for shorter strings than part size
**/
function convertStringToArray(str, maxPartSize){

  const chunkArr = [];
  let leftStr = str;
  do {

    chunkArr.push(leftStr.substring(0, maxPartSize));
    leftStr = leftStr.substring(maxPartSize, leftStr.length);

  } while (leftStr.length > 0);

  return chunkArr;
};

Пример использования - https://jsfiddle.net/maciejsikora/b6xppj4q/ .

Я также попытался сравнить свое решение с регулярным выражением, которое было выбрано в качестве правильного ответа. Некоторый тест можно найти на jsfiddle - https://jsfiddle.net/maciejsikora/2envahrk/ . Тесты показывают, что оба метода имеют одинаковую производительность, возможно, на первый взгляд решение регулярных выражений немного быстрее, но судите сами.

Мацей Сикора
источник
0

С .split:

var arr = str.split( /(?<=^(?:.{3})+)(?!$)/ )  // [ 'abc', 'def', 'ghi', 'jkl' ]

и .replaceбудет:

var replaced = str.replace( /(?<=^(.{3})+)(?!$)/g, ' || ' )  // 'abc || def || ghi || jkl'



/(?!$)/это остановить до конца /$/, без это:

var arr      = str.split( /(?<=^(?:.{3})+)/ )        // [ 'abc', 'def', 'ghi', 'jkl' ]     // I don't know why is not [ 'abc', 'def', 'ghi', 'jkl' , '' ], comment?
var replaced = str.replace( /(?<=^(.{3})+)/g, ' || ')  // 'abc || def || ghi || jkl || '

игнорирование группы /(?:... )/не нужно, .replaceно .splitэто добавляет группы в arr:

var arr = str.split( /(?<=^(.{3})+)(?!$)/ )  // [ 'abc', 'abc', 'def', 'abc', 'ghi', 'abc', 'jkl' ]
Денис Дечев
источник
0

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

const input = 'abcdefghijlkm';

// Change `3` to the desired split length.
const output = input.split('').reduce((s, c) => {let l = s.length-1; (s[l] && s[l].length < 3) ? s[l] += c : s.push(c); return s;}, []);

console.log(output);  // output: [ 'abc', 'def', 'ghi', 'jlk', 'm' ]

Он работает путем разделения строки на массив отдельных символов, а затем используется Array.reduceдля итерации по каждому символу. Обычно reduceвозвращает одно значение, но в этом случае единственным значением является массив, и, когда мы передаем каждый символ, мы добавляем его к последнему элементу в этом массиве. Как только последний элемент в массиве достигнет целевой длины, мы добавляем новый элемент массива.

Malvineous
источник
0

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

// substring + array push + end precalc
var chunks = [];

for (var i = 0, e = 3, charsLength = str.length; i < charsLength; i += 3, e += 3) {
    chunks.push(str.substring(i, e));
}

Предварительный расчет конечного значения как части цикла for выполняется быстрее, чем выполнение встроенной математики внутри подстроки. Я протестировал его в Firefox и Chrome, и они оба показывают ускорение.

Вы можете попробовать это здесь

Dragonaire
источник