A frequent interview concept

Image for post
Image for post
Photo by Lance Anderson on Unsplash

The term hoisting is confusing

I believe that one of the first and foremost reasons people struggle to understand is because the term itself is somewhat misleading. The Merriam-Webster definition of the word is “an act of raising or lifting”.

This might lead one to assume that hoisting involves written code being physically rearranged somehow. This is not true.

Instead, the term is used as a kind of simile to describe a process that occurs while the JavaScript engine interprets written JavaScript code.

How is JavaScript code interpreted?

All written JavaScript is interpreted within the Execution Context that it is written in. When you open up your…


A fun project to sharpen your DOM manipulation skills

Image for post
Image for post

I recently built an etch-a-sketch variant as an exercise for practicing basic JavaScript, CSS, and HTML. I wanted to document my experience in order to strengthen my understanding of what I built and to avoid the “I don’t know how it works, but it works!” perspective. I’d also love to hear any feedback!

HTML

I started with a basic HTML skeleton:

I then filled in this HTML skeleton with what I felt my project would need:

I wanted to have my “Etch-A-Sketch” grid take up the right half of my page with the title and interactive elements sitting on…


There’s no such thing as one-size-fits-all syntax

Image for post
Image for post
Photo by Nick Fewings on Unsplash

ES6 Arrow Functions

You know them, you love them, and you probably use them all the time! Introduced as part of the ECMAScript 6 update in 2015, arrow functions exploded in popularity, and with good reason. Arrow function syntax is wonderful syntactic sugar that removed the need for the following:

  • the return keyword (for one line functions)
  • the function keyword
  • curly brackets

Arrow functions also reduced some of the complexity involved in JavaScript function scope, as well as the this keyword, because sometimes all you really need is an anonymous function.

All that being said, arrow functions are not a one-size-fits-all solution for…


A few quick and simple code samples

Image for post
Image for post
Photo by Barrett Ward on Unsplash

Before We Destructure, What Is a Structure?

In computer science, the type of structures that we constantly build and use are called .

A data structure is a storage format created for the purpose of storing and organizing data, often prioritizing the accessibility and customization of that data. In other words:

“More precisely, a data structure is a collection of data values, the relationships among them, and the functions or operations that can be applied to the data.” -Wikipedia

JavaScript has two built-in data structures: arrays and objects.

What Does It Mean to “Destructure” a Data Structure?

“The destructuring assignment syntax is a JavaScript expression that makes it possible to unpack values from arrays, or…


Squash bugs before they even exist

Image for post
Image for post
Photo by Alice Dietrich on Unsplash

Sloppy Mode

Unlike Java or C#, JavaScript is a loosely typed language, which makes it a very forgiving language. To the best of its ability, JavaScript will try to cover for most mistakes made by those who write it.

On the surface, this may seem like a good thing, but it can allow for some rule-bending that often leads to unintended consequences down the line. This has earned the default JavaScript environment the title of .*

Not an official title, but MDN does have a page dedicated to the term.

Why Use Strict Mode?

Is avoiding slop enough reason to employ strict mode? Only you…


What it does and why you should stop using it

Image for post
Image for post
Photo by Jon Tyson on Unsplash

JavaScript Operators

JavaScript has several different types of operators. These include comparison, arithmetic, logical, and many more.

These operators can be further defined as either unary or binary. Let’s break down the difference between these two terms now as we move toward understanding ternary.

Unary

A unary operator takes just one operand, either before or after the operator:

  for example:x++ || ++x

Binary

A binary operator requires two operands, the most common examples being basic addition, subtraction, multiplication, and division:

 x + y; || x - y; || x * y; || x / y;


And how would you go about checking for any of these states?

Image for post
Image for post
Photo by Kelly Sikkema on Unsplash

Let’s Start With Undeclared

Undeclared is not a JavaScript reserved word. This means we don’t use or assign undeclared when writing code, instead, we encounter the error message that is produced when we try to use an undeclared variable.

aVariable;
console.log(aVariable) // ReferenceError: aVariable is not defined

When we try to use a variable that has not been declared using either of the keywords let or const, this usage will result in the above error message.

Ironically, this error message reveals the first slightly confusing scenario we’re looking at today: the data type of an undeclared variable is undefined.

Which Brings Us to undefined

undefined is one of seven…


Let the debates begin

Image for post
Image for post
Photo by Volkan Olmez on Unsplash

As you likely already know, there are a variety of ways to convert a string to an integer in JavaScript. However, it’s up for debate as to which method is the “best” method available to developers. Let’s take a look at some options.

parseInt( )

parseInt(string, radix)

We begin with parseInt() which takes two arguments, a string and a radix. The function returns an integer parsed from the given string.

If the first argument is not a string, it is converted to one automatically using ToString(). Either way, any leading whitespace is ignored.

The parseInt() method starts at position 0 and determines…


Coding can be hard — be kind to yourself

Image for post
Image for post
Photo by Christian Erfurt on Unsplash

Code: A Love/Hate Relationship

As human beings, we’re genetically programmed to anthropomorphize. To anthropomorphize is “to attribute human form or personality to things not human.” It’s a complicated, not entirely understood instinct that may have helped our ancestors spot familiar friends or hidden enemies. This is part of why we see silly faces in the clouds and spooky faces in the dark.

Unfortunately, for some of us (including yours truly), this means that when struggling to learn a new subject, we can subconsciously humanize said subject. When I struggle with code, I start to think of code as an enemy, as something that’s out…


The answer is not as complicated as you might fear

Image for post
Image for post
Photo by John T on Unsplash

The Infamous Interview Question

These days, I am actively applying to and interviewing for jobs. Maybe you are too, dear reader.

A few days ago, I had an interview in which the engineering team asked me to explain what a closure is. It’s certainly not the first time that I’ve been asked about the term, but I’m not going to lie, I panicked a bit.

Closures have developed something of an infamous reputation for being an impossibly difficult screening question.

After the interview, I was frustrated that the topic was still daunting to me. I was determined to buckle down and defeat closure once…

Andrew Koenig-Bautista

Web Developer, writer, bookworm, viewer of indie films. Passionate about problem-solving and building a more equitable -and joyful- world. Actively job seeking.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store