-
Notifications
You must be signed in to change notification settings - Fork 3
Expand file tree
/
Copy pathfunStru.js
More file actions
428 lines (271 loc) · 13.9 KB
/
funStru.js
File metadata and controls
428 lines (271 loc) · 13.9 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
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
"use strict";
// OBJECTIVE ////////////////////////////////////////////////////////////////////////////////////////////////
// 1. Outline of interesting scripting structures and problem solving methodologies from research, discussions, etc.
// SUMMARY //////////////////////////////////////////////////////////////////////////////////////////////////
// What is the problem?:
// 1. There are many ways to solve a problem in JavaScript, but very few resources that give basic strucutural examples for beginners.
// What is the BEST solution?
// 1. On strucutre, the best solution seems to be that which reduces functions to a single responsibility to make your code more versatile.
// 2. On problem solving techniques, looking into it.
// What are the special components of these solutions?:
// 1. Ways to define a structure (i.e. declaration, expression, and es6 fat arrow function)
// What needs work?
// 1. FAQ section (questions and answers I think of or come across whihc I'll just add to the list and organize later)
// 2. More interesting ways to think about scripting structure
//////////////////////////////////////////////////////////////////////////////////////////////////////////////
// HOW TO THINK ABOUT JAVASCRIPT?:
// 1. A function is a repeatable (i.e. can be called multiple times) and determinate (i.e. predictable) process or behavior.
// 2. Javascript is a functional language meaning that functions are the primary modular units of execution. so functions are
// obviously very important in Javascript.
// 3. Functions in JavaScript are what we call first-class entities.
// 4. We treat functions as values.
//
// WHAT ARE THE BASICS OF A FUNCTION?:
// In the example function below we are creating a function that simply adds two numbers together.
// Inside the call signature, we have two parameters, num1 and num2. These are the two numbers that we add together.
// Inside the block of the function, we have a simple goal... to return the value of num1 plus num2.
function addExample(num1, num2) {
return num1 + num2;
}
console.log(addExample(1,1));
// 1. "function" referes to the JavaScript keyword about to be described.
// 2. "add" is the name of the function we can invoke elsewhere in the code.
// 3. "(num1, num2)" is comprised of a call signature (i.e. () ) and two parameters (i.e. num1, num2).
// 4. "{ ... }" brackets are the main block of the function to be executed.
// 5. "console.log(add(2,3))" is the line that invokes the function, the numbers in the callsignature inserted into num1 and num2.
// good resources: https://blogg.bekk.no/function-creation-in-detail-9d5e754afce4
// IMPORTANT INFO ON FUNCTION NAMES:
// 1. ALWAYS use camelcasing which is where we capitalize the second word in each function name (i.e. thisNameIsGood).
// 2. DONT use reserved word slike let, const, or return.
// 3. ONLY use uppercase, lowercase, or underscore at the beginning of a function name. $() is also acceptable.
// 4. ALWAYS use meaningful names that describe what the function does.
// IMPORTANT INFO ON CALL SIGNATURES AND PARAMETERS/ARGUMENTS:
// 1. When talking about functions, the terms parameters and arguments are often interchangeably used as if it were one and the
// same thing but there is a very subtle difference.
// A. Parameters are variables listed as a part of the function definition.
// B. Arguments are values passed to the function when it is invoked.
// Its important to know the difference because JavaScript does not throw an error if the number of arguments passed during a function
// invocation are different than the number of parameters listed during function definition. This should make it clear that parameters
// and arguments should be treated as two different entities.
// good resource: https://codeburst.io/parameters-arguments-in-javascript-eb1d8bd0ef04
// https://blogg.bekk.no/function-parameters-in-detail-b0f0d971bec3
///// HOW CAN YOU DEFINE A FUNCTION?:
// Function Declaration: 1. Hoisted with contents (hoisting is how the browser parses Javascript, reads through once then executes second pass).
// 2. Function declarations are hoisted to the top of the top-level or if you have a function declaration inside
// a function, to the top of that function.
// 3. With function declarations, you can use them above where they are declared.
function addDeclaration(num1, num2) {
return num1 + num2;
}
console.log(addDeclaration(2,2)) // 4
// Function Expression: 1. Not hoisted with contents, but the reference to it may be hoisted if we assign it as a variable.
// 2. Functions defined as arguments to functions are expressions.
// 3. IMPORTANT: Because of an issue with hoisting, if you invoke a function expression before the function iteslef, you
// get an error.
let addExpression = function(num1, num2) {
return num1 + num2;
}
console.log(addExpression(3,3)); // 6
// ES6 Fat Arrow Function:
const addFatArrow = (num1, num2) => num1 + num2;
console.log(addFatArrow(4,4)) // 8
///// HOW CAN YOU STRUCTURE A FUNCTION?: ////////////////////////////////////////////////
// CHAIN OF VARIABLES EXAMPLE:
// first pay attention to the arguments in the call signtature. These are "slots". In this case, number = 6, numberToAdd = 4, and numberToSubtract = 2.
//also, pay attention to how the variables are chained together and work off the previous one.
function addSubtract(number, numberToAdd, numberToSubtract) {
let start = number;
console.log(`First, we start with the number ${start}, which is the first slot of the call signature`);
let add = start + numberToAdd;
console.log(`Second, when we add ${start} to ${numberToAdd} (the second slot in the call signature), which gives us ${add}`);
let subtract = add - numberToSubtract;
console.log(`Last, when we subtract ${numberToSubtract} (the third slot in the call signature) from ${add}, where we get ${subtract}`);
}
console.log(addSubtract(6,4,2)) // first, we start with the number 6
// second, when we add 6 to 4 we get 10
// and last, when we subtract 2 from 10, we get 8
// undefined
// CHAIN OF VARIABLES v2 EXAMPLE:
// the start being the initial number (i.e. the first "slot" in the call signature.
// the second variable "mulitply" takes the initial number and multiplies that by the second "slot" in the call signature.
// the third variable takes the second variable (i.e. multiply) and divides it by the third "slot" in the call signature.
// last, we return divide.
function multiplyDivide(number, numberToMultiply, numberToDivide) {
const start = number;
const multiply = start * numberToMultiply;
const divide = multiply / numberToDivide;
return divide;
}
console.log(multiplyDivide(2,5,2)); // 5
// CHAIN OF VARIABLES W/ ANOTHER FUNCTION:
// The FIRST variable (i.e. started) uses the first "slot" (i.e. number) which we assign the value of 1.
// The SECOND variable (i.e. multiplied) passes the value of the variable "started" and multiplies it by the second slot (i.e. numberToMultiply) with the value 5.
// The THIRD variable (i.e. divided) takes multiplied and divides by the third slot (i.e. numberToDivide).
// The FOURTH variable uses an outside function to perform the last task which is to subtract 1 from the result of divide.
// -- To outside function is passed the result of divided as a parameter, which we can use to subtract from 1.
// Lastly, when we return subtracted at the end of the function we draw on the subtract function
function subtract(divide) {
return divide - 1;
}
function multiplyDivide2(number, numberToMultiply, numberToDivide) {
const started = number;
const multiplied = started * numberToMultiply;
const divided = multiplied / numberToDivide;
const subtracted = subtract(divided)
return subtracted;
}
console.log(multiplyDivide2(2,5,2));
//
// Objective: Take a string, replace a word in that string, reverse that string using seperated functions
function flip(string) {
return string.split('').reverse().join('');
}
function print(string) {
console.log(string);
}
function replace(string) {
return string.replace("this","that");
}
function replaceFlipPrint(string) {
print(flip(replace(string)));
}
console.log("// RFP RESULT:")
replaceFlipPrint("this is a tester string for replaceFlipPrint");
/// EXAMPLE 2 /////////////////////////
function replaceIt(string) {
return string.replace("this", "that");
}
function capitalizeIt(string) {
return string.toUpperCase();
}
function printIt(string) {
return console.log(string)
}
function repAndCap(string) {
printIt(capitalizeIt(replaceIt(string)));
}
console.log(repAndCap("this is a test"))
/// EXAMPLE 3 ///////////////////////////
// note: replaced is not used in the example
function flip(string) {
return string.split('').reverse().join('');
}
function print(string) {
console.log(string);
}
function replace(string) {
return string.replace("this","that");
}
function variablesReplaceFlipPrint(string) {
// let replaced = replace(string); // replaced is not used in this example
let flipped = flip(string);
print(flipped);
}
console.log("// VRP RESULT:")
variablesReplaceFlipPrint("this is a tester string for variablesReplaceFlipString");
///// EXAMPLE 4 //////////////////////////////
function print(string) {
console.log(string)
}
function capitalize(string) {
return string.toUpperCase();
}
function replaceIt(string) {
return string.replace('this', 'that');
}
function reverse(string) {
return string.split('').reverse().join('');
}
function replaceAndCapIt(string) {
return capitalize(replaceIt(string))
}
function reverseAndPrint(string) {
print(reverse(string));
}
console.log("// step 1: test replace a word")
console.log(replaceIt("this is a test of replace"))
console.log("// step 2: test capitalize a string");
console.log(capitalize("this is a test of capitalization"));
console.log("// step 3: test of reverse a string");
console.log(reverse("this is a test of reverse"));
console.log("// step 4: test replace and Capitalization");
console.log(replaceAndCapIt("this is a test of replace and cap"));
console.log("// step 5 test reverse and print");
console.log(reverseAndPrint("This is a test of reverse and print"));
///// EXAMPLE 5 //////////////////////////////////
function theGrade(num) {
let input = num;
let storedGrade = "F";
if (input >= 90) {
storedGrade = "A"
} else {
storedGrade = "Below A"
}
console.log(`you scored ${input} which ranks ${storedGrade}`);
return storedGrade;
}
function gradeQuote(num) {
if (num === "A") {
console.log("You got an A (score greate than 90)!")
} else {
console.log("you got below an A, which is still great!")
}
}
gradeQuote(theGrade(90))
gradeQuote(theGrade(85))
// Important to keep in mind is the nesting of the functions being called. In the example above,
// we have two functions, one that determines what the numerical grade would be when coverted to
// numerical and the second gives a congratulatory sentence either if they had an A or other.
///// EXAMPLE 6 (swtich) //////////////////////////////
function doesItInclude(str) {
let ingredient = str.toLowerCase();
let replacement = "love and care"
switch (ingredient) {
case "chocolate":
console.log(`warning: this recipe contains chocolate, please replace with ${replacement}`);
break;
case "vanilla":
console.log(`warning: this recipe contains vanilla, please replace with ${replacement}`);
break;
default:
console.log(`good news: this recipes is safe to eat`)
}
return `this is amazing`;
}
console.log(doesItInclude("CHOColate"));
console.log(doesItInclude("watermelon"));
////// EXAMPLE 6.1 (same as above but with if/else) //////////////////
function doesItInclude2(str) {
let ingredient = str.toLowerCase();
if (ingredient === "strawberries") {
console.log(`warning: this recipe contains chocolate`);
} else if (ingredient === "blueberries") {
console.log(`warning: this recipe contains blueberries`);
} else {
console.log(`great news: this recipes is delicious!`);
}
}
console.log(doesItInclude2("blueberries"));
// Objective: Take a string, replace a word in that string, reverse that string using a single condensed function.
function replaceFlipPrint(string) {
let replace = string.replace("this","that");
let flip = replace.split('').reverse().join('');
console.log(flip);
}
console.log(replaceFlipPrint("this is a tester"));
// Objective: Take a string, replace a word in that string, reverse that string using a single SIMPLIFIED condensed function.
function replaceFlipPrint2(string) {
console.log(string.replace("this","that").split('').reverse().join(''));
}
console.log(replaceFlipPrint2("This is a tester 2"))
// scratch
// useful problem solving strategies
// 1. Always have a plan
// 2. Restate the problem
// 3. Divide the Problem
// 5. Start with what you know
// 6. Reduce the Problem
// 7. Look for Analogies
// 8. Experiment
// 9. Dont get frustrated
// 10.