Работа с массивом и строкой, как вывести такое в консоль?

Question

[Morshynska]

Есть массив массивов:

const textArray = [
   ["Hello", "world"],
   ["Brad", "came", "to", "dinner", "with", "us"],
   ["He", "loves", "tacos"]
];

Есть набор строк, условия форматирования каждой этой строки - чтобы она не превышала 16 символов и бала заключена символом " * " со всех сторон.

На выходе должно получится что-то вроде:

[
  "******************",
  "*Hello world     *",
  "*    Brad came to*",
  "*  dinner with us*",
  "*He loves tacos  *",
  "******************"
]

Comments

[t2t2t2]

let arr = textArray
  .map((i) => {
    cur = i
      .reduce(
        (sum, cur) => {
          sum[sum.length - 1].length + cur.length < 16
            ? (sum[sum.length - 1] += ` ${cur}`)
            : sum.push(cur);
          return sum;
        },
        [""]
      )
      .map((i) => i.trim());
    return cur.length > 1
      ? cur.map((elem) => "*" + elem.padStart(16, " ") + "*")
      : "*" + cur[0].padEnd(16, " ") + "*";
  })
  .flat();

let res = ["******************", ...arr, "******************"];

[Даниил Попов]

Morshynska, т.е. если строка длинее 16 символов, то она разбивается и выравнивается по правому краю?

[Morshynska]

Даниил Попов, да, там в условии вообще написано, что если строка больше 16, она разбивается и выравнивается по правому, если меньше 16, по левому, и добавляется пробелмы. И плюс везде звезды

[Morshynska]

t2t2t2, спасибо. Поработаю с вашим решением

Answer 1

[0xD34F]

const getStrs = (arrs, len) => [
  '*'.repeat(len + 2),
  ...arrs.flatMap(arr => arr
    .reduce((acc, n) => {
      let g = acc[acc.length - 1];
      (g && (g[1] + n.length + !!g[0].length) <= len) || acc.push(g = [ [], 0 ]);
      g[1] += n.length + !!g[0].length;
      g[0].push(n);
      return acc;
    }, [])
    .map((n, i, a) => `*${n[0].join(' ')[a.length > 1 ? 'padStart' : 'padEnd'](len, ' ')}*`)),
  '*'.repeat(len + 2),
];


console.log(getStrs(textArray, 16));

Answer 2

[Даниил Попов]

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

[
  "*".repeat(18),
  ...textArray
    .map(words => words.join(" "))
    .map(line => {
      const pad = (line.length > 16)?''.padStart:''.padEnd;
      const lines = [];
      let restLine = line;
      while(restLine.length > 16) {
        const spaceIndex = restLine.lastIndexOf(" ", 16);
        lines.push(pad.call(restLine.slice(0, spaceIndex), 16));
        restLine = restLine.slice(spaceIndex + 1);
      }
      lines.push(pad.call(restLine, 16));
      return lines;
    })
    .flat()
    .map(line => "*" + line + "*"),
  "*".repeat(18)
]

Но если вы хотите, чтобы вас поняли и, самое главное, вы поняли, что написали, то лучше делать так:

function formatTextArray(textArray, maxLineLength = 16) {
  const formatedTextArray = [];
  
  textArray
    .forEach(words => {
      const line = words.join(" ");
      
      if(line.length > maxLineLength) {
        splitLine(line)
          .forEach(item => formatedTextArray.push(align(item, false)) );
      } else {
        formatedTextArray.push(align(line));
      }
    }, []);
    
  return addBorders(formatedTextArray);
  
  function align(line = "", isLeft = true) {
    let newLine;
    
    if(isLeft) {
      newLine = line.padEnd(maxLineLength);
    } else {
      newLine = line.padStart(maxLineLength);
    }
    
    return newLine;
  }
  
  function splitLine(line) {
    if(line.length > maxLineLength) {
      const spaceIndex = line.lastIndexOf(" ", maxLineLength);
      const lineStartPart = line.slice(0, spaceIndex);
      const restLine = line.slice(spaceIndex + 1);
      return ([lineStartPart]).concat(splitLine(restLine));
    } else {
      return [line]
    }
  }
  
  function addBorders(formatedTextArray, symbol = "*") {
    const borderedTextArray = [
      symbol.repeat(maxLineLength),
      ...formatedTextArray,
      symbol.repeat(maxLineLength)
    ];

    return borderedTextArray.map(addHorizontalBorders);
    
    function addHorizontalBorders(line) {
      return symbol + line + symbol;
    }
  }
}

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

Ну и задачка со звездочкой, найдите где этот код будет работать не корректно

Comments

[Morshynska]

Спасибо за развернутый ответ)

Answer 3

[Сергей Соколов]

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

Comments

[Morshynska]

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

[Сергей Соколов]

Morshynska, как я себе представляю процесс:

// сначала
[['very', 'long', 'row', 'of', 'words']]

// находим, что по длине надо разбить так:
[
  ['very', 'long', 'row'],
  ['of', 'words'],
]

// склеиваем в строки
[
  'very long row',
  'of words',
]

// строки добиваем пробелами справа до нужной длины str.padEnd(16)
[
  'very long row  ',
  'of words       ',
]

// и добавляем по звёздочке в начале и в конце
[
  '* very long row  *',
  '* of words       *',
]

// добавляем в начале и в конце массива строк
// длинные строки звёздочек
starRow = '*'.repeat(18);
[
  starRow,
  '* very long row  *',
  '* of words       *',
  starRow,
]

// всё, склеиваем этот массив в одну строку через символ новой строки, скажем:
.join('\n')

[Morshynska]

Сергей Соколов, спасибо за ваше виденье