ฉันจะแยกสตริงออกเป็นเซ็กเมนต์ของอักขระ n ตัวได้อย่างไร


203

ตามที่ชื่อบอกว่าฉันมีสตริงและฉันต้องการแบ่งออกเป็นส่วน ๆ ของอักขระnตัว

ตัวอย่างเช่น:

var str = 'abcdefghijkl';

หลังจากใช้เวทมนตร์n=3มันจะกลายเป็น

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

มีวิธีทำเช่นนี้หรือไม่?

คำตอบ:


361

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 ตัวสุดท้าย)
Erik

6
ใช้[\s\S]แทน.เพื่อไม่ให้ล้มเหลวในการขึ้นบรรทัดใหม่
Mike Samuel

2
คุณอาจต้องการเริ่มรอบใหม่ในทุกบรรทัด หากคุณมีการขึ้นบรรทัดใหม่จริงๆพวกเขาอาจระบุถึงการเปลี่ยนแปลงบางประเภท str.match (/. {1,3} / gm) อาจเป็นตัวเลือกที่ดีกว่า
kennebec

+1 ระวัง: ''.match(/.{1,3}/g)และ''.match(/.{3}/g)กลับมาnullแทนอาเรย์ที่ว่างเปล่า
Web_Designer

4
เป็นไปได้ไหมที่จะมีตัวแปรในตำแหน่งที่ 3
Ana Claudia

46

หากคุณไม่ต้องการใช้นิพจน์ทั่วไป ...

var chunks = [];

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

jsFiddlejsFiddle

... มิฉะนั้นโซลูชัน regex นั้นค่อนข้างดี :)


1
+1 เพราะฉันต้องการสิ่งนี้หาก3เป็นตัวแปรตามที่ OP แนะนำ สามารถอ่านได้มากกว่าการต่อสตริง regexp
David Tang

ถ้าเพียงคุณเท่านั้นที่สามารถห่อสิ่งนั้นไว้ในฟังก์ชั่นที่มีประโยชน์พร้อมใช้งานได้
mmm

1
นี่เร็วกว่าตัวเลือก regex มากกว่า 10 เท่าดังนั้นฉันจะไปกับสิ่งนี้ (ภายในฟังก์ชั่น) jsbench.github.io/#9cb819bf1ce429575f8535a211f72d5a
งาน

1
คำแถลงก่อนหน้าของฉันนำไปใช้กับ Chromium (เช่นกันฉันสายเกินไปที่จะแก้ไขความคิดเห็นก่อนหน้านี้ดังนั้นจึงเป็นคำใหม่) ใน Firefox ปัจจุบันนั้น "เพียง" เร็วขึ้น 30% บนเครื่องของฉัน
งาน

นี้คือการพัฒนาอย่างยั่งยืนในช่วงความยาวขนาดใหญ่ของสตริง?
จาค็อบชไนเดอ


9

การสร้างคำตอบก่อนหน้าสำหรับคำถามนี้ ฟังก์ชั่นต่อไปนี้จะแบ่งสตริง ( str) n-number ( 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


1
function chunk(er){
return er.match(/.{1,75}/g).join('\n');
}

ฟังก์ชั่นด้านบนเป็นสิ่งที่ฉันใช้สำหรับ Base64 chunking มันจะสร้างตัวแบ่งบรรทัด 75 ตัวเคย


replace(/.{1,75}/g, '$&\n')นอกจากนี้ยังสามารถทำ
alex

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 | EAG | อี

และที่นี่เราทำแบบเดียวกัน แต่กดไปที่อาร์เรย์:

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/ https://jsfiddle.net/maciejsikora/b6xppj4q/

ฉันพยายามเปรียบเทียบโซลูชันของฉันกับ regexp ที่เลือกให้เป็นคำตอบที่ถูกต้อง บางการทดสอบสามารถพบได้บน jsfiddle - https://jsfiddle.net/maciejsikora/2envahrk/ การทดสอบแสดงให้เห็นว่าทั้งสองวิธีมีประสิทธิภาพใกล้เคียงกันบางทีในวิธีแรกโซลูชัน regexp ดูจะเร็วขึ้นเล็กน้อย แต่ตัดสินด้วยตัวคุณเอง


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จะคืนค่าเดียว แต่ในกรณีนี้ค่าเดียวจะเกิดขึ้นเป็นอาร์เรย์และเมื่อเราส่งผ่านอักขระแต่ละตัวเราจะต่อท้ายรายการสุดท้ายในอาร์เรย์นั้น เมื่อรายการสุดท้ายในอาร์เรย์ถึงความยาวเป้าหมายเราจะเพิ่มรายการอาร์เรย์ใหม่


0

มาทีละนิดในการอภิปราย แต่ที่นี่มีรูปแบบที่แตกต่างกันเร็วกว่า substring + array เพียงเล็กน้อย

// 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 loop นั้นเร็วกว่าการทำคณิตศาสตร์แบบอินไลน์ภายในสตริงย่อย ฉันทดสอบทั้งใน Firefox และ Chrome และพวกเขาทั้งสองแสดงความเร็ว

คุณสามารถลองได้ที่นี่

โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.