Programming Concepts 2
📚 Watch and Read
Variables
Watch Code.org's programming variables part 1 and programming variables part 2 to recap the concepts of initializing (sometimes referred to as creating, allocating, or declaring) and data types.
Numeric variables shows why there are multiple types of numeric variables.
Strings
are another common data type, almost always represented by using quotes, either 'single' or "double", depending on the programming language. An important point is that in most languages
x = 2
means x is an integer while
y = "2"
means y is a string
2 and "2" might look the same to humans, but to computers they are different.
Boolean variables are incredibly important to programming, allowing us to set things as true or false. Code.org offers a video introduction to boolean expressions.
Later, we'll explore constructs like if statments
and loops
that use Boolean variables to determine which statement a program should execute next.
Number Systems
Binary or base 2, a computer's central processing unit (CPU) only understands 1 and 0, called binary. This is because at the lowest level, the CPU of a computer is working with electricity which is either on or off. This is also one reason why you commonly see electrical and computer engineering together at universities.
Converting decimal (base 10) to binary is a common part of most computer science programs. You aren't required to be an expert at number system conversions for this course, but you will see them throughout your programming journey.
Decimal to binary part 1 and decimal to binary part 2 videos are helpful resources for practicing conversions.
Hexadecimal number system
Hexadecimal is another commonly used number system in computing because it converts to binary very well.
Converting decimal to hexadecimal shows how to convert numbers between the two systems and this series from BBC shows some of the ways hexadecimal is used in modern computing.
Arrays and other Data Structures
Variables are incredibly useful, but if the only types of variables programmers had at their disposal were numbers, strings, and booleans, we would be limited in what we could accomplish.
If you worked on the Kindle development team at Amazon, you'd have to figure out how to store a book in your code and display it to a reader. You could store every page as a string
variable, but that would be very tedious and you would have to know how many pages are in every book so each page could have its variable created -- yuck.
var page1 = 'In the beginning, there was a lot of words on page 1.'
var page2 = 'Then on page 2, some more stuff happened.'
var page3 = 'Finally, things concluded on page 3'
console.log(page1)
console.log(page2)
console.log(page3)
You may be able to see how a 300 page book would be painful with this model. Thankfully, we have more advanced types of variable at our disposal.
There are many data structures, for this class we're going to focus on Arrays, also known as Lists. Code.org has a great series of videos introducing arrays
- Introduction to Lists
- Accessing elements in a list
- Updating and adding elements in a list
- Getting the length of a list
How would you change in the Kindle example above using arrays?
One way is outline below. NOTE: the specific syntax will be different depending on the language.
Create an array and assign it to the variable book
var book = []
Add each page as a string
of words to the array.
book.push('In the beginning, there was a lot of words on page 1.')
book.push('Then on page 2, some more stuff happened.')
book.push('Finally, things concluded on page 3')
That doesn't look too different from the example above. If we had a 300 page book, we would still need 300 .push
statements to add them all to the book
array. The powerful change comes when you try to print.
for (page in book){
console.log(page)
}
We'll talk about loops in another module. Read the code above as "for each page in the array named book, print that page". This is an amazing savings, because it works for a 1, 100, or 1,000,000 page book. The for
loop processes the array the same, without you having to know how many pages.
Complete lessons 21-45 in freeCodeCamp JavaScript course. Links to individual lessons and their corresponding youtube video are below.
- Declare String Variables 💻 code📺 watch
- Escaping Literal Quotes in Strings 💻 code📺 watch
- Quoting Strings with Single Quotes 💻 code📺 watch
- Escape Sequences in Strings 💻 code📺 watch
- Concatenating Strings with Plus Operator 💻 code📺 watch
- Concatenating Strings with the Plus Equals Operator 💻 code📺 watch
- Constructing Strings with Variables 💻 code📺 watch
- Appending Variables to Strings 💻 code📺 watch
- Find the Length of a String 💻 code📺 watch
- Use Bracket Notation to Find the First Character in a String 💻 code📺 watch
- Understand String Immutability 💻 code📺 watch
- Use Bracket Notation to Find the Nth Character in a String 💻 code📺 watch
- Use Bracket Notation to Find the Last Character in a String 💻 code📺 watch
- Use Bracket Notation to Find the Nth-to-Last Character in a String 💻 code📺 watch
- Word Blanks 💻 code📺 watch
- Store Multiple Values in one Variable using JavaScript Arrays 💻 code📺 watch
- Nest one Array within Another Array 💻 code📺 watch
- Access Array Data with Indexes 💻 code📺 watch
- Modify Array Data With Indexes 💻 code📺 watch
- Access Multi-Dimensional Arrays With Indexes 💻 code📺 watch
- Manipulate Arrays With push() 💻 code📺 watch
- Manipulate Arrays With pop() 💻 code📺 watch
- Manipulate Arrays With shift() 💻 code📺 watch
- Manipulate Arrays With unshift() 💻 code📺 watch
- Shopping List 💻 code📺 watch
💬 05 Chat
Due: 03/25/19 9 AM
Instructions
The purpose of this chat is to continue developing your self-reflection skills.
After going through the content above, write out at least two questions you have related to any of the concepts presented.
Use this opportunity to ask questions about concepts you don't fully understand. If you are confident in your understand of all the concepts, develop questions around how a concept might be applied or why it might be useful to you in your career.
Join the the #sp19-05-chat Slack channel and ask your questions.
Grading Rubric
% | Explanation |
---|---|
100% | Two questions asked in #sp19-05-chat related to this module's content. |
+10% | Bonus points for asking more than 2 questions. |
+10% | Bonus points for helping other students find answers to their questions. |
📝 05 Journal
Due: 03/25/19 9 AM
Instructions
- Visit your freecodecamp settings by clicking your profile image in the upper right
- Click the "Show me my public portfolio" button at the top center of the page.
- Copy the URL of your profile.
- Paste the URL of your freecodecamp profile in a Slack
Direct Message
to Michael Greene (profmikegreene) - Aldo
Direct Message
(DM) Michael Greene (profmikegreene) with two lists.- One for the things you understand most confidently.
- One for the things you are struggling with.
The items in these lists can be vocabulary, assignment tasks, concepts, whatever sticks out in your mind. Try to find at least two items per list and feel free to make them as long as you like.
Grading Rubric
% | Explanation |
---|---|
40% | Having the first Javascript lessons 21-45 complete in your freecodecamp profile |
30% | Direct message to profmikegreene containing a list of things you are confident you understand |
30% | Direct message to profmikegreene containing a list of things you are struggling with |
⚛️ 05 Project
Due: 03/25/19 9 AM
The purpose of this project is to prove your understanding of the concepts in this lesson.
Instructions
Setup
- Click
Channels
in the Slack sidebar to view all channels - Join the #sp19-05-project slack channel
- In that Slack channel, you will see a link that will take you to Github Classroom
- Click the
Accept this assignment
button and Github will create a version of the project for you. - Once this step is complete, the page should say "Your assignment has been created here: https://github.com/RCC-ITP-175/sp19-05-". Click this link and visit your repository.
- Create a new Glitch project using the
hello-webpage
option
Javascript
Open the script.js file created in your Glitch project. It will contain some comments and a console.log statement
At the end of the file, you'll write some new Javascript
Create a new variable named
name
and set if equal to your first nameUse concatenation to add your last name to the
name
variableCreate a new variable named
nameLength
and set it equal to the length of thename
variableCreate an array named
shinigami
with the following elementsIchigo
Gin
Shunsui
Add the following element to the array
Kyoraku
Create a new variable named
substitute
and use bracket notation to set it equal to theIchigo
element of theshinigami
arrayRemove the
Ichigo
element of theshinigami
array
Submission
Open the Glitch Tools menu in the bottom left, and select
Git, Import, and Export
Click
Export to Github
and type in your github username/sp19-04-usernameFor example, I would type
profmikegreene/sp19-05-profmikegreene
Click OK and your project should be exported to Github
Visit your repo on [github.com][] and click the branches dropdown and you should see a Glitch branch containing your code
All done!
Grading Rubric
pts | Explanation |
---|---|
5 | Create a github repo for this project |
5 | name contains your first name |
5 | concatenation adds your last name to name |
5 | nameLength equal to the length name |
10 | shinigami array contains 3 strings |
10 | another string added to shinigami |
10 | Ichigo element removed from shinigami |