Tuesday, January 31, 2017

A Beginner’s Guide to JavaScript Variables and Datatypes

A set of dominoes with symbols representing JavaScript variables and datatypes

So you've decided to learn JavaScript, the programming language of the web. If it seems like a daunting journey ahead and you don't know where to start, here's a little secret: it doesn't take any special skill to learn how to program, and everyone starts at zero. Take it one step at a time, and you'll get there.

Is This Guide For Me?

If any of these apply to you, you'll benefit from reading this guide:

  • You've never used a programming language before.
  • You've never used JavaScript before.
  • You've tried learning JavaScript before but found the resources lacking or hard to follow.
  • You know a bit of JavaScript, but want to brush up on the basics.

In this article, we're going to focus on the fundamentals: syntax, variables, comments, and datatypes. The beauty is that you can apply the concepts you learn about JavaScript here to learning another programming language in the future.

Disclaimer: This guide is intended for complete beginners to JavaScript and programming. As such, many concepts will be presented in a simplified manner, and strict ES5 syntax will be used.

Ready? Let's get started!

What is JavaScript?

JavaScript is the programming language used to make websites dynamic and interactive. It's a client-side programming language, which means the code gets executed in the user's web browser. With the advent of Node.js and other technologies, it can also be used as a server-side language, making it extremely versatile. JavaScript is used primarily for front-end web development and works closely with HTML and CSS.

Note: Java is not JavaScript. It's a different language with a confusingly similar name.

Requirements

You already have the prerequisites to start writing and using JavaScript. All you need is a web browser to view the code, and a text editor to write it. The browser you're currently using is perfect (Chrome, Firefox, Safari, Edge, etc). Your computer comes preinstalled with Notepad (Windows) or TextEdit (Mac), but I would recommend installing Atom or Brackets, which are free programs specifically designed for coding.

CodePen is a website that allows you to write code and make live demos, and it will be the easiest way to start following along and practicing.

Basic Terminology

A programmer writes programs, just as an author writes a book.

A program is just a set of instructions that a computer can read and use to perform a task. Each individual instruction is a line of code known as a statement, which is similar to a sentence in a book. While a sentence in English ends with a period, a JavaScript statement usually ends with a semicolon. Syntax refers to the symbols and rules that define the structure of the language, similar to grammar and punctuation, and the semicolon that ends a JavaScript statement is part of the syntax.

Comments

A comment is a human-readable note written in the code.

Comments are written in plain English with the purpose of explaining the code. Although comments don't technically perform any function in the program, it's crucial to get into the habit of proper documentation to help you or future collaborators understand the intent of your code.

There are two types of comment in JavaScript:

  • A single line comment, written as two forward slashes // followed by the comment.
// This is a single line comment.

  • A multi-line comment, which is sandwiched between /* and */ and can span many lines.
/* This is a comment.
It's a multi-line comment.
Also a haiku. */

Variables

A variable is a container that stores data values.

You know a variable as something that can change. In basic algebra, it's a letter that represents a number. x is a common variable name, but it can just as easily be represented by y, z, or another name.

Initially x has no value or meaning, but you can apply a value to it.

x = 5

Now, x represents 5. You can think of x as a container that's storing 5, which is a number.

In JavaScript, variables work the same, except they can contain more than just numbers as a value - they can contain all sorts of data values, which we'll learn by the end of this article.

Variables are created and declared using the var keyword. We can use our algebra example above to create a JavaScript statement.

var x = 5; // the variable x contains the numeric value of 5.

Building on what we've learned so far, you can see that we have a JavaScript statement that declares a variable (x), assigns the number data type (5) with a single equals sign (=), and explains it in plain English with a comment (//). The statement ends with a semi-colon (;).

Variables only need to be declared with var the first time they're used, and as the name suggests, a variable can change.

Continue reading %A Beginner’s Guide to JavaScript Variables and Datatypes%


by Tania Rascia via SitePoint

No comments:

Post a Comment