diff --git a/docs/unit6.mdx b/docs/unit6.mdx
index d8c2015..a260c96 100644
--- a/docs/unit6.mdx
+++ b/docs/unit6.mdx
@@ -29,7 +29,7 @@ Here's a quick overview of the basics.
```javascript
console.log("Hello, World!");
// In Web Development, this will actually show up in the developer console.
-// Open the console in Chrome with cmd+alt+j (mac) or ctrl+shift+j (windows)
+// Open the console in Chrome with Cmd+Alt+J (mac) or Ctrl+Shift+J (windows)
```
### Variables
@@ -99,7 +99,7 @@ console.log(array); // "['a', 'b', 'c', 1, 2, 3, '4']"
const str = array.join('-'); // Combine elements into a string
console.log(str); // "a-b-c-1-2-3-4"
-//get index of an element (first occurrence)
+// get index of an element (first occurrence)
console.log(array.indexOf('x')); // 3
array.reverse(); // Reverse the array
@@ -154,7 +154,7 @@ const numbers = [1, 2, 3, 4];
const doubled = numbers.map(function(item) {
return item * 2;
});
-console.log(doubled); // "[2, 4, 6, 8]"
+console.log(doubled); // [2, 4, 6, 8]
```
#### Filter
@@ -165,7 +165,7 @@ const numbers = [1, 2, 3, 4];
const evens = numbers.filter(function(item) {
return item % 2 === 0;
});
-console.log(evens); // "[2, 4]"
+console.log(evens); // [2, 4]
```
#### Reduce
@@ -182,10 +182,10 @@ const numbers = [1, 2, 3, 4];
// Callback Function parameters
// result - the accumulator, which is the returned value of the previous iteration.
// item - the current item in the array.
-//
+
// Note: the intial value of the accumulator is set to 0.
const sum = numbers.reduce(function (result, item) { return result + item; }, 0);
-console.log(sum); // "10"
+console.log(sum); // 10
```
### Conditionals
@@ -295,7 +295,7 @@ Unlike python, you don't need quotes around the keys.
const ages = {alice:40, bob:35, charles:13}
const things = {num:12, dog:'woof', list:[1,2,3]}
-//both of these work!
+// both of these work!
console.log(ages["alice"]); // 40
console.log(ages.bob); // 35
```
@@ -400,7 +400,7 @@ Create a new file with the `.js` file extension.
Add this to the file:
```javascript
-//hello.js
+// hello.js
console.log("Hello, World!")
```
diff --git a/docs/unit7.mdx b/docs/unit7.mdx
index 13a2f86..176fa36 100644
--- a/docs/unit7.mdx
+++ b/docs/unit7.mdx
@@ -47,7 +47,7 @@ React is a JavaScript library to build user interfaces, usually websites. Create
Alright, one more small thing before we dive in to React! React uses JavaScript, but more specifically, it's called JSX. This is a syntax extension to JavaScript.
-```jsx'
+```jsx
// an example of JSX
const element = Hello, world!
;
```
@@ -57,9 +57,11 @@ JSX combines our markup language (HTML-like), and our logic (JavaScript). This l
```jsx
const name = 'Raman Gupta';
const element = Hello, {name}
;
-//we can do this in element attributes as well
-const imgURL = "./path/to/image.png"
+
+// we can do this in element attributes as well
+const imgURL = "./path/to/image.png";
const imgElement = 
;
+
// we use className instead of class to give elements a class
const withClass= ;
```
@@ -103,13 +105,14 @@ This component returns what we want our user to see on their screen. More specif
```jsx
React.createElement("div", {
- className: "shopping-list"
- }, React.createElement("h1", null, "Shopping List for ", props.name),
- React.createElement("ul", null,
- React.createElement("li", null, "Instagram"),
- React.createElement("li", null, "WhatsApp"),
- React.createElement("li", null, "Oculus")
- )
+ className: "shopping-list"
+ },
+ React.createElement("h1", null, "Shopping List for ", props.name),
+ React.createElement("ul", null,
+ React.createElement("li", null, "Instagram"),
+ React.createElement("li", null, "WhatsApp"),
+ React.createElement("li", null, "Oculus")
+ )
);
```
@@ -178,12 +181,14 @@ In this instance of the `Welcome` component, it can access this data using the `
```jsx
-//In the component the props object would look like this:
+
+// In the component the props object would look like this:
props = {
"name": "Sara",
"title": "Ms."
}
-//We can use props like this
+
+// We can use props like this
function Welcome(props) {
return Hello, {props.name}
;
}
@@ -255,8 +260,8 @@ This is something called Array Destructuring, a cool feature of JavaScript.
```javascript
let [greeting, pronoun] = ["Hello", "I" , "love", "AntAlmanac"];
-console.log(greeting);//"Hello"
-console.log(pronoun);//"I"
+console.log(greeting); // "Hello"
+console.log(pronoun); // "I"
```
In our example in React, `useState` returns an array of 2 values. The first being the value of the state variable. The second is a function to set the state variable.
@@ -270,9 +275,9 @@ We can also do Object Destructuring. This is similar to arrays, but we are inste
```javascript
let {name, organization, role} = {name: "Raman", organization: "ICSSC", role: "Projects Co-Chair"};
-console.log(name);//"Raman"
-console.log(organization);//"ICSSC"
-console.log(role);//Projects Co-Chair"
+console.log(name); // "Raman"
+console.log(organization); // "ICSSC"
+console.log(role); // "Projects Co-Chair"
```
Note the names on the left hand side should have the same name as the property key in the object.
@@ -280,8 +285,8 @@ If we want to assign a new variable name, we can. We also don't need to extract
```javascript
let {name, organization: club} = {name: "Raman", organization: "ICSSC", role: "Projects Co-Chair"};
-console.log(name);//"Raman"
-console.log(club);//"ICSSC"
+console.log(name); // "Raman"
+console.log(club); // "ICSSC"
```
This is also often used in function arguments.
diff --git a/docs/unit9.mdx b/docs/unit9.mdx
index 2ea43bb..48edbda 100644
--- a/docs/unit9.mdx
+++ b/docs/unit9.mdx
@@ -113,7 +113,7 @@ const user: User = {
}
// We will get this error:
// Type '{ username: string; id: number; }' is not assignable to type 'User'.
-// Object literal may only specify known properties, and 'username' does not exist in type 'User'.ts(2322)
+// Object literal may only specify known properties, and 'username' does not exist in type 'User'.ts(2322)
```
We can make our object more flexible by making it indexable.
@@ -125,7 +125,8 @@ interface User {
id: number;
[key: string]: any;
}
-//This is now allowed
+
+// This is now allowed
const user: User = {
name: "Raman",
username: "ramanxg",
@@ -145,7 +146,8 @@ We can use string or number literals to define a set of values a value can be, o
```tsx
type LockStates = "locked" | "unlocked";
type someString = string | string[];
-//both are valid
+
+// both are valid
let a: someString = "hello"
let b: someString = ["hello", "world", "!"]
```
@@ -177,16 +179,16 @@ const y: MyType = {
TypeScript is “transpiled” to JavaScript.
```tsx
-//hello.ts
-var courseNumber: number = 133;
+// hello.ts
+let courseNumber: number = 133;
console.log('Hello, IN4MATX ' + courseNumber + '!');
```
We transpile with the typescript compiler using`tsc hello.ts`.
```tsx
-//hello.js
-var courseNumber = 133;
+// hello.js
+let courseNumber = 133;
console.log('Hello, IN4MATX ' + courseNumber + '!');
```