Learning Goal #5
Students will understand, practice, and apply the basic syntax for programming interactive elements with JavaScript.
PART 1: DAILY DISCUSSION
Read MoreTOPIC 1: WHAT’S THE DEAL WITH GRAMMAR POLICE?
Most of us hate grammar. And most of us hate grammar because it has to do with the rules of writing. We just want to write the way we want to write. And we don’t like for people to tell us how to write. But there is a really good reason that grammar exists. A good reason that teachers try to teach good writing.
Can you think of ONE grammar rule that EVERYONE follows?
If you have something that you want to communicate with someone, but you write in a way that makes no sense, the person you’re trying to communicate with will not understand. So to some extent, you already follow a few rules. You put spaces between your words. You put periods at the end of sentences. You capitalize the beginning of sentences. You might not do this all the time, but you do it most of the time because you realize that if you don’t, the person reading will have a harder time understanding your message.
Grammar is a set of basic rules about how to write properly so that most readers can understand what we are trying to say. And in the same way, the word syntax has to do with the basic rules of how to write a proper code, depending on the language. You could also say that syntax is the proper arrangement of letters, words, and symbols that you might see within a specific coding language. Syntax might include brackets, slashes, equal signs, quotation marks, or even colons and semicolons. But like grammar, syntax might also include the words, the letters, and the numbers in a code. See the examples below.
TOPIC 2: THE CODES AND THE CODEBREAKERS
During World War II, the Germans created a machine called the Enigma, which could send messages coded as ciphertext. These were messages hidden inside of a complicated filler text. Below was an example of an Enigma message sent by the Germans to their Naval Commanders.
After the Germans set up the Enigma and were able to successfully move their armies around Europe, other nations at war with Germany started looking for ways to fight back. So governments began to hire some of the most brilliant minds in some of the best schools. In Great Britain, for example, the government created a secret location called Bletchley Park, where they hired math experts, historians, and even a couple of chess champions to work as a team to break codes. But why would the government think that these kinds of people would be good at breaking a code?
Below is an example of the kinds of codes that the Bletchley Park codebreakers would crack.
-
Ciphertext (Original Message)
TUKAQYYOOHVKJQTDVSBKRDDAZLOYXHRDEOZSPZOTBZMSBEIYASHHJKIMCZWYIKYJ
OEWQHDZWFNOADOEIOYKAUWVFPMHSYNUGIKEVFGBBAYPCGOTYSEPLSXQHKZNB -
Plaintext (Translated from Cipher)
UMSUEDDREIYYVIEGINSCHAUERNBISFUENFWOLKIGVEREINZELTSCHAUERKKBEREICH
DORABISEINSXFUENFXABENDSKKSICHTACHTYYZEHNSMSEEZWOYBDREIDBV -
Interpretation (Spaced Out and Translated to German)
Um Süd 3 – 4 in Schauern bis 5 wolkig vereinzelt Schauer “(Bereich Dora bis 1.5. Abends)” Sicht 8-10 Seemeilen Seegang 2-3 (DBV) -
Final Translation (In English)
[Wind from] around the south [force] 3 to 4 [with] showers, up to [force] 5 cloudy [with] isolated showers. (Area D up to evening of 1st May.) Visibility 8 to 10 nautical miles, sea state 2 to 3.
TOPIC 3: TRY IT YOURSELF
Now that you know about the Bletchley Park codebreakers, let’s try a simple activity to see if you can break a similar ciphercode. Without getting any help from a neighbor or a team, see if you can crack the code. And write down the answer on a secret index card.
-
Ciphertext (Original Message)
VNOVEDOCVDNAVMLACVPEEKV -
Plaintext (Translated from Cipher)
________________________________________________ -
Final Translation (In English)
________________________________________________
TOPIC 4: SYNTAX = GRAMMAR
In the end, syntax is only a fancy word for grammar. Most of the time, normal people just call grammar grammar. But since it would be a little strange to talk about grammar in a code, programmers and coders have adopted the word “syntax” as a way of describing the rules for each programming language. Syntax is the set of rules, like grammar, that help JavaScript (and other programming languages) run properly. Here are some examples of good and bad syntax in HTML, CSS, and JavaScript.
TOPIC 5: BASIC JAVASCRIPT VOCABULARY
In just a couple of weeks, you will be asked to take a Quarter Quiz and this is where you will need to know a few basic ideas about JavaScript. For example, you will need to know that JavaScript depends on a skeleton/format language called HTML and a skin/style language called CSS. You will need to know that JavaScript controls the behavior of a web page. And you will need to know that “syntax” is a way of describing the proper way to write a programming language. All of those things are important and you will need to know them for the quiz, but you will also need to know some of this Basic JavaScript Vocabulary.
TOPIC 6: EIGHT FOR EIGHT
During today’s design, you will be learning EIGHT of the basic JavaScript vocabulary words through practice. But before we get to the design, let’s look at these EIGHT words a little more carefully:
Variables, Operators, Values, Semicolons, Assignments, & Statements
PART 2: DAILY DESIGN
Read MoreSTEP 1: CREATING A NEW FILE
Open a new Notepad document and save it as “lesson4_syntax.html” in your “LG5_basicjs” subfolder. You must not forget the “.html” at the end of the file name that you’re saving.
STEP 2: COPY/PASTE THE CODE
There are no more hidden codes. Simply copy/paste this code into your Notepad, save (CTRL-S), and open it with Google Chrome.
STEP 3: CREATING A SPLIT SCREEN
When you reach this point, you have everything necessary to get started. So drag your code to the left side of your monitor and create a split screen so that you can see the design on the right. The teacher will know you are done when your screen shows the code on one side and the design on the other. Once the teacher sees that you and your partner are all set up, you will probably be asked to stand up and help someone else out.
SYNTAX until EVERY student has completed Steps 1-4.