Javascript Fundamentals Part 1

Javascript is case-sensitive

Everything in JavaScript including variables , function names,  class names, and operators are case-sensitive. It means that counter and Counter variables are different.

Comments

JavaScript supports both single-line (//) and block(/**/) comments.

// This is a single line comment

/*
* This is a multiple line 
* comment block
*/

Semicolon

Although JavaScript does not require to end a statement with a semicolon (;), it is recommended to always use the semicolon to end a statement which makes your code more readable.

var number1 = 1;
var number2 = 2;

Javascript variables

JavaScript variables are loosely typed which means that variables can hold values with any type of data. Variables are just placeholders for values.

To declare a variable, you use the var or let keyword followed by the variable name.

var pointer = "Welcome!";
point = 100;

Undefined and undeclared variables

An undefined variable is a variable that has been declared. Because we have not assigned it a value, the variable used the undefined as its initial value.

var undefinedMessage;

console.log(undefinedMessage); // undefined

An undeclared variable is the variable that has not been declared.

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

Global and local variables

In JavaScript, all variables exist within a scope that determines the lifetime of the variables and which part of the code can access them.

Local variables

Variables declared within a JavaScript function, become locally accessible to the function and only that function.

function sayHi(){
    //helloMsg is a local variable to the sayHi() function
    var helloMsg = "Welcome!";
    console.log("helloMsg: "+helloMsg);
}

sayHi();

console.log("helloMsg: "+helloMsg);//Uncaught ReferenceError: helloMsg is not defined

Global variables

A variable declared outside a function, becomes global which all functions on a web page can access it. 

/*
* Global variables
*/
var message = "Hello";
function sayHello() {
    // local variable
    message = 'Hi';
    console.log(message); // which message?
}
sayHello();// Hi
console.log(message); // Hi

If a local variable is not declared, Javascript will create it as a global variable.

But to avoid creating a global variable accidentally inside a function because of omitting the var keyword, you use the strict mode by adding the “use strict”; at the beginning of the JavaScript file (or the function). Note that by using “use strict” modern javascript will be enforced.

<script>
"use strict";
window.onload = function() {

}
</script>

Javascript Data Types

JavaScript has six primitive data types:

1.  null
2.  undefined
3.  boolean
4.  number
5.  string
6.  symbol – available only from ES6
7. object

JavaScript has dynamic types. This means that the same variable can be used to hold different data types.

var x;           // Now x is undefined
x = 10;           // Now x is a Number
x = "Folau";      // Now x is a String

To get the current type of the value of a variable, you use the typeof operator.

let count = 120; // count is a number
console.log(typeof(count)); // "number"

count = false;   // count is now a boolean
console.log(typeof(count)); // "boolean"

count = "Hi";   // count is now a string
console.log(typeof(count)); // "string"

The null type

Javascript defines that null is an empty object pointer. It is a good practice to assign a variable that later holds an object to null so that you can check whether the object is null or not by using the if statement.

let obj = null;
console.log(typeof obj); // object

if(obj != null) {
   // call method of the object
}

The undefined type

The undefined type is a primitive type that has one value undefined. By default, when a variable is declared but not initialized, it is assigned the value undefined.

The number type

Variables that hold whole number values

var num = 100;
var dec = 2.5;

The boolean type

Variables that hold true or false

var isSafe = true;

The NAN type

JavaScript has a special numeric value called NAN, which stands for Not a Number. In fact, it means an invalid number.

console.log('john'/2);//NaN;
console.log(NAN/2);//NAN
console.log(NAN==NAN);//false

The string type

In JavaScript, a string is a sequence of zero or more characters. A literal string begins and ends with either a single quote(‘) or double quote (“). A string that starts with a double quote must end with a double quote and a string that begins with a single quote must end with a single quote.

let greeting = 'Hi';
let s = "It's a valid string";
let str = 'I\'m also a string'; // use \ to escape the single quote (')

The object type

In JavaScript, an object is a collection of properties, where each property is defined as a key-value pair.

let user = {
    firstName: 'Folau',
    lastName: 'Kaveinga'
};

Null check with ??

The nullish coalescing operator is written as two question marks ??.

The result of a ?? b is:

• if a is defined, then a,
• if a isn’t defined, then b.

let collegeName;

console.log("collegeName: "+ (collegeName ?? "no collegeName"));//collegeName: no collegeName

collegeName = "BYU";
console.log("collegeName: ", collegeName ?? "no collegeName");// BYU

Source code on Github