From 21b3fa9904a7ea97ef3716cd49d4aea47e5bb856 Mon Sep 17 00:00:00 2001 From: Matt Huntington Date: Sun, 6 May 2018 14:01:29 -0400 Subject: [PATCH] reorg --- README.md | 5 +- hoisting/README.md | 0 js-basics/README.md | 187 +++++++++++++++++++++++++++++++++++++++++++- 3 files changed, 188 insertions(+), 4 deletions(-) create mode 100644 hoisting/README.md diff --git a/README.md b/README.md index 504cf32..041293f 100644 --- a/README.md +++ b/README.md @@ -2,14 +2,13 @@ ## Basics -[JavaScript Basics](js-basics) -[jQuery Basics](jquery) [Events](events) +[Hoisting](hoisting) [JavaScript Module Patterns](modules) +[Webpack](webpack) ## AJAX -[Webpack](webpack) [Ajax](ajax) [Promises](promises) [Mocking Ajax Requests](mocking-ajax) diff --git a/hoisting/README.md b/hoisting/README.md new file mode 100644 index 0000000..e69de29 diff --git a/js-basics/README.md b/js-basics/README.md index c807c14..1a17c58 100644 --- a/js-basics/README.md +++ b/js-basics/README.md @@ -1 +1,186 @@ -includes Hoisting and closures +# Intro to JS + +## Lesson Objectives + +1. Add comments to code +1. Describe the basic data types of JS +1. Assign values to variables +1. Concatenate values +1. Boolean expressions +1. Operators +1. Write a While loop +1. Write a For loop + +## Add comments to code + +single line comment: + +``` +// this is a single line comment +``` + +multi-line comment: + +``` +/* +this is +a mult-line +comment + */ +``` + +## Describe the basic data types of JS + +Strings: + +```javascript +console.log("hello world"); +``` + +Numbers: + +```javascript +console.log(100); +``` + +## Assign values to variables + +```javascript +var phrase = 'In my room is a chair and a table'; +console.log(phrase); +``` + +**We will not be using `var`** (it's a bit out of date), instead we will be using **`let`** and **`const`**. + +Let's use `const` here: + +```javascript +const phrase = 'In my room is a chair and a table'; +const sum = 99 + 1; +``` + +`const` variables are **constant** and do not change. Now that the phrase is saved to a variable, we can call it whenever. + +```javascript +console.log(phrase); +console.log(sum); +``` + +### Variable re-assignment + +With `const`, you cannot reassign a variable. It is CONSTANT. + +```javascript +const item = ' chair'; +item = 'eclair'; +``` + +You can re-assign variables with `let`: + +```javascript +let item = 'chair'; +item = 'eclair'; +console.log(item); +``` + +## Concatenate values + +JavaScript allows us to add strings together with `+`: + +```javascript +console.log('hello' + ' world'); +``` +We can insert values of variables into our strings: + +```javascript +const adjective = 'beautiful'; +console.log('What a ' + adjective + ' day!!'); +``` + +## Boolean expressions + +Test various kinds of equality + +* `>` greater than +* `<` less than +* `==` equal to +* `>=` greater than or equal to +* `<=` less than or equal to +* `!=` is not equal + +```javascript +console.log(5 <= 10); +console.log("asdf" != "fun"); +``` + +## Operators + +### Math + +We can do arithmetic with numbers: + +```javascript +console.log(100 + 100); +console.log(100 - 50); +console.log(100 * 10); +console.log(100 / 10); +``` + +#### Postfix operator + +```javascript +i++; +i--; +``` + +is the same as + +```javascript +i = i + 1; +i = i - 1; +``` + +#### Compound assignment operator `+=` + +```javascript +i += 3; //increments by 3 +i -= 3; //decrement by 3 +``` + +is the same as + +```javascript +i = i + 3; +i = i - 3; +``` + +## Write a While loop + +```javascript +let num = 1; + +while (num <= 1000) { + console.log('The number is: ' + num); + num++; +} +``` + +## Write a For loop + +```javascript +for (let i=1; i <= 1000; i++) { + console.log('The number is: ' + i); +} +``` + +There are three parts to the 'control panel' of the loop, delimited by the semicolon: + +```javascript +for (initial condition; while condition; repeating expression) { + +} +``` + +1. some initial code supplied to the loop -- usually a numerical starting value of the loop +2. the condition under which the loop runs -- it will run while the expression is true +3. a repeating expression that runs at the end of each loop -- usually an instruction to increase the numerical starting value