Keine Ergebnisse gefunden
Welcome to part two of our five part series on learning JavaScript for game developers. In part one we talked about Variables. In this part we’ll cover Objects and Functions. Previously we simply stored variables in the global scope. This is not the best way to do that. In order to build more complex data structures we rely on something called Objects.
Think of an Object as a container that can hold other Variables, Arrays and even block of code called Functions. Here is an example of how to create an Object:
var player = {};
This is similar to how we created an Array but unlike an Array, values we attach to Objects are not ordered. Here is an example of how we would put a name variable on the player:
player.name = "Jesse Freeman";
When we attach a variable to an object it is called a property of that object. To access its value we simply call it by name like so:
player.name;
This would return "Jesse Freeman". We can also attach Arrays to Objects just like we do variables:
player.inventory = ["item0", "item1", "item2"];
To get the value of something from the player object’s inventory simply access it just like you would a normal array:
player.inventory[1];
This would return "item 1" from the inventory array. Objects are incredibly powerful in JavaScript and should be used to store and organize data such as player info, game settings, level details and even game logic. As you continue to build out a game you will eventually need a place to store instructions of code. For this we use something called functions.
Functions allow us to create containers of reusable instructions. It also allows us to control when a block of code will get executed. Take the following example:
var firstName = "Jesse";
var lastName = "Freeman";
var fullName = firstName + " " + lastName;
Believe it or not this is a common process where you would want to combine two variables together such as a first and last name. If you run this code in JavaScript it would execute immediately. Also, we would have no way to rerun it. Functions allow us to control when and how this action would take place. Here is the basic template for writing a function:
function getFullName(){
//code goes here
}
Just like we declare a variable with var we denote a function with the function identifier. Next is the name of the function and then the block of code that will make up the function is contained in the curly brackets. Here is an example of the above function but with some logic inside of it:
function getFullName(){
return firstName + " " + lastName;
}
Here you will see that we moved the code that combines the first and last name into the function. We are using a new statement called return which will give us back a value when you call the function. In order to execute this you can call the function by name:
getFullName();
Even better, we can assign the value we get back to a variable:
var fullName = getFullName();
But this will only get us so far. Since the function has a scope of its own, meaning it doesn’t have access to anything outside of the curly brackets, it has no way of getting access to the first and last name variables. Luckily you can pass these into the function via parameters. It looks something like this:
function getFullName(firstName, lastName){
return firstName + " " + lastName;
}
Now when we call the function we can pass in our first and last name and the function will return the full name back.
var fullName = getFullName("Jesse", "Freeman");
Functions can have any number of arguments and you can pass in Strings, Numbers, Booleans, Arrays, Objects and even references to other functions. As you learn more about coding you will make extensive use out of functions and eventually you will learn how to attach them to Objects so you can reuse them throughout your games. Next, we’ll talk about how to build conditionals in JavaScript to help you build out logic blocks in you own games.
- Jesse Freeman (@jessefreeman)