Блог

У меня есть вопрос о каком-то решении моей проблемы.. Мне нужно найти все слова между » # » в строке…

пример:

     const str = `<Table striped bordered hover>
  <thead>
    <tr>
      <th>#project name#</th>
      <th>#First Name#</th>
      <th>#Last Name#</th>
      <th>#Username#</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>1</td>
      <td>Mark</td>
      <td>Otto</td>
      <td>@mdo</td>
    </tr>
    <tr>
      <td>2</td>
      <td>Jacob</td>
      <td>Thornton</td>
      <td>@fat</td>
    </tr>
    <tr>
      <td>3</td>
      <td colSpan="2">#Footer#</td>
      <td>#social media#</td>
    </tr>
  </tbody>
</Table>
<p> normal text: #Published data# </p>
`
 

есть ли какой-нибудь метод? Я должен найти в своей таблице, что я мог бы заменить эти слова словами из базы данных. Я думал о proptype.replaceAll, но я не мог решить эту проблему с помощью этого :/

String.prototype.replaceAll() должно сработать. Возможно, вы неправильно его использовали? Мы хотим использовать a RegExp , который лениво сопоставляет текст между двумя # символами с группой захвата. Затем вы можете использовать любую функцию обратного вызова для замены значений.

Машинопись немного странная, потому что TS не знает, что у нас RegExp есть группа захвата и что мы всегда будем получать a string в качестве второго аргумента replacer функции. Он набран таким образом, что вторым аргументом, которым является наша группа захвата, может быть any тип.

 /**
 * this is where you implement your actual replacement logic
 */
const findReplacement = (text: string) => {
    switch (text.toLowerCase()) {
        case 'project name':
            return '<span class="project">Project</span>';
        case 'footer':
            return "Replacement for Footer";
        default:
            return text;
    }
}

/**
 * function to handle a string like your example
 */
const processTemplate = (text: string) => {
    return text.replaceAll(
        /#(.*?)#/g, 
        (_, match) => findReplacement(match)
    );
}
 

Попробуйте это на своей веревочке с

 console.log(processTemplate(str));
 

Ссылка на игровую площадку для машинописи

Выполняемый фрагмент стека (без TS)

 const findReplacement = (text) => {
    switch (text.toLowerCase()) {
        case 'project name':
            return '<span class="project">Project</span>';
        case 'footer':
            return "Replacement for Footer";
        default:
            return text;
    }
}

const processTemplate = (text) => {
    return text.replaceAll(
        /#(.*?)#/g, 
        (_, match) => findReplacement(match)
    );
}

const str = `<Table striped bordered hover>
  <thead>
    <tr>
      <th>#project name#</th>
      <th>#First Name#</th>
      <th>#Last Name#</th>
      <th>#Username#</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>1</td>
      <td>Mark</td>
      <td>Otto</td>
      <td>@mdo</td>
    </tr>
    <tr>
      <td>2</td>
      <td>Jacob</td>
      <td>Thornton</td>
      <td>@fat</td>
    </tr>
    <tr>
      <td>3</td>
      <td colSpan="2">#Footer#</td>
      <td>#social media#</td>
    </tr>
  </tbody>
</Table>
<p> normal text: #Published data# </p>`;

console.log(processTemplate(str)); 

     const str = `<Table striped bordered hover>
  <thead>
    <tr>
      <th>#project name#</th>
      <th>#First Name#</th>
      <th>#Last Name#</th>
      <th>#Username#</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>1</td>
      <td>Mark</td>
      <td>Otto</td>
      <td>@mdo</td>
    </tr>
    <tr>
      <td>2</td>
      <td>Jacob</td>
      <td>Thornton</td>
      <td>@fat</td>
    </tr>
    <tr>
      <td>3</td>
      <td colSpan="2">#Footer#</td>
      <td>#social media#</td>
    </tr>
  </tbody>
</Table>
<p> normal text: #Published data# </p>`;
    const words = [];
    let start = false;
    let word = "";
    for (let i = 0; i < str.length; i  ) {
      if (str[i] === "#") {
        if (start) words.push(word);
        word = "";
        start = !start;
      } else {
        if (start) {
          word  = str[i];
        }
      }
    }
    console.log(words);