Exhaustive Character Esoterica && Etymology
Tags: beginners, programming, ux, javascript
Published: 2022-11-01 04:51:52

If you're like me at all and appreciate the cryptic origin stories of our arcane coding lexicon this post is for you.

As most of you will inevitably encounter special characters, and at some point need to verbally reference them, here is a running attempt at cataloging special characters' names, pronunciations, and etymology!

## 1. ! - The Bang/Not Operator:
_reverses value or to find opposite_
```
let onomatopoeia === "bang"
onomatopoeia !== "quiet"
```

The bang operator was my inspiration for this undertaking. I thought; "Hm.. why is it called 'bang'?" And upon a little research I found a couple explanations. My favorite being the hearkening of old comic books. In these illustrations whenever a gun was fired or a loud noise occurred the string "Bang!" was used as the onomatopoeia. So, whenever "!" occurred it was coupled with "Bang" hence the shortening of the bang sound to "!". This is also used in the typesetting and publishing industry as well!

## 2. # - Hashtag/Pound/Number Sign/Sharp:
_a selector for IDs in jQuery_
```
$("#quotes")
```

Popularized by Twitter, the "hashtag" symbol is used to add tags to help organize tweets by content. This symbol is also commonly referred to as the "Number" sign as it commonly denotes numerals in text. It also can be called the "Pound" sign as it stood for the Great British Pound! (The origin of this dates back to the use of the letter "L" to stand for a pound of money from the first letter of the Latin "Libra" (pound of money)). And "sharp" coming from music composition where a letter denoted with "#" (sharp) is a semitone up from the listed letter note.
_A very esoteric name for this symbol is the Octothorpe from Cartography as the "#" symbol represents a village: 8 fields around a central square, hence: octo-(eight) thorp-(village)._

## 3. $ - Dollar Sign/Cash/Buck:
_a jQuery identifier_
```
$('#selector').text('Ateh, Malkuth, Ve-Geburah, Ve-Gedulah, Le-Olahm, Amen');
```
_used in declaring, selecting, identifying jQuery objects/elements_

From the symbol for USD (united states dollar) hence the names in reference to money.

## 4. ~ - Tilde:
_often used to coerce a truthy value_
```
var foo = "hello world";

if (~foo.indexOf("w")) {
  // item in list
} else {
  // item not in list
}
```
_.indexOf() returns the index (integer) of what it is searching for or -1 if it cannot be found. Therefore ~ will return true for any positive integer or false for -1 allowing for simple boolean return_

The word "Tilde" entered the English lexicon from Spanish and Portuguese from its original Latin "titulus" which roughly meant "superscription". Hence, how it is placed over a letter to indicate a change in its pronunciation in linguistics. 

## 5. * - Star/Splat:
_stand-in symbol for multiplication or when directly following the keyword function* represents a generator function returning a generator object_

```
function* generator(i) {
  yield i;
  yield i + 10;
}

const gen = generator(10);

console.log(gen.next().value);
// expected output: 10

console.log(gen.next().value);
// expected output: 20
```
_from MDN_
The origins of "splat" seem to be contested upon cursory internet research. But, from the middle-English _splatten_ verb: to spread flat, seems to explain the onomatopoeiac relevance of the sound "splat". The latter being "The sharp, atonal sound of a liquid or soft solid hitting a solid surface". (https://en.wiktionary.org/wiki/splat)
It is also believed to be derived from the "squashed bug" appearance on "many early line printers". (http://www.catb.org/jargon/html/S/splat.html#:~:text=splat%3A%20n.,on%20many%20early%20line%20printers.)

## **DOUBLES - !! | ?? | ~~**

- **!! - Double Bang Operator -**
- coerces a value to it's Boolean equivalent
```
str = "Double bang operator";
console.log(str == true); // false
console.log(!!str);       // true
console.log(!str);        // false
console.log(str);         // Double bang operator
```
_in this example str should be a truthy value; !str == false therefore str should == true, but str will just return the actual value of our variable str. If we need to check for the truthiness of str; !! will coerce to boolean value. (it is the logical equivalent of a double negative (Not, Not)_

- **?? - Nullish Coalescing Operator -** 
- returns its right-hand side operand when its left-hand side operand is null or undefined, and otherwise returns its left-hand side operand. (_MDN_)

- **~~ - Double Tilde Operator-**
- mostly used to coerce a decimal point number (float) to an integer, but I will spare you the explanation and send you to my other post regarding this very topic: https://dev.to/colinwilliams91/math-object-dealing-w-decimals-1lpd

## X. !? / ?! - Interrobang (Exclamaquest...)
_nearly completely useless in JS..._

As useless as the Interrobang is it's origin story is entertaining enough to warrant a couple sentences. During the 20th Century American typesetters were apparently trying to revolutionize punctuation marks on their manufactured typewriter machines and realized they had no appropriate symbol for something that was both interrogative AND exclamatory!? So, what typists would do is punch "?" into their paper and strike it with "!". As we have been over; the exclamation mark was popularly referred to as "bang" among typists and programmers, hence, we had the Interrogative(?) struck with a "Bang(!)": Interrobang.




Works Cited:

https://ss64.com/bash/syntax-pronounce.html - table of context for most character references.

https://www.bankofengland.co.uk/freedom-of-information/2022/history-of-the-use-of-the-single-crossbar-pound-sign-on-banknotes - Great British Pound

http://shadycharacters.co.uk/2011/04/the-interrobang-part-1/ - The Interrobang!? American Typesetting

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Nullish_coalescing_operator - Nullish Coalescing Operator

https://en.wikipedia.org/wiki/Tilde - self explanatory

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/function*#:~:text=The%20function*%20declaration%20(%20function%20keyword,which%20returns%20a%20Generator%20object. - generator functions