YDKJS — Up & Going

Sibylle Sehl
Aug 17, 2018 · 6 min read
Photo by Fabian Grohs on Unsplash

This blog post series will aim to summarise the most important bits and pieces from the great You Don’t Know JS series by Kyle Simpson. The remarks and examples are all his and I’m mainly summarising them here for learning purposes — if it helps you to learn too and understand JavaScript a bit better, awesome!

We’re diving in by looking at the learnings from the first book — Up & Going.

A primer on what JavaScript is and isn’t

Overview of basic JavaScript Concepts & Terminology

Statements

let a = b * 2;
  • a and b are variables
  • 2 is a literal value
  • = and the * are called operators

Statements can collectively make up a program. Statements are made up of expressions.

Expressions

let a = b * 2   // has 4 expressions
  • 2 is a literal value expression
  • b a variable expression
  • b*2 an arithmetic expression and also an expression statement
  • a = b*2 is an assignment expression

Operators

  • Assignment → = as in a = 2
  • Math → +, -, *, /
  • Compound Assignment → +=, -=, *=, /=
  • Increment/ Decrement → ++ or
  • Object Property Access → obj.a or person.age
  • Equality → ==, !=, ===, !==
  • Comparison → <, >, ≤, ≥
  • Logical → &&, ||

Values and Types

  • number
  • string → indicated by either “ “ or ‘ ‘
  • boolean (true or false)

Other types include

  • arrays
  • objects
  • functions

Converting between Types — Coercion

  • Using a method like Number() or toString() is explicit coercion
  • If you compare values using the == operator, JavaScript will convert them in order to perform the operation, i.e. “99.99” == 99.99 — this is called implicit coercion

Variables

The primary purpose of variables is to manage program state. The state tracks the changes to values while the programming is running and therefore allows you to make changes to your program.

Another often used way for variables is to declare constants (usually at the top of your program) that do not change and simply hold a value. You tend to use “CAPITALS” for these. ES6 furthermore introduced const which means you can not reassign your variables to furthermore support the concept of constants. The other new variable declaration is let, which can in turn be reassigned.

Blocks

Conditionals

  • If/Else statements → If clause need a condition that either returns true or false and will thus run a block of logic. The else clause will run if “if” is not true
if(age > 18) {console.log(“You old enough to drive”);} else {console.log(“You need to have a few more birthdays until you’re    old enough to drive”);}
  • Switch statements → can be used as a shorthand for a lot of if/else statements
  • Ternary Operator → (is this condition true) ? then do this : else do this instead

Loops

There are a number of different loops:

  • While loop → repeats a block of statements until a condition no longer holds true
while (age < 18) {console.log(“I am still not an adult”);}
  • Do … While loop → tests the conditional after the first iteration
  • For loop → Good if you only want to run the loop for a specific amount of time. Less prone to infinite loops.
for (let i = 0; i ≤ 9; i++) {console.log(i);}// will output 0 1 2 3 4 5 6 7 8 9

Functions

For example:

function sayName() {console.log(“My name is Sibylle”);}

You can call the function by using it like this sayName() in your program. It will output “My name is Sibylle”

Functions can also use parameters you can pass in:

function sayName(name) {console.log(“My name is ” + name);}

You can call this function by passing in your name like this sayName(“Marcus”). It will output “My name is Marcus”.

Functions make your code much cleaner and organise it into logical pieces. Even if you only end up using the function once, it will be worth dividing its logic up for clarity and make it easier for other developers to read your code.

Scope

Scope can also be nested in another scope. Code in the innermost scope can access all variables, whereas the outer scope can access the variables in the more inner scopes.

But there’s so much more to scope that we won’t go into more detail here and instead focus on Scope in its own blog post, based on the amazing Scope & Closures — the second book in Kyle Simpson’s amazing You don’t Know JS series.

Photo by Priscilla Du Preez on Unsplash

Some closing remarks

  • Code is every bit as much, if not more, for the developer as for the compiler
  • The choices you make about how to write a program matter not only to you but to your other team members and even to your future self.

Resources

If you enjoyed reading this summary blog posts, leave some claps and check out some of my previous posts:

JavaScript Deep Dive

A collection of articles and posts on JavaScript diving…

JavaScript Deep Dive

A collection of articles and posts on JavaScript diving deep into the inner workings of the language

Sibylle Sehl

Written by

Software Engineer at ResearchGate // MSc Computer Science Grad - University of Edinburgh //@freeCodeCamp 2018 Top Contributor // Passionate Problem-Solver

JavaScript Deep Dive

A collection of articles and posts on JavaScript diving deep into the inner workings of the language