{"id":2100,"date":"2020-04-03T17:05:11","date_gmt":"2020-04-03T17:05:11","guid":{"rendered":"http:\/\/newmediaproduction.mynmi.net\/?page_id=2100"},"modified":"2023-07-26T01:31:36","modified_gmt":"2023-07-26T01:31:36","slug":"javascript-1-fcc-17","status":"publish","type":"page","link":"https:\/\/nmi.cool\/web\/javascript-1-fcc-17\/","title":{"rendered":"JavaScript 1 \u2013 FCC 16"},"content":{"rendered":"\n
\"\"\/
Presenting:<\/strong> Alice’s Adventures in JavaScript <\/strong>
(Illustration from Alice’s Adventures in Wonderland by Lewis Carroll, of course!)<\/figcaption><\/figure>\n\n\n\n

Overview<\/h2>\n\n\n\n

Welcome to your first Free Code Camp lessons in JavaScript! These lessons will introduce you to a few of JavaScript’s basic programming concepts, such as variables<\/strong>, arithmetic operations<\/strong>, strings<\/strong> and zero-based indexing<\/strong>. Due to the complex nature of JavaScript 1<\/a> it’s important to establish a solid foundation before diving into the deep end. These introductory lessons may seem abstract, but they’ll play an important role in later lessons. <\/p>\n\n\n\n

FCC + this Workbook<\/h4>\n\n\n\n

While you’re working through the Javascript portion of Free Code Camp, these next few sections in the Workbook will correspond<\/strong> to your FCC exercises. The Workbook readings will highlight key points, offer more context, and expand on the FCC examples. You may want to open these readings in a separate window alongside FCC\u2014or perhaps you want to read them through before and after you complete the Free Code Camp sections. <\/p>\n\n\n\n

FCC Help Reminder<\/h4>\n\n\n\n

When going through the remainder of the FCC lessons, don’t get spooked. It’s easy to overthink <\/strong>what FreeCodeCamp is asking. Take advantage of FCC’s hints and videos. And, feel free to work with a friend (while keeping a safe, social distance, of course).<\/p>\n\n\n\n

You may also find it beneficial to peruse Free Code Camp’s JavaScript Beginner’s Handbook<\/a> as well. <\/p>\n\n\n\n

Once you’re ready to get started on FCC, start reading \u2b07\ufe0f<\/p>\n\n\n\n

Comments<\/h3>\n\n\n\n

By now, you’re pretty familiar with the habit of writing comments in your CSS<\/a> and HTML<\/a> files. Writing comments in JavaScript is no different. These are comments that JavaScript will ignore, but are helpful to keep yourself, your future self, and someday perhaps, your coworkers, organized and up-to-date. <\/p>\n\n\n\n

There’s two ways to write comments in JavaScript:<\/p>\n\n\n\n

\/\/ This is an in-line comment.<\/code><\/pre>\n\n\n\n
\/* This is a\nmulti-line comment *\/<\/code><\/pre>\n\n\n\n
Variables<\/h3>\n\n\n\n
Just like in your math classes, variables<\/strong> in JavaScript are used to store values. Unlike your math classes, though, variables in JavaScript are variable<\/em>, that is, they are subject to change. In other words, variables are used to store different values at different times. <\/p>\n\n\n\n
Computers require very detailed, very specific instructions to carry out commands. Essentially, variables are telling the computer, remember<\/em> this piece of information at this moment in time. Store this specific knowledge away for now. <\/p>\n\n\n\n
To declare a variable<\/strong>, write var<\/code> followed by the variable name, and end your statement with a semicolon: <\/p>\n\n\n\n
var madHatter;<\/code><\/p>\n\n\n\n
Variables cannot use spaces or start with a number, and of course, casing matters 2<\/a>. It’s best practice to use camelCase<\/strong>, where multi-word variable names have the first word in lowercase and the first letter of each subsequent word is capitalized, such as myMadQueen<\/code>, yourDoorMouse<\/code>.<\/p>\n\n\n\n
To assign a value<\/strong> to a variable, use the assignment operator<\/strong> =<\/code>.<\/p>\n\n\n\n
madHatter = 3<\/code><\/p>\n\n\n\n
A word of caution with the assignment operator: Everything to the right of the equals sign = is evaluated first. More on that later! <\/p>\n\n\n\n
Typically, you declare a variable and assign it a value at the same time, called initializing <\/strong>a variable: <\/p>\n\n\n\n
var cheshireCatShoppingCart = 1;<\/code><\/p>\n\n\n\n
In this case, we are establishing a variable and giving it a value, all at once.<\/p>\n\n\n\n
Basic math operations<\/h3>\n\n\n\n
Performing math operations is a keystone of programming languages including JavaScript. When we rely on a tool like JavaScript to perform arithmetic operations, we’re able to process numerical data quicker, more accurately, and at much longer volumes. <\/p>\n\n\n\n
So much of the web involves processing numerical data. Think of prices, quantities, totals, shipping, in stock, out of stock, sales, taxes\u2014and all the calculations needed to give users accurate information on all the various combinations of all of those elements!<\/p>\n\n\n\n
Numbers in Javascript represent\u2014you guessed it!\u2014numeric data. Here’s some of the basic arithmetic operations you can do with JavaScript: <\/p>\n\n\n\n