This site and the internet are filled with answers to 'how to capitalize every word' but that isn't what I want to do. I couldn't find any answers anywhere to this question. Though it does seem like something that should have been answered well.

Using the previous three sentences as an example, say I had written them as:

this site and the internet are filled with answers to 'how to capitalize every word' but that isn't what I want to do. and I couldn't find any answers anywhere to this question. though it does seem like something that should have been answered well.

I'd like a JS function that will capitalize the three bolded words. Taking into account sentences can end after: '.' '?' or '!'.

I'm using Vue for this project so something that uses Vue would be great but Vanilla JS would be fine as well.

CodePudding user response：

Since there can be several delimiters that need to be preserved, split isn't an option. The alternative easy way is to process each sentence with global replace, where a sentence ends up with punctuation marks followed by a whitespace, and punctuation mark is optional at the end of the string:

sentences.replace(
  /. ?([.?!] (\s |$)|$)/g,
  sentence => sentence ? sentence[0].toUpperCase()   sentence.slice(1) : ''
)

CodePudding user response：

The most simple but also reliable approach was to utilize replace with a regular expression like /(?:^|[.!?]\s )\w/g and its toUpperCaseed matches.

The provided pattern ... / (?:^|[.!?]\s )\w /g ... reads as follows ...

• (?:^|[.!?]\s ) ... match a group ( ... ) in a non capturing way (?: ... )

  • ^|[.!?]\s ... there are two matching alternatives ... |(or) ...
    • either the beginning of a new line ... ^
    • or a single character which could be either of the character class ... [.!?] ... followed by at least one whitespace ... \s ... character (where the \s equivalent is [\r\n\t\f\v \u00a0\u1680\u2000-\u200a\u2028\u2029\u202f\u205f\u3000\ufeff]).

• \w ... match exactly a single word character (where the \w equivalent is [a-zA-Z0-9_]).

• match everything due to the global modifier flag.

const sampleText = `this site and the internet are filled
with answers to 'how to capitalize every word' but that isn't
what I want to do. and I couldn't find any answers anywhere to
this question? though it does seem like something that should
have been answered well!

this site and the internet are filled with answers to 'how
to capitalize every word' but that isn't what I want to do.
and I couldn't find any answers anywhere to this question?
though it does seem like something that should have been
answered well!

this site and the internet are filled with answers to 'how to
capitalize every word' but that isn't what I want to do.and I
couldn't find any answers anywhere to this question? though it
does seem like something that should have been answered well!`;

console.log(
  sampleText
    // regex ... [https://regex101.com/r/dnB8HA/1]
    .replace(/(?:^|[.!?]\s )\w/g, match => match.toUpperCase())
);

.as-console-wrapper { min-height: 100%!important; top: 0; }

CodePudding user response：

You can try with the regex pattern /([!.]\s )([a-z])/g.

The match will be passed to replace callback function to only upper the second capturing group ([a-z]) .

const string = "this site and the internet are filled with answers to 'how to capitalize every word' but that isn't what I want to do. and I couldn't find any answers anywhere to this question. though it does seem like something that should have been answered well.";

const result = string.replace(/([!.]\s )([a-z])/g, (_, segmentOne, segmentTwo) => segmentOne   segmentTwo.toUpperCase());
console.log(result[0].toUpperCase()   result.slice(1));

Pattern:

([!.]\s ) - Capturing a ! and .

([a-z]) - Capturing lowercase letters.