-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathcheat-sheet.html
More file actions
134 lines (110 loc) · 4.4 KB
/
cheat-sheet.html
File metadata and controls
134 lines (110 loc) · 4.4 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
<html>
<head>
<meta charset="UTF-8">
<link rel="stylesheet" type="text/css" href="styles/cheat-sheet.css">
<title>Tim and Marshall's Flash Cards</title>
<link rel="shortcut icon" href=""/>
</head>
<body>
<div id = "content">
<header id = "header">
<h1>Tim and Marshall's Cheat Sheet</h1>
<h2>JavaScript vs Ruby: Array Looping</h2>
</header>
<div class = "mainbox">
<h3>For Loops</h3>
<p class = "text">
Printing each element in an array is a little more straight forward in Ruby. Worth noting is that
with Ruby, the iterator ('i') becomes the <span class = "italics">value</span> of the array, whereas in JavaScript the iterator is just the index. Consequentially, JS requires a few more steps to finally print the value:
</p>
<p class = "title">Ruby</p>
<div class = "code">
<p>array = [1,2,3,4,5] </p>
<p>for i in array</p>
<p> puts i </p>
<p>end </p>
<p class = "title">=>1,2,3,4,5</p>
</div>
<p class = "title">JavaScript</p>
<div class = "code">
<p>var array = [1,2,3,4,5]</p>
<p>for (var i in array) {</p>
<p>console.log(array[i]);</p>
<p>}</p>
<p class = "title">=>1,2,3,4,5</p>
</div>
<p class = "text">
JavaScript has an answer to Ruby's each() by giving us forEach(). It's slightly verbose and requires defining an anonymous function as an argument, but it works! We didn't do this, but you could define the function outside of the statement and simply pass it to forEach():
</p>
<p class = "title">Ruby</p>
<div class = "code">
<p> (0..9).each { |n| puts n }</p>
<p class = "title">=>0,1,2,3,4,5,6,7,8,9</p>
</div>
<p class = "title" >JavaScript</p>
<div class = "code">
<p>arr = [0,1,2,3,4,5,6,7,8,9]</p>
<p>arr.forEach(function (number) {</p>
<p>console.log(number);</p>
<p>});</p>
<p class = "title">=>0,1,2,3,4,5,6,7,8,9</p>
</div>
</div> <!-- closing Mainbox div -->
<div class = "mainbox">
<h3>While Loops</h3>
<p class = "text">
Both Ruby and JS offer while loops. They're almost idential in syntax. Remember while loops are great when you don't know how many times you'll need to run the loop. In these examples we simply set the value of 'i' to true after one pass. However in a normal scenario, the function could be a coin-flipper where a random number is generated between 1-100 on each loop (each flip_. If the number is greater than 50, 'i' becomes true. Until then, the loop would continue running:
</p>
<p class = "title">Ruby</p>
<div class = "code">
<p>i = false</p>
<p>while i == false</p>
<p>puts "i is still false"</p>
<p>i = true</p>
<p>if i = true</p>
<p>puts "i is true"</p>
<p>end</p>
<p>end</p>
<p class = "title">=>i is still false</p>
<p class = "title">=>i is true</p>
</div>
<p class = "title">JavaScript</p>
<div class = "code">
<p>i = false</p>
<p>while (i==false) {</p>
<p>console.log("i is still false");</p>
<p>i = true</p>
<p>if(i == true){</p>
<p>}</p>
<p>}</p>
<p class = "title">=>i is still false</p>
<p class = "title">=>i is true</p>
</div>
<p class = "text">
Finally, both offer a way to run a code block at least once. Both have slightly different names, but if I were to call them something, it would be "while-do-at-least-once":
</p>
<p class = "title">Ruby</p>
<div class = "code">
<p>i = 40</p>
<p>while true</p>
<p>puts i</p>
<p>i += 1</p>
<p>break if i > 20</p>
<p>end</p>
<p class = "title">=>40</p>
</div>
<p class = "title">JavaScript</p>
<div class = "code">
<p>var i = 40</p>
<p>do {</p>
<p>console.log(i);</p>
<p>i++;</p>
<p>}</p>
<p>while (i<=20);</p>
<p class = "title">=>40</p>
</div>
</div> <!-- closing Mainbox div -->
</div> <!-- closing Content div -->
</body>
<footer></footer>
</html>