JavaScript Basics

This page teaches you the basics of JavaScript, for beginners, in 30 minutes.

This tutorial teachs the ES2015 version of JavaScript.

ES2015 is a new JavaScript spec released in 2015, and is supported by all browsers now. It adds significant features to the language.

Running JavaScript

How to Run JavaScript

Comment

• Comment

Printing

• Print

String

• Quote String
• Template String
• String Operators/Function/Methods

Semicolon can be omitted most of the time. When to insert semicolon is complex. For now, just follow examples in this tutorial. For detail, see Semicolon Rules.

Arithmetic

Basic arithmetic.

// plus, add
console.log((3 + 4) === 7);

// minus, substraction
console.log((3 - 4) === -1);

// negation
console.log(-(3 + 4) === -7);
console.log(-(-3) === 3);

// multiply
console.log(3 * 4 === 12);

// divide
console.log(3 / 4 === 0.75);

[see Math Operators]

Assignment

Assignment lets you store a value to a variable.

let z = 5;
console.log(z === 5);

Assignment returns a value.

// assignment returns a value
let z;
console.log((z = 2) === 2);

JavaScript also supports x++ and others.

[see Assignment Operators]

Number

JavaScript doesn't have int/float distinction. They are just type “number”. It's similar to other language's “float”.

console.log(typeof 3 === "number");
console.log(typeof 3.2 === "number");
// true

Convert Decimal to Integer

to convert a number to integer.

console.log(Math.floor(3.5847) === 3);
console.log(Math.ceil(3.5847) === 4);

console.log(Math.round(3.54) === 4);
console.log(Math.round(3.55) === 4);

[see Math]

String/Number Conversion

Convert String/Number

Variables

The following are ways to declare and or assign variable.

// declare variable
let x;

// declare variable and assign
let x = 4;

[see let Declaration]

Besides let, there's also const and var. They all have the same syntax.

const is like let, except that it must be assigned a value, and once assigned, it cannot be changed.

[see const Declaration]

var is like let, but has complex scoping rules and has name hoisting. var is deprecated in JS2015. You should never use it.

[see var Declaration]

Data Types

Every JavaScript value has a type.

JavaScript value types are:

• undefined
• null
• true, false (these are boolean type.)
• string
• number (including NaN and Infinity)
• symbol
• object. (this includes array, function, regex, ….)

[see Value Types]

True and False

true and false are builtin boolean data types.

Zero, empty string, undefined, null, NaN, eval to false in a “if” statement. Everything else eval to true.

[see true, false]

Logic Operators

// “logical and” operator
true && true; //  true

// “logical or” operator
true || true; //  true

// “logical negation” operator
!true; // false

• Logic Operators

Number Comparison Operators

3 < 4; // true
3 > 4; //  false

3 == 3; // true.
3 == "3"; // true.  note: 「==」 does automatic type conversion
3 === "3"; // false.  True if both sides are same type and equal

3 != 4; // true. The 「!=」 is the negation of 「==」
3 !== 4; // true. The 「!==」 is the negation of 「===」

• Number Comparison Operators

If Then Else

Simple “if” statement.

if (3 < 4) console.log("yes");

“if else” statement.

if (3 <= 4) console.log("yes");
else console.log("no");

“else if” chain.

let x = 3;
if (x == 1) console.log("is 1");
else if (x == 2) console.log("is 2");
else if (x == 3) console.log("is 3");
else console.log("not found");

[see Branch Control: if then else, switch]

Iteration; Loop

The most useful loop syntax is “for” loop.

for (let i = 0; i < 9; i++) console.log(i);

[see for while do Loop]

Array

Array Basics

Define Function

Example of defining a function:

function ff(x, y) {
  return x + y;
}
console.log(ff(3, 4) === 7);

Another example using “arrow function” syntax:

const addOne = ((x) => (x + 1));

console.log(addOne(3) === 4);

For detail, see Define Function

JavaScript Object

Object Basics