Heads up! To view this whole video, sign in with your Courses account or enroll in your free 7-day trial. Sign In Enroll

Preview

Start a free Courses trial
to watch this video

Sign up for Treehouse

The Language of Programming

5:11 with Andrew Chalkley, Dave McFarland, and Joel Kraft

Learn basic concepts shared by all programming languages — values, variables, functions and control structures. Learn how changing values can change how a program works by experimenting with a JavaScript game.

Downloading and Running the Project Files

Because of how the Phaser.JS library handles files, you need to be running a web server locally to view a working copy of this project. You can't just open the index.html file in your web browser as you might a basic HTML page. There are several simple ways to get a web server up and running on your computer:

Concepts

  • Syntax — a programming languages vocabulary and grammar. Every programming language has its own syntax. For example, JavaScript has special keywords like var, if, and function that all do different things to in a program.
  • Values — the data in your program. For example, a number like 375 is a numeric value; a logical value like true, or false is called a boolean value; and a collection of letters inside of quote marks are called a string: 'Hello there!'.
  • Variables — variables hold values. They are like boxes you store information in like the current score in a game, or the name of the player. For example, to create a variable and store a number 0 in it, you could write this JavaScript code: var currentScore = 0
  • Control structures — control the flow of the program: what happens and when it happens. For example, if you're playing a game and your character dies, the game ends. The flow of the program is controlled by actions that happen in the program.
  • Commands (functions) — the commands we ask a program to complete, like adding two numbers together or validating a person's email address.

Launch the work space on this page and then let's talk about programming. 0:00 But before we get started, take a look at all the words and 0:05 symbols in front of you, this is our program. 0:07 Now, if you're beginning to panic because it all looks like a foreign language and 0:11 you're feeling like maybe this is too difficult for you. 0:15 Don't worry, as I mentioned in the last video, 0:18 you don't need to understand everything you see here to have fun in this course. 0:21 In fact, when we're done you still won't understand everything here. 0:25 This course is intended to just give you a taste of programming. 0:29 All you need to do is follow along, experiment a little, and have fun. 0:32 You can preview the webpage, 0:37 this index.html file, by clicking the preview button. 0:38 Here's the current state of our game, the score is zero, 0:45 there's one coin, one platform, and one player. 0:48 The game.js file contains the programming that makes our current game work 0:50 It’s written in JavaScript, but 0:54 there are literally hundreds of different programming languages. 0:56 All programing languages, 1:00 however, share some basic features which I'll introduce to you in this course. 1:01 Syntax is the vocabulary, punctuation and grammar of a programming language. 1:06 The syntax includes key words which are the languages vocabulary. 1:11 For example, here var, function, 1:15 And if are keywords in the JavaScript language. 1:24 They all have special meanings, and we'll look at each of these in this course. 1:27 Values, values are the data in your program. 1:33 They could be numbers, like 375 Or 300 here. 1:36 Or they could be letters inside of quote marks, like 'coin'. 1:41 This is called a string value, because it's a set of letters strung together. 1:46 There are many different types of values. 1:50 Variables, variables hold values, they're like boxes that you put a value into. 1:53 You can look inside the box to see the value it contains, and 1:58 even replace the current value with a new value. 2:01 For example, in the last video, 2:04 you saw that when a player collected a coin, the score changed. 2:06 The current score is a variable or box in our game. 2:10 A program uses these boxes to pass information around and 2:15 control what the program does and how it works. 2:19 The var keyword you see here, in fact, is a JavaScript keyword, 2:22 part of the syntax that creates a variable named current score. 2:26 The equal sign, puts a value into a variable. 2:31 So this code stores the value zero into the variable named, current score. 2:35 Change the score to 5000, 2:41 Save the file, And preview it. 2:46 The score's now 5000. 2:53 Changing the value in the variable changes the game. 2:55 Hey let's look at another example. 2:59 Let's go back to work space and set the score back to zero. 3:00 Notice this other variable named won, as in I won the game. 3:05 It's set to false, which is another type of value, called a boolean. 3:11 Let's change it to true. 3:15 Save the file. 3:19 And preview it. 3:23 Look, you won the game! 3:26 Okay, that doesn't make for a very fun game, but 3:27 you can see how values affect how programs work. 3:30 Changing this won variable to true changes the information of our program and 3:33 causes it to end the game. 3:39 Working with data, values, and variables is one of the most common features you'll 3:41 use in any programming language. 3:45 Let's set the value back to false and save the file. 3:47 Another feature of programming languages, and programming in general, 3:55 are control structures. 3:59 Control structures control the flow of the program, what happens and 4:00 when it happens in a program. 4:04 For example, in our game, if we grab a coin, the score changes. 4:06 Likewise, if the value of the variable won is set to false, the player 4:13 can run around the screen, jumping onto platforms and collecting coins. 4:17 However, when the value of one is true, then a message appears on the screen and 4:22 the game is over. 4:27 These are both examples of a type of control structure called 4:29 a conditional statement. 4:33 There are other types of control structures but 4:34 the important thing to keep in mind is that we can control the flow or 4:36 the steps a program follows as the program runs. 4:40 This is one of the things that makes computer programs flexible and useful. 4:43 Finally there are commands which are often called functions. 4:48 Functions are the heart of a program. 4:51 They're the commands we ask the computer to complete. 4:53 A function can be as simple as adding two numbers together, and giving you a result. 4:57 Or it could be as complex as adding information to a database. 5:02 In the next video, I'll introduce you to functions, as we build out our game 5:06

You need to sign up for Treehouse in order to download course files.

Sign up