Adding paragraph tag to substrings within a string in JavaScript

We are required to write a JavaScript function that takes in a string str as the first argument and an array of strings, arr as the second argument. We need to add a closed pair of paragraph tag <p> and </p> to wrap the substrings in str that exist in arr. If two such substrings overlap, we need to wrap them together by only one pair of closed paragraph tag.

Also, if two substrings wrapped by paragraph tags are consecutive, we need to combine them.

For example, if the input string and the array are:

const str = 'kkkllmm';
const arr = ["kkk","kkl","lm"];

Then the output should be:

const output = '<p>kkkllm</p>m';

Algorithm Overview

The algorithm works by creating a boolean array to track which characters should be wrapped in paragraph tags. It identifies overlapping and consecutive substrings, then builds the final string with appropriate tags.

Example

Here's the complete implementation:

const str = 'kkkllmm';
const arr = ["kkk","kkl","lm"];

var addParagraphTag = (str = '', arr = []) => {
   if(!arr.length){
      return str;
   }
   
   const { length } = str;
   let paraBoolean = new Array(length).fill(false);
   let end = 0;
   
   // Mark positions that should be wrapped
   for (let i = 0; i < length; i++){
      for (let j = 0; j < arr.length; j++){
         let word = arr[j];
         if (str.startsWith(word, i)) {
            end = Math.max(end, i + word.length);
         }
      }
      paraBoolean[i] = end > i;
   }
   
   let curr = 0;
   let newStr = '';
   
   // Build the result string
   while (curr < length) {
      // Add characters that don't need wrapping
      while(curr < length && paraBoolean[curr] === false) {
         newStr += str[curr++];
      }
      if (curr >= length) break;
      
      // Add opening tag and wrapped content
      newStr += '<p>';
      let startBold = curr;
      while (curr < length && paraBoolean[curr] === true) curr++;
      newStr += str.slice(startBold, curr);
      newStr += '</p>';
   }
   
   return newStr;
};

console.log(addParagraphTag(str, arr));

Output

<p>kkkllm</p>m

How It Works

The function creates a boolean array paraBoolean where each index represents whether that character should be inside paragraph tags. It identifies all matching substrings and marks their positions, handling overlaps by extending the end position. Finally, it constructs the output string by adding paragraph tags around consecutive marked regions.

Key Points

• Overlapping substrings are merged into a single paragraph tag
• Consecutive tagged regions are combined
• The algorithm efficiently handles multiple substring matches

Conclusion

This solution efficiently wraps matching substrings with paragraph tags while handling overlaps and consecutive matches. The boolean array approach ensures optimal performance for substring identification and tag placement.