JavaScript I – Day 7
Geekwise Academy
Instructors:
Corey Shuman
Aaron Lurz
Slack Channel:
https://geekwise-js1.slack.com
Github:
https://github.com/coreyshuman/Geekwise-JavaScript-I
Lesson plans:
http://coreyshuman.github.io/Geekwise-JavaScript-I/html/
· Review Assignment
· Review from Day 4, 5, 6
o Control Flow
§ If, If-else, switch
o Functions
o Loops
§ While, do-while, for
· Programming Challenges
How to use pseudocode to go from an idea/ task to working code.
1) Write out what functions / tasks your code should accomplish
Print a pyramid of “#” symbols
Use 2 loops
- one to print out the rows
- one to print out the characters
2) Write out the first few steps that the program will take to get a feel for the flow of the system.
print p tag
print #
close p tag
print p tag
print ##
close p tag
Result:
<p>#</p>
<p>##</p>
Hopefully you notice where the tasks are repetitive once you’ve written out a few steps. Repetitive tasks are a good candidate for using loops to code them more simply.
3) Now that we have determined the functionality of our task, write pseudocode in the same format that you would eventually write code
start loop
print p tag
start loop 2
print #
end loop 2
close p tag
end loop
Update HTML page
4) Now that we have our pseudocode, slowly convert it to actual JavaScript code
var count = 5;
var outputStr = "";
for(var j=0; j<count; j++) {
outputStr += "<p>";
for(var k=0; k<=j ; k++) {
outputStr += "#";
}
outputStr += "</p>";
}
// print to the page
document.getElementById("myPyramid").innerHTML = outputStr;