Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Sign up
Appearance settings

Commit 72a99aa

Browse files
author
Jainam Desai
committed
πŸ”§ Updated website
1 parent f88a425 commit 72a99aa

File tree

9 files changed

+389
-150
lines changed

9 files changed

+389
-150
lines changed

β€Ž.jekyll-cache/Jekyll/Cache/Jekyll--Cache/b7/9606fb3afea5bd1609ed40b622142f1c98125abcfe89a76a661b0e8e343910β€Ž

Lines changed: 115 additions & 112 deletions
Large diffs are not rendered by default.

β€ŽREADME.mdβ€Ž

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
# Javascript ☒ Notes _(cause I can't memorise them all)_ πŸ₯΄
1+
# **Javascript ☒ Notes _(cause I can't memorise them all)_ πŸ₯΄**
22

33
<div align="center">
44
<img width="75%" alt="JavaScript" src ="images/javascript-logo-banner.jpg">
@@ -23,7 +23,7 @@ Hopefully going to cover everything...
2323

2424
---
2525

26-
## ✨ Contents
26+
## ✨ **Contents**
2727

2828
⚫ What on 🌍 is JavaSrcipt? 😢 [ Read β–Ά ](./notes/what-is-javascript.md)
2929

@@ -59,7 +59,7 @@ Hopefully going to cover everything...
5959

6060
---
6161

62-
## πŸš€ References
62+
## πŸš€ **References**
6363

6464
➑ [Mozilla](https://developer.mozilla.org/en-US/docs/Web/JavaScript)
6565
➑ [Fireship.io](https://fireship.io/courses/javascript/)

β€Ž_site/README.mdβ€Ž

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
# Javascript ☒ Notes _(cause I can't memorise them all)_ πŸ₯΄
1+
# **Javascript ☒ Notes _(cause I can't memorise them all)_ πŸ₯΄**
22

33
<div align="center">
44
<img width="75%" alt="JavaScript" src ="images/javascript-logo-banner.jpg">
@@ -23,7 +23,7 @@ Hopefully going to cover everything...
2323

2424
---
2525

26-
## ✨ Contents
26+
## ✨ **Contents**
2727

2828
⚫ What on 🌍 is JavaSrcipt? 😢 [ Read β–Ά ](./notes/what-is-javascript.md)
2929

@@ -59,7 +59,7 @@ Hopefully going to cover everything...
5959

6060
---
6161

62-
## πŸš€ References
62+
## πŸš€ **References**
6363

6464
➑ [Mozilla](https://developer.mozilla.org/en-US/docs/Web/JavaScript)
6565
➑ [Fireship.io](https://fireship.io/courses/javascript/)

β€Ž_site/notes/promises.mdβ€Ž

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -22,9 +22,9 @@ A Promise can be in one of `three` states:
2222

2323
➑ **Pending**, when the final value is not available yet. This is the only state that may transition to one of the other two states.
2424

25-
➑ **Fulfilled**, when and if the final value becomes available. A fulfillment value becomes permanently associated with the promise. This may be any value, including undefined.
25+
➑ **Fulfilled**, when and if the final value becomes available. A fulfillment value becomes permanently associated with the promise. This may be any value, including `undefined`.
2626

27-
➑ **Rejected**, if an error prevented the final value from being determined. A rejection reason becomes permanently associated with the promise. This may be any value, including undefined, though it is generally an Error object, like in exception handling.
27+
➑ **Rejected**, if an error prevented the final value from being determined. A rejection reason becomes permanently associated with the promise. This may be any value, including `undefined`, though it is generally an Error object, like in exception handling.
2828

2929
Promises work in two phases.
3030

@@ -36,27 +36,27 @@ Promise are create with the `new Promise()` constructor initially in the pending
3636
Here is how you would create one:
3737

3838
```js
39-
const getVeggie = (name) => {
40-
const veggies = {
39+
const getFruit = (name) => {
40+
const fruits = {
4141
mango: "πŸ₯­",
4242
apple: "🍎",
4343
banana: "🍌",
4444
avocado: "πŸ₯‘",
4545
};
4646

47-
let flag = veggies[name];
47+
let flag = fruits[name];
4848

4949
return new Promise((resolve, reject) => {
5050
if (flag) {
51-
resolve("Yay there is Veggie! πŸ˜„");
51+
resolve("Yay there is Fruit! πŸ˜„");
5252
} else {
53-
reject("Sorry there's no Veggie πŸ˜”");
53+
reject("Sorry there's no Fruit πŸ˜”");
5454
}
5555
});
5656
};
5757
```
5858

59-
The next step is to consume the above Promise. Promises are either `resolved` or `rejected`. If a promise is `resolved` it means that it ran successful and has returned a value we can use. If a promise is `rejected` it means that it has failed to run properly.
59+
The next step is to consume the above Promise. Promises are either `resolved` or `rejected`. If a promise is `resolved` it means that it ran successfully and has returned a value we can use. If a promise is `rejected` it means that it has failed to run properly.
6060

6161
Here is how you would consume a Promise:
6262

β€Ž_site/notes/this.mdβ€Ž

Lines changed: 120 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,127 @@
1-
# **Are you looking for `this`? 'πŸ™„ **
1+
# **Are you looking for `this`? πŸ™„**
22

3-
[Home](../README.md) / Are you looking for `this`? 'πŸ™„
3+
[Home](../README.md) / Are you looking for `this`? πŸ™„
44

55
---
66

7+
## **What is `this` πŸ˜₯**
8+
9+
In JavaScript `this` refers to the current object that is executing the current function. It has different values depending on where it is used.
10+
11+
Read more or about objects [here](./objects.md).
12+
13+
## The `this` reference 😳
14+
15+
βœ… If the function is inside an Object then `this` refers to the that object.
16+
17+
Example:
18+
19+
```js
20+
const cookie = {
21+
flavour: "chocolate",
22+
eat() {
23+
console.log(`I am a ${this.flavour} πŸͺ and I was eaten!`);
24+
},
25+
};
26+
27+
Cookie.eat();
28+
29+
// This is another way of writing the above code.
30+
const cookie = {
31+
flavour: "chocolate",
32+
eat: function () {
33+
console.log(`I am a ${this.flavour} πŸͺ and I was eaten!`);
34+
},
35+
};
36+
37+
// Both the codes are same.
38+
```
39+
40+
This will not work if we use it inside an [Arrow Function](./arrow-functions.md) or inside a nested function.
41+
42+
Example
43+
44+
```js
45+
// this will not work
46+
const cookie = {
47+
flavour: "chocolate",
48+
eat: () => {
49+
console.log(`I am a ${this.flavour} πŸͺ and I was eaten!`);
50+
},
51+
};
52+
53+
// OR
54+
55+
const cookie = {
56+
flavours: ["chocolate", "stawberry", "vanilla"],
57+
eatAllCookies() {
58+
this.flavours.forEach(function (flavour) {
59+
// πŸ‘ˆ Anonymous nest function
60+
console.log(`I am ${flavour} πŸͺ and I was eaten!`); // πŸ‘ˆ Will output "I am 'undefined' and I was eaten!"
61+
});
62+
},
63+
};
64+
```
65+
66+
To bind the object we need to pass the `this` object as an argument to the `forEach()` function.
67+
68+
```js
69+
const cookie = {
70+
flavours: ["chocolate", "stawberry", "vanilla"],
71+
eatAllCookies() {
72+
this.flavours.forEach(function (flavour) {
73+
console.log(`I am ${flavour} πŸͺ and I was eaten!`);
74+
}, this); // πŸ‘ˆ here this refers to the current "flavours" array, which in turn is an object.
75+
},
76+
};
77+
78+
// Works like a charm πŸ˜‹
79+
cookie.eatAllCookies();
80+
```
81+
82+
---
83+
84+
βœ… If the function is a regular function then `this` refers to the `window` object in browser and the `global` object in node.
85+
86+
Example:
87+
88+
```js
89+
function eatCookie() {
90+
console.log(this);
91+
console.log("this doesn't have a πŸͺ object");
92+
}
93+
94+
// It will print the window object if run in browser and global if run in node.
95+
```
96+
97+
**We can prevent `this` from binding to the global if we use `strict` mode.**
98+
99+
> `this` is `undefined` in a normal function when using the `strict` mode.
100+
101+
```js
102+
"use strict";
103+
104+
function eatCookie() {
105+
console.log(this);
106+
console.log("this doesn't have anything!");
107+
}
108+
109+
// the above code will not log the global or window object, instead it will print 'undefined'.
110+
```
111+
112+
`this` again behaves different if we invoke a function using the `new` operator.
113+
114+
```js
115+
function Cookie() {
116+
this.flavour = "I am a chocolate πŸͺ";
117+
console.log(this.flavour, "and I was eaten!");
118+
}
119+
120+
const cookie = new Cookie();
121+
```
122+
123+
When we use the `new` operator, it creates a new empty object `{ }`. Then names that object `Cookie` and adds `flavour` property to it.
124+
7125
---
8126

9127
See also

β€Ž_site/scripts/promise.jsβ€Ž

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,22 +1,22 @@
1-
const getVeggie = (name) => {
2-
const veggies = {
1+
const getFruit = (name) => {
2+
const fruits = {
33
mango: "πŸ₯­",
44
apple: "🍎",
55
banana: "🍌",
66
avocado: "πŸ₯‘",
77
};
88

9-
let flag = veggies[name];
9+
let flag = fruits[name];
1010

1111
return new Promise((resolve, reject) => {
1212
if (flag) {
13-
resolve("Yay there is Veggie! πŸ˜„");
13+
resolve("Yay there is Fruit! πŸ˜„");
1414
} else {
15-
reject("Sorry there's no Veggie πŸ˜”");
15+
reject("Sorry there's no Fruit πŸ˜”");
1616
}
1717
});
1818
};
1919

20-
getVeggie("mango")
20+
getFruit("mango")
2121
.then((response) => console.log(response))
2222
.catch((error) => console.log(error));

β€Žnotes/promises.mdβ€Ž

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -22,9 +22,9 @@ A Promise can be in one of `three` states:
2222

2323
➑ **Pending**, when the final value is not available yet. This is the only state that may transition to one of the other two states.
2424

25-
➑ **Fulfilled**, when and if the final value becomes available. A fulfillment value becomes permanently associated with the promise. This may be any value, including undefined.
25+
➑ **Fulfilled**, when and if the final value becomes available. A fulfillment value becomes permanently associated with the promise. This may be any value, including `undefined`.
2626

27-
➑ **Rejected**, if an error prevented the final value from being determined. A rejection reason becomes permanently associated with the promise. This may be any value, including undefined, though it is generally an Error object, like in exception handling.
27+
➑ **Rejected**, if an error prevented the final value from being determined. A rejection reason becomes permanently associated with the promise. This may be any value, including `undefined`, though it is generally an Error object, like in exception handling.
2828

2929
Promises work in two phases.
3030

@@ -36,27 +36,27 @@ Promise are create with the `new Promise()` constructor initially in the pending
3636
Here is how you would create one:
3737

3838
```js
39-
const getVeggie = (name) => {
40-
const veggies = {
39+
const getFruit = (name) => {
40+
const fruits = {
4141
mango: "πŸ₯­",
4242
apple: "🍎",
4343
banana: "🍌",
4444
avocado: "πŸ₯‘",
4545
};
4646

47-
let flag = veggies[name];
47+
let flag = fruits[name];
4848

4949
return new Promise((resolve, reject) => {
5050
if (flag) {
51-
resolve("Yay there is Veggie! πŸ˜„");
51+
resolve("Yay there is Fruit! πŸ˜„");
5252
} else {
53-
reject("Sorry there's no Veggie πŸ˜”");
53+
reject("Sorry there's no Fruit πŸ˜”");
5454
}
5555
});
5656
};
5757
```
5858

59-
The next step is to consume the above Promise. Promises are either `resolved` or `rejected`. If a promise is `resolved` it means that it ran successful and has returned a value we can use. If a promise is `rejected` it means that it has failed to run properly.
59+
The next step is to consume the above Promise. Promises are either `resolved` or `rejected`. If a promise is `resolved` it means that it ran successfully and has returned a value we can use. If a promise is `rejected` it means that it has failed to run properly.
6060

6161
Here is how you would consume a Promise:
6262

0 commit comments

Comments
(0)

AltStyle γ«γ‚ˆγ£γ¦ε€‰ζ›γ•γ‚ŒγŸγƒšγƒΌγ‚Έ (->γ‚ͺγƒͺγ‚ΈγƒŠγƒ«) /