This is a follow-up article to my previous one, Debouncing in TypeScript. It will be straight to the point about the revisions.

Mild changes to the previous version.

A couple household updates include:

  • Constructor doesn’t return bound function per TypeScript strict mode
  • Constructor doesn’t have a return type
  • Setting lastTrigger in constructor to avoid immediate execution

More significant updates include:

  • Static exec method so you don’t have to maintain a reference to the debouncer

You can use this class in this way:

The core piece here is the Debounce.exec(..., );

This example assumes that you have a symbol defined for each class instantiation which will provide a unique namespace for every Debounce instance. If you continually create new symbols, it will make new instances per call.

--

--

Let’s say you want to fix a URL that looks like:

https://www.example.com/my/path//to-file.jpg

Using a string replace or a simple regex could incorrectly “fix” the double slashes following the protocol. We can fix that by using a negative lookbehind.

(?<!:)/+

For PHP:

<?php$url = 'https://www.example.com/my/path//to-file.jpg';
$str = preg_replace('#(?<!:)/+#im', '/', $url);
// https://www.example.com/my/path/to-file.jpg

For Javascript:

let url = 'https://www.example.com/my/path//to-file.jpg';
url.replaceAll(/(?<!:)\/+/gm, '/');
// "https://www.example.com/my/path/to-file.jpg"

--

--

I was recently converting one of my PHP libraries to a Javascript library. I’d used preg_replace_callback for PHP and decided to create a similar function for a more direct translation to the library.

function preg_replace_callback(pattern, callback, string) {
[...string.matchAll(pattern)].forEach(value => {
string = string.replace(value[0], callback(value));
});
return string;
}

In practice:

let foo, result;// Capitalize first letters
foo = 'The quick brown fox jumped over the lazy dog.';
result = preg_replace_callback(/\s([a-z])/gm, matches => matches[0].toUpperCase(), foo);
// Result: "The Quick Brown Fox Jumped Over The Lazy Dog."
// Double found numbers
foo = 'Their ages are 12, 15, and 22.';
result = preg_replace_callback(/([0-9]+)/gm, matches => matches[0] * 2, foo);
// Result: "Their ages are 24, 30, and 44."

It’s likely not 100% one-to-one with PHP’s function, but it worked well enough for what I needed. Feel free to iterate.

--

--

Matt Kenefick

Matt Kenefick

13 Followers

Chief Product Engineer. Frontend, Backend, Systems, Electronics, 3D Printing, Photography.