Merge pull request #287 from DhanushAdithya/master

Made some improvements for the files in javascript folder
This commit is contained in:
Jean-Philippe Sirois
2020-07-24 11:28:03 -04:00
committed by GitHub
7 changed files with 24 additions and 34 deletions
@@ -26,8 +26,8 @@ async function getWeather() {
return "sunny"; return "sunny";
} }
getPromise(); getWeather();
// Promise<"sunny"> // Promise {<resolved>: "sunny"}
``` ```
This basic example will return a promise with the value of `getWeather`. This basic example will return a promise with the value of `getWeather`.
@@ -135,7 +135,7 @@ async function getCharacters() {
In this example, we are querying real data from the Rick & Morty API. This API has a lot of information regarding Rick & Morty, but here, we are trying to retrieve all the characters. In this example, we are querying real data from the Rick & Morty API. This API has a lot of information regarding Rick & Morty, but here, we are trying to retrieve all the characters.
- The first thing we do is use `fetch` to retrieve the data from the API. `fetch` is a built in function in web browsers to do http requests, and returns a Promise by default. We `await` the result of this. - The first thing we do is use `fetch` to retrieve the data from the API. `fetch` is a built in function in web browsers to do http requests, and returns a Promise by default. We `await` the result of this.
- When we get the result, we need to get the `JSON` value of the data. To do this, the `.json()` method from fetch is used. We then return the results. - When we get the response, we need to get the `JSON` value of the data. To do this, the `.json()` method from fetch is used. We then return the results.
- As `await` can only be used in an `async` function, we use the method from above to make this work. As `getCharacters()` returns a Promise due to it being `async`, we `await` the result. We surround this in a `try...catch` in case fetch returns an error. Then, if no error is returned, `characters` contains the information we want, and is logged to the console. If `getCharacters()` returns an error, that error is also logged. - As `await` can only be used in an `async` function, we use the method from above to make this work. As `getCharacters()` returns a Promise due to it being `async`, we `await` the result. We surround this in a `try...catch` in case fetch returns an error. Then, if no error is returned, `characters` contains the information we want, and is logged to the console. If `getCharacters()` returns an error, that error is also logged.
### Let's also look at an example from Discord.js: ### Let's also look at an example from Discord.js:
@@ -57,7 +57,7 @@ Promises are possibly the #1 most common source of confusion for beginners. In o
to avoid falling in pitfalls yourself, you have to remember 2 things about Javascript when to avoid falling in pitfalls yourself, you have to remember 2 things about Javascript when
working with promises. working with promises.
1. Javascript does not wait. 1. Javascript _does not_ wait.
2. No seriously, Javascript won't wait for your promises! 2. No seriously, Javascript won't wait for your promises!
You may have tried doing something like this before. You may have tried doing something like this before.
@@ -8,7 +8,7 @@ title: Simplifying Promises
The first naive attempt, using new Promise for something that already returns a promise. The first naive attempt, using new Promise for something that already returns a promise.
```js ```js
function doAsync(number) { function doAsync() {
return new Promise(function (resolve, reject) { return new Promise(function (resolve, reject) {
doDatabase().then(function (dbResult) { doDatabase().then(function (dbResult) {
otherDbFunction(dbResult).then(function (secondResult) { otherDbFunction(dbResult).then(function (secondResult) {
@@ -23,7 +23,7 @@ Turns out you don't need new Promise if you're working with a function that
already returns a promise, you can just return the original thing. already returns a promise, you can just return the original thing.
```js ```js
function doAsync(number) { function doAsync() {
return doDatabase().then(function (dbResult) { return doDatabase().then(function (dbResult) {
otherDbFunction(dbResult).then(function (secondResult) { otherDbFunction(dbResult).then(function (secondResult) {
return secondResult + 10; return secondResult + 10;
@@ -36,7 +36,7 @@ You also don't have to nest `.then` functions, the whole point of promises
is that they allow you to chain them sequentially. is that they allow you to chain them sequentially.
```js ```js
function doAsync(number) { function doAsync() {
return doDatabase() return doDatabase()
.then(function (dbResult) { .then(function (dbResult) {
return otherDbFunction(dbResult); return otherDbFunction(dbResult);
@@ -51,7 +51,7 @@ you also don't have to create a new function just to pass in one
variable, you can pass in the entire function itself to the then block variable, you can pass in the entire function itself to the then block
```js ```js
function doAsync(number) { function doAsync() {
return doDatabase() return doDatabase()
.then(otherDbFunction) .then(otherDbFunction)
.then(function (secondResult) { .then(function (secondResult) {
@@ -63,7 +63,7 @@ function doAsync(number) {
And you don't need those returns if you just have ES6 arrow functions And you don't need those returns if you just have ES6 arrow functions
```js ```js
const doAsync = (number) => const doAsync = () =>
doDatabase() doDatabase()
.then(otherDbFunction) .then(otherDbFunction)
.then((secondResult) => secondResult + 10); .then((secondResult) => secondResult + 10);
@@ -33,7 +33,7 @@ console.log(myVar);
## Dynamic Types ## Dynamic Types
Variables in Javascript do not have explicit types, as some other languages (eg: Java) do. This means that when declaring a variable, you only use `name = value`, and don't need to add a type as well. The type is automatically chosen based on the value. Variables in Javascript do not have explicit types, as some other languages (eg: Java, C++) do. This means that when declaring a variable, you only use `name = value`, and don't need to add a type as well. The type is automatically chosen based on the value.
```js ```js
let myString = "Hello"; let myString = "Hello";
@@ -76,10 +76,10 @@ myArray.push(5);
console.log(myArray); // [1,2,3,4,5] console.log(myArray); // [1,2,3,4,5]
const myObj = { foo: "bar" }; const myObj = { foo: "bar" };
console.log(myObj); // {foo: bar} console.log(myObj); // {foo: "bar"}
myObj.foo = "re-assigned"; myObj.foo = "re-assigned";
console.log(myObj); // {foo: re-assigned} console.log(myObj); // {foo: "re-assigned"}
``` ```
This, however, will still not work: This, however, will still not work:
@@ -87,7 +87,7 @@ This, however, will still not work:
```js ```js
const myArray = [1, 2, 3]; const myArray = [1, 2, 3];
myArray = [1, 2, 3, 4, 5]; // Error: myArray has already been defined myArray = [1, 2, 3, 4, 5]; // Error: Assignment to constant variable
``` ```
## What about var? ## What about var?
@@ -118,12 +118,12 @@ This is fixed using `let`
for (let i = 0; i < 5; i++) { for (let i = 0; i < 5; i++) {
console.log(i); console.log(i);
} }
console.log(i); // Error: i is undefined console.log(i); // Error: i is not defined
if (true) { if (true) {
let myVar = "test"; let myVar = "test";
} }
console.log(myVar); // Error: myVar is undefined console.log(myVar); // Error: myVar is not defined
``` ```
However, if the above code was in a function, this would not be the case. In the case of a function, the variable will be scoped to the given function, and not accessible outside it. Eg: However, if the above code was in a function, this would not be the case. In the case of a function, the variable will be scoped to the given function, and not accessible outside it. Eg:
@@ -132,7 +132,7 @@ However, if the above code was in a function, this would not be the case. In the
function myFunction() { function myFunction() {
var myVar = "test"; var myVar = "test";
} }
console.log(myVar); // Error: test is undefined console.log(myVar); // Error: test is not defined
``` ```
This can cause confusing behaviour, as `var` has different scoping behaviour depending on if its in a function or not. This is solved by using `let` or `const`. This can cause confusing behaviour, as `var` has different scoping behaviour depending on if its in a function or not. This is solved by using `let` or `const`.
@@ -22,9 +22,9 @@ The addition operator is used to add two numeric values (can be hex, integers or
1 + 4 # equals 5 1 + 4 # equals 5
1.1 + 1.1 # equals 2.2 1.1 + 1.1 # equals 2.2
0x100 + 0x100 # 512 0x100 + 0x100 # 512
'hello'+' '+'word' # equals hello world 'hello' + ' ' + 'word' # equals hello world
[1,3]+[2] # equals [1,3,2] [1,3] + [2] # equals [1,3,2]
(1,1)+(2,2) # equals (1,1,2,2) (1,1) + (2,2) # equals (1,1,2,2)
``` ```
### Subtraction Operator - `-` ### Subtraction Operator - `-`
@@ -39,22 +39,12 @@ The subtraction operator is used to subtract two numeric values, subtracting the
### Division Operator - `/` ### Division Operator - `/`
The division operator is used to divide two numeric values, dividing the value on the left hand side by the one on the right hand side (can be hex, integers or floats), returning a base 10 number float.
```python
8 / 2 # equals 4.0
8 / 3 # 2.6666666666666665
10 / 1.1 # equals 9.09090909090909
0x200 / 0x10 # 32.0
```
### Division Operator - `/`
The division operator is used to divide two numeric values, dividing the operand on the left hand side by the operand on the right hand side (can be hex, integers or floats), returning a base 10 number float. The division operator is used to divide two numeric values, dividing the operand on the left hand side by the operand on the right hand side (can be hex, integers or floats), returning a base 10 number float.
```python ```python
8 / 2 # equals 4.0 8 / 2 # equals 4.0
8 / 3 # 2.6666666666666665 8 / 3 # 2.6666666666666665
10 / 1.1 # equals 9.09090909090909
0x200 / 0x10 # 32.0 0x200 / 0x10 # 32.0
``` ```
@@ -134,8 +124,8 @@ a == a # equals True
Compares the two operands on either side of the operator, returning `True` if they are not equal and `False` if they are equal. Strict type comparison, therefore this operators acts as a not identical operator. Compares the two operands on either side of the operator, returning `True` if they are not equal and `False` if they are equal. Strict type comparison, therefore this operators acts as a not identical operator.
```python ```python
8 != 4+4 # equals False 8 != 4 + 4 # equals False
8 != 3+3 # equals True 8 != 3 + 3 # equals True
'8' != 8 # equals True '8' != 8 # equals True
``` ```
@@ -18,7 +18,7 @@ First you will have to navigate to https://netlify.com then login with your pref
Now, there are two ways to deploy a site. Now, there are two ways to deploy a site.
1. From a Github repository 1. From a Github repository
2. Just drag and drop the files 2. Just drag and drop the files.
So if you got your site files or Github repository ready, let's get started! So if you got your site files or Github repository ready, let's get started!
## 1. Deploying site from a Github repository ## 1. Deploying site from a Github repository
@@ -2,7 +2,7 @@
authors: authors:
- "veksen#1565" - "veksen#1565"
created_at: 2019/12/15 created_at: 2019/12/15
title: Python title: Web-Development
--- ---
###### Get started ###### Get started