Introduction

Ⅰ. Introduction

I organized contents by referencing the following site: https://codecademy.com/

Browser war

• Netscape made an easier scripting language
  • for a lightweight scripting language
  • Mocha → JavaScript

---

0. Entering

1) Points

• can be used in both the front-end and back-end
• integrates easily with HTML and CSS in Front-end

 

2) For Servers

• used to process and respond to front-end requests for scalability
• used to integrate with other languages to communicate with db
• Node.js
  • can execute programs out of sequential order using callback()

 

3) For Desktop Applications (program)

• Electron.js
  • can be used regardless of operating system

 

4) ES6 and Before

• ECMAScript: a standards of JavaScript
• ES6 = ES2015 = the version of JavaScript

• New keywords like let  and const
• New function syntax using Arrow functions

function(parameter) => {return value;}
() => {...}
(){...}

• Creation of Classes
• parameters with default values
• Promises for asynchronous actions
• ...

 

5) API

https://developer.mozilla.org/en-US/docs/Web/JavaScript

---

1. Console

• console : A built-in object, a collection of data and actions
• console.log() = System.out.println()

 

2. 7 Data Types

Primitive data types

1) Number

• all numbers with decimals

 

2) String

• Any grouping of characters, '...' | "..."

 

3) Boolean

• true | false

 

4) Null

• Intentionally absence of a value

 

5) Undefined

• The absence of a value
• When an object is not initiated, it is undefined

 

6) 🆕 Symbol

• Unique identifiers

 

Referenced data type

7) Object

• A collection of related data

---

3. String

• Every String instance has a property, length

1) Methods

• toUpperCase()
• startsWith(a character) returns true of false if the string has it
• trim() removes spaces before and after a string

---

4. Built-in Objects

• console
• Math
  • Math.random() * range (included the last)
  • Math.floor(): rounds the number down to the nearest whole number
• Number.isInteger(#): checks whether # is an integer

---

5. Object

let car = {
	speed: 10,
	'Fuel Type': 'oil'
};

// access a property of the object, car
car.speed;
car['speed'];
car['color']; // undefined

//-----------------------------------------
['A', 'B', 'C'][0]; //'A'

 

1) Property Assignment

• If there was no property with an object, a new property will be added

(Object[propertyName]) (Assignment operator '=') {value};

let car = {
	speed: 10,
	'Fuel Type': 'oil'
};

---

6. Methods

• Object can hava a function
• Objects can have objects inside
• console.log() means the object, console has the method, log()

---

7. Variables

1) var

• Before ES6, var is only used

var variable1 = "hello";
console.log(variable1);

 ✨ Naming rules

• names cannot start with numbers
• case sensitive - 🙅🏻‍♂️🙅🏻‍♂️🙅🏻‍♂️🙅🏻‍♂️ same Name 🙅🏻‍♂️🙅🏻‍♂️🙅🏻‍♂️🙅🏻‍♂️
  • myName ≠ myname
• Variable names cannot be the same as keywords (abstract, boolean, ...)

 

2) let

• If we don’t assign a value to let , it automatically has a value of  undefined

let variable2 = true;
variable2 = false;
console.log(variable2); // out: false

 

3) const

• cannot be reassigned
• If a const variable is reassigned, TypeError would be returned
• const should be assigned a value when declared
  • If not, SyntaxError would be returned

const variable3 = 'hello';
// varialbe3 = 'hello2'; // TypeError

 

4) String interpolation (ES6)

• we can access variable using template literal w/ backticks ``
• Use template literals to embed variables into strings

`I have a dog, ${dogName}`

---

8. Conditional Statements

• if
• if...else
• Comparison operator: <, >, ≤, ≥, ===, !==
• Logical operator: &&, ||, !
• If variables have any values, they are true
  • false: 0, “”, ‘’, null, undefined, NaN
• Tenary operator

condition ? true : false

 

• switch(checkValue)...case ‘isValue?’:...break;...default:...break;