JavaScript Fundamentals
Output
Use the console.log() statement to output to the console
console.log("Hello world!")
console.log("This is the way ")
// Output:
// Hello World
// This is the way
Note: console.log() automatically appends a new line \n to the end.
Outputting Variables To Console
The built in console.log(...) function accepts strings, variables, and values:
const abc = 15
console.log(abc) // outputs 15
console.log(15+20/5) // outputs 19
console.log("bye!") // outputs bye!
Output - Mixing Strings and Numbers
There are two ways to include variables and strings in the same output:
1. Concatenation (appending values into a single string)
2. String interpolation (replacing placeholders with values)
Example:
const q = 5
const price = 3.99
// concatenation
console.log("You bought " + q + " apples for $" + price + " each.")
// interpolation
console.log(`You bought ${q} apples for $${price} each.`)
Variables in Javascript
Variables can be declared with the const, let, or var keyword.
● var defines a globally scoped variable
● const and let define a locally scoped variable
var should generally be avoided because it can lead to unexpected issues
Variables in Javascript
Here is the anatomy of a variable declaration:
const price = 3.99
Read only or
writable modifier
let quantity = 50
variable name variable value
Variables in Javascript
A Javascript variable can either be read-only or writable:
● Read-only: A variable whose data cannot be changed after assignment
● Writeable: A variable whose data can change after assignment
Example: A read-only variable
Attempting to change the value of a read only variable produces an error:
const x = 200 // read only (constant)
x = 900 // error
JavaScript Variables: Let
Use let to declare a writable variable.
Variables declared as let:
1. Can be reassigned to different values
2. Have block-level scoping & cannot be accessed outside its scope
Example:
let x = 1;
x = 25 // 1. variable can be reassigned
const z = 3;
if (z === 3) {
let y = 200;
console.log(y); // expected output: 200
}
console.log(x) // expected output: 1
console.log(y); // 2. ERROR: y is undefined
JavaScript Variables: Const
Use const to declare a read-only variable
Variables declared as const:
1. Cannot be reassigned (read-only)
2. Have block-level scoping & cannot be accessed outside its scope
Example:
const x = 1;
x = 99 // 1. ERROR: x is read only!
const z = 10;
if (z > 2) {
const y = 200
console.log(y); // expected output: 200
}
console.log(y); // 2. ERROR: y is undefined
Javascript Data Types
Javascript variables have a data type. The most common data types are:
undefined // Unassigned variable
Number // Integers, Doubles, Floats
String // Characters and Strings
Boolean // true, false
Object // similar to a “struct” in C
Full list of data types here:
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Data_structures#javas
cript_types
Variable Data Types
In Javascript, the variable’s data type is inferred.
Use the built in typeof(...) function to view the data type of a Javascript variable
let quantity = 3.99
console.log(typeof(quantity))
Type Inference
When you declare a variable, Javascript performs type inference to determine the
variable’s data type.
What is type inference?
● JavaScript tries to guess the data type based on the initial value you assign
the variable.
JavaScript is a Loosely Typed Language
Javascript is a loosely typed language because:
● Variables do not have an explicitly declared data type
● A variable’s data type be changed
In contrast, strongly typed language (C, C#, Java) have:
● Explicit variable type declarations
● Static data types (after data type is declared, it cannot be changed)
Strongly Typed vs. Loosely Typed Languages
Generally, programming languages are classified as either strongly typed or
loosely typed
Strongly typed languages are very strict with variables and their data types.
Features of a strongly typed language:
1. Type Identification:
● You must identify the type of data that will be stored in the variable
2. Static Variable Typing:
● Once you declare the data type, you cannot change it
● The content you store in the variable must match the data type
Undefined vs. Null
Javascript distinguishes between the undefined and null data types
● Undefined = The variable is declared, but not assigned a value
● Null = The variable IS assigned a value, but the value is “nothing”
In both cases, a space is created in memory to store the variable’s value.
However, if you do not assign the variable a value, it’s type is set to to undefined
let x
console.log(x) 0x8A521
let y = null
null 0x2841B
console.log(y)
Output - String Interpolation
In ES6 Javascript, interpolation is preferred over concatenation
console.log(`You bought ${q} apples for $${price} each.`)
For interpolation to work, the string must be enclosed in backticks!
Output - String Interpolation
Use the ${...} syntax to specify where your variable values should go
● The ${...} syntax indicates a placeholder value.
● Javascript will replace the placeholder with the actual value.
console.log(`You bought ${q} apples for $${price} each.`)
Example:
● ${q} means: Replace this placeholder with the value stored in q
Example:
● $${abc} means: Output a $ symbol, followed by the value stored in price
Numbers in JavaScript - Math Operations
Javascript uses the standard programming math operators:
● Addition: +
● Subtraction: -
● Multiplication: *
● Division: /
● Modulus: %
Example:
const powerLevel = 45 * 900 + 1
Javascript Has Automatic Floating Point Division
Javascript will automatically perform floating point division:
const result = 75 / 100
console.log(result);
// Actual result = 0.3333
Many programming languages will not do this! (example: C)
Converting Between Data Types
Sometimes, developers need to convert between numbers and string data types:
To convert between strings and numbers, use the following built in functions:
String to Numbers:
const a = "3.5"
const b1 = parseInt(a) // produces 3
const b2 = parseFloat(a) // produces 3.5
const b3 = Number(a) // produces 3.5
Numbers to String
const d = 400
const e = String(d) // produces "400"
const f = d.toString() // produces "400"
Variables: Testing for Equality
Reminders about testing for equality in
Javascript
● == operator: Tests that values are
equivalent
● === operator: Tests if value and data
type are the same
Always use === because == can lead to
unexpected issues
