Skip to content

Commit 68d3c53

Browse files
yanarchyyanarchy
committed
Add intro to comparisons
1 parent 2a09fe8 commit 68d3c53

File tree

2 files changed

+110
-0
lines changed

2 files changed

+110
-0
lines changed

‎README.md

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,7 @@ You will need:
1414
* [Welcome Slides](https://docs.google.com/presentation/d/e/2PACX-1vRs7Zh_xmRbUxwJszgHqnbxON3tLlWn0lR1EDj_oz4dwijtzFK9h8x5Ub9TB2r7WjyOz_AeXeqnX1fh/pub?start=false&loop=false&delayms=3000)
1515
* [Foundations of Programming](https://github.com/codechrysalis/intro-javascript/blob/master/foundations.md)
1616
* [Intro to Functions](https://github.com/codechrysalis/intro-javascript/blob/master/intro-functions.md)
17+
* [Intro to Comparisons](https://github.com/codechrysalis/intro-javascript/blob/master/intro-comparisons.md)
1718

1819
## What to Do Next?
1920

‎intro-comparisons.md

Lines changed: 109 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,109 @@
1+
# Intro to Comparisons
2+
3+
## Objectives
4+
5+
- Use the `boolean` data type
6+
- Use logical _operators_ in _expressions_
7+
- Create `function`s that use logical _operators_
8+
9+
## Lecture Slides
10+
11+
[Intro to Comparisons Lecture Slides](https://docs.google.com/presentation/d/e/2PACX-1vQO1VunxcsDMXX53sJ2cRDG1NiSuvTTgM-CX7HPwvk2bdtsDOJ8w3bsh0ceryV1Xol1lKUXl9D53lOu/embed?start=false&loop=false&delayms=10000)
12+
13+
## Vocabulary
14+
15+
- `boolean` - either `true` or `false`
16+
Named after Mathematician [George Boole](https://en.wikipedia.org/wiki/George_Boole)
17+
18+
## Helpful Link
19+
20+
- [Operators - Mozilla Developer Network](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators)
21+
22+
## Exercises
23+
24+
Create a new folder called **intro-comparisons** in **week-01/4-thursday**
25+
Copy the **index.html** and **script.js** from the template folder into the **intro-comparisons** folder
26+
27+
The **index.html** should be as follows. If it doesn't match then paste the code from below.
28+
29+
```html
30+
<!DOCTYPE html>
31+
<html lang="en">
32+
33+
<head>
34+
<meta charset="utf-8">
35+
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
36+
<meta name="theme-color" content="#000000">
37+
<script type="text/javascript" src="script.js"></script>
38+
</head>
39+
40+
<body>
41+
<h1>Open your console to view your code! </h1>
42+
</body>
43+
44+
</html>
45+
```
46+
47+
Inside of **script.js** complete the following exercises:
48+
49+
### Basic Requirements
50+
51+
1. Before running the code below, what do you think the _expressions_ will resolve to? Try them in the console to see if you are correct!
52+
53+
```js
54+
"true" === true;
55+
"true" == true;
56+
3 >= 3;
57+
3 !== 4;
58+
```
59+
60+
1. Copy the code into your script.js file and fill in the ??? with the appropriate comparison operators or values to make the statements output the expected Boolean value. Open **index.html** in Chrome and then open the Developer Console to check the results.
61+
62+
```js
63+
console.log(1100 ??? 99) // should return true
64+
65+
console.log(1 ??? 21) // => false
66+
67+
console.log(62 !== ???) // => true
68+
69+
console.log("5" ??? 5) // => false
70+
71+
console.log("6" ??? "six") // => true
72+
```
73+
74+
1. Copy the code into your **script.js** file and change the _operator_ in the _expression_ below so that it evaluates to `false`.
75+
76+
```js
77+
console.log(3 === 3);
78+
```
79+
80+
1. Copy the code into your **script.js** file and change ONE of the ARITHMETIC operators in the _expression_ below so that it evaluates to `true`. Make sure you understand the ORDER that the _expressions_ evaluate in.
81+
82+
```js
83+
console.log(2 + 3 * 10 > 50);
84+
```
85+
86+
1. Add the `function` below to your **script.js** file and _invoke_ it by replacing ??? with two DIFFERENT inputs so that the _expression_ evaluates to `true`. Remember, `===` checks the value and type, but `==` only checks the value.
87+
88+
```js
89+
function equalTo(itemOne, itemTwo) {
90+
return itemOne == itemTwo;
91+
}
92+
93+
console.log(equalTo(???,???));
94+
```
95+
96+
1. Add the `function` below to your **script.js** file and write a statement that returns `true` when itemOne is MORE than itemTwo. Invoke it with two DIFFERENT arguments so that the expression evaluates to `false`.
97+
98+
Remember that you need to use `console.log` to print the
99+
output of the `function` to your console.
100+
101+
```js
102+
function moreThan(itemOne, itemTwo) {
103+
// Your Code Here
104+
}
105+
```
106+
107+
1. In the US, you can drink alcohol if you are aged 21 or older. In your **script.js** file _declare_ a `function` called _ofAge_ that takes a `number` as the input and _returns_ a `boolean` that describes whether or not that person is old enough to drink.
108+
109+
1. Amend your _ofAge_ `function` to print a `string` to the console that describes whether or not that person is old enough to drink. It should still _return_ a `boolean`.

0 commit comments

Comments
 (0)