Regex, Spoonerisms, and my favorite way to learn new things in JavaScript🥄

I’m a big advocator of doing silly coding side projects to make learning new things less intimidating. For me this usually entails some nonsense-oriented wordplay. A perfect example of a prime candidate for this learning technique is every bodies best/worst friend: Regular expressions! And if you’re like me and even the distant mention of regular expressions uttered in the wind makes you stressed out then don’t be alarmed because I’m going to explain everything in detail and it will all be in good fun.

🥄 What is a spoonerism?

Perhaps I’m getting ahead of myself a bit, first let’s do some background. A spoonerism is, as I’m sure some are already aware, a verbal error where someone accidentally switches around the initial two sounds of a two word phrase. A particularly famous spoonerism is in the nursery rhyme “she sells sea shells by the sea shore ”, “she sells” is a spoonerism of “sea shells”. The silly name was coined from one

Spooner in an 1898 vanity fair article

William Archibald Spooner, a long time Oxford don who would often commit this blunder resulting in phrases like “blushing crow”(from ‘crushing blow’), “mardon me padom” (from ‘pardon me madam’). He was albino and suffered from eyesight and reading issues which probably played a big factor in his famous spoonerisms. He was described as “rabbit-like” and characterized as somewhat absent-minded.Now — while I have committed my fair share of spoonerisms by accident — I do like to search for entertaining ones on purpose. If I could get my computer to find them for me that would be even better!

🥄What are regular expressions and why would we use them?

Feel free to skip this part if you understand the concept and basic use cases of regular expressions.

Regular expressions, or regex for short, are patterns the computer follows to match specified segments of strings. Okay so that’s a bit wordy, personally I do better with examples so lets look at the most simple use case. Let’s have our regex match to a letter and then do something with that letter.

this code doesn’t quite work

And the console prints:

Whats wrong with this picture?

So we can see the it matched the very first ‘e’ and replaced it but not any others, this is because by default regular expressions stop at the first match they get. To change this behavior we have to add whats called a ‘modifier’ to the declaration of the regex. Modifiers are added after the second back-slash in the regex declaration. Our new code looks like this:

Match to EVERY instance of ‘e’

yay! it works

So what if we wanted to match to everything BUT ‘e’. For this we would use a whats called a metacharacter. Metacharacters are usually used in conjunction with other characters to alter their behavior. There are an overwhelming abundance of these characters because of just how versatile regex can be but the one we are looking at right now is the caret. (this little guy ➡ ^)

I don’t quite know why we have to put the ^e in brackets. If you know please leave response!

and as expected our console prints out a strikingly ugly string of capital and lowercase e’s.

Don’t you wish I picked a better example?

There is so many more regex operators and special characters it would be practically useless to list them here. This is supposed to be an introduction to how useful regex’s can be and an illustration that if you focus on your desired outcome then the task becomes much less daunting. Nobody knows every single regex rule and character because there’s simply too many to memorize.

It’s much more important to know what is possible and how to find the right tool at the right time than strictly memorizing things. Code with your brain not with your fingers.

🥄The plan.

So the end game is to have my computer spitting spoonerisms at me from a pre-generated list of phrases.

So at first glance it’s obvious that we’re going to need:

a) A large list of two word phrases

b) A way to read them into an array

c) A function that takes a two word phrase and returns a spoonerism of that phrase

d) Possibly some text-to-speech for the lol factor

🥄A) List of phrases

I literally just typed “two word phrases” into google and clicked on the first result.

wow, Thanks Internet

So I’m just going to copy and paste all of the phrases into a text file in the repository I’m working in.

🥄b)Reading them into an array

First lets get the file printed to console so we can see what we’re working with. I’m not going to spend too much time on this part of the code because it’s not really the thing I’m trying to practice with this project.

for more on reading and writing files with node file system go to https://www.tutorialspoint.com/nodejs/nodejs_file_system.htm

So now we have the list, but we just have the whole bulky thing and we need to read it into in array so lets split the list at each new line to isolate each phrase:

.split() returns as an array too!

Now that we can mutate them easily the first thing I want to do is get rid of the pesky double quotes, numbers, and periods. Now that we know some regex basics let’s put them to good use.

this regex gets rid of all the characters that are not letters:

similarly you could do `regex = /[0–9]/g` to match to all the numbers

We’re close but we accidentally cut out all the spaces and all of the capital letters.

not an ideal console

To fix the spaces problem we can use another metacharacter and to fix the uppercase problem we can use a modifier. Similar to the or operator in JavaScript there is an or metacharacter in regular expressions. The default behavior for regex is to be ‘case sensitive’ which is why it matched to our uppercase letters. So with the new changes our regex looks like this:

the `\s` character is read as a space, the `|` character is the or operator, and the `i` at the end is the case insensitive modifier. So our regex is saying “I’m going to look at everything you give me regardless of case and find everything that is not a letter or not a space.” And finally the glorious console:

🥄c) A function that takes a phrase and returns a spoonerism

Earlier we used `string.split()` earlier to split each of the phrases into an index of an array at each new line so that we could manipulate each phrase individually. We can do the same thing here but split it by new line. After binding each word to a variable the rest of the function is pretty self explanatory. Subtract the first letter of each word and replace it with first letter of the opposite word then return as both of the words appended to each other:

🥄d)Celebrations!

All of this code as well as a full list of the spoonerisms can be found at this URL: https://repl.it/@jamisonTitan/Spoonerizer if you would like to copy and paste it into a text-to-speech generator then feel free ,I highly recommend it. Ultimately we didn’t do anything helpful here. No company is going to hire me because of my phenomenal code that switches letters around, but just reading the documentation on regular expressions is boring and not the sort of afternoon that sticks in your memory(I envy you if you do happen to remember every information-dense page of docs you read.) A successful afternoon making silly wordplay does stick in my memory and both will teach you something so to you i say go forth! Do silly and useless projects in the name of knowledge!

(or not, whatever. just do your thing)