Scary JavaScript on Friday the 13th

Let's start with the terrifying tales of the Temporal Dead Zone (TDZ). The TDZ is the period where variables declared using let and const are unaccessible, even though their respective scopes have started. Accessing these variables before their actual declaration will result in a frightening ReferenceError.

The temporal dead zone (TDZ) is a behavior that occurs in JavaScript when trying to access variables declared with the `let` or `const` keywords before they have been initialized.

The TDZ ensures that variables are not accessed before they have been assigned a value, preventing potential bugs.

In JavaScript, variable declarations with `let` and `const` are hoisted to the top of their respective scope, but unlike variables declared with `var`, they are not initialized with a default value of `undefined`.

Instead, they remain uninitialized until their declaration statement is reached during the runtime's execution.

If you attempt to access a variable within its TDZ, a `ReferenceError` will be thrown.

This means that the variable exists in the scope but is not yet ready to be accessed.

The TDZ ends as soon as the variable's initialization statement is encountered.

Here's an example to illustrate the TDZ in JavaScript:

```javascript console.log(x); // ReferenceError: x is not defined

let x = 10; // Variable declaration (hoisted) but still in TDZ

console.log(x); // 10 ```

In the example above, trying to access the variable `x` before its declaration statement results in a `ReferenceError`. Once the declaration statement is encountered, the variable `x` is initialized and can be accessed without any issues.

It's important to be aware of the TDZ when using `let` and `const`, and ensure that variables are appropriately initialized before attempting to access them in your code.

// Try accessing a variable before it's declared to witness the horror of the TDZ.

function temporalDeadZone() {

try { console.log(scaryVariable);

// This should throw an error

let scaryVariable = "Safe now!"; }

catch (error) {

console.log("Beware! You've entered the Temporal Dead Zone!", error.message); } }

temporalDeadZone();

javascriptCopy code

function safeAddition(a, b) {

if (typeof a === 'number' && typeof b === 'number')

{ console.log(a + b); }

else

{ console.log("Warning! Adding non-numbers can summon NaN demons!"); } } safeAddition(5, "13"); // Warning!

javascriptCopy code

if (true)

{ let safeZone = "Portal is safe!"; }

try { console.log(safeZone);

// This should throw an error since safeZone is out of scope here } catch (error) {

console.log("Safe Zone remains protected. The portal is contained!", error.message); }

/////

The variable safeZone is block-scoped due to the use of let, which means it's only accessible within the block where it was declared,

in this case within the {} of the if statement.

That's why when you try to access safeZone outside of the block, it will throw a reference error.

The provided code demonstrates this behavior and seems correct as per the intention to show that safeZone is out of scope and throw an error.

However, for better readability and clarity, I'd recommend formatting the code as follows:

javascriptCopy code

if (true) {

let safeZone = "Portal is safe!";

}

try {

console.log(safeZone); // This will throw an error since safeZone is out of scope here

}

catch (error) {

console.log("Safe Zone remains protected. The portal is contained!", error.message);

}

javascriptCopy code

function checkVariable(variable) { if (typeof variable === 'undefined') { console.log("Warning! Undefined demon detected!"); } else { console.log("All is well:", variable); } } checkVariable(); // Warning!

javascriptCopy code

function randomDelay(callback) { setTimeout(callback, Math.random() * 2000 + 1000); } randomDelay(() => { console.log("Portal Closed!"); });

function randomDelayPromise() { return new Promise((resolve) => { setTimeout(() => { resolve("Promise Beasts Chained!"); }, Math.random() * 2000 + 1000); }); } randomDelayPromise().then(message => console.log(message));

Epoch 3: Shadows Over the Asynchronous Abyss

javascriptCopy code

// Refactor this callback mess into a neat async/await sequence.

function getData(callback) {

setTimeout(() => {

callback({ data: "Spooky data" });

}, 1000);

}

function processData(data, callback) {

setTimeout(() => {

callback(data + " processed!");

}, 1000);

}

getData((data) => {

processData(data.data, (processed) => {

console.log(processed); // Should print "Spooky data processed!"

});

});

// Refactor above here

javascriptCopy code

// Protect the function from null or undefined inputs using optional chaining.

function checkZombieProperty(obj) {

console.log(obj?.zombie?.scream ?? "Safe, for now...");

}

checkZombieProperty({zombie: {scream: "BRAAAAINS!"}});

checkZombieProperty({}); // Should log "Safe, for now..."

javascriptCopy code

// Make sure the object properties don't get mutated by creating a deep copy.

function deepClone(obj) {

return JSON.parse(JSON.stringify(obj));

}

const original = { monster: { limbs: 4 }};

const clone = deepClone(original);

clone.monster.limbs = 5;

console.log(original.monster.limbs); // Should still be 4

console.log(clone.monster.limbs); // Should be 5

javascriptCopy code

// Using bitwise operators, check if the 3rd bit of a number is set (counting from 0).

function isThirdBitSet(num) {

return (num & (1 << 2)) !== 0;

}

console.log(isThirdBitSet(4)); // true, because 4 in binary is 100

javascriptCopy code

// Get the negative representation of a positive number using Two's Complement.

function getNegative(num) {

return ~num + 1;

}

console.log(getNegative(5)); // -5

javascriptCopy code

// Calculate the factorial of a number using recursion.

function factorial(n) {

if (n === 0) {

return 1;

}

return n * factorial(n - 1);

}

console.log(factorial(5)); // 120

javascriptCopy code

// Check if a word is a palindrome using recursion.

function isPalindrome(word) {

if (word.length <= 1) {

return true;

}

if (word[0] !== word[word.length - 1]) {

return false;

}

return isPalindrome(word.slice(1, word.length - 1));

}

console.log(isPalindrome("radar")); // true