Learn JavaScript in Construct, part 2: language basics

31

Index

Features on these Courses

Stats

14,298 visits, 37,526 views

Tools

Translations

This tutorial hasn't been translated.

License

This tutorial is licensed under CC BY-NC 4.0. Please refer to the license text if you wish to reuse, share or remix the content contained within this tutorial.

Published on 24 Sep, 2021. Last updated 16 Dec, 2021

Dynamic typing

JavaScript is a dynamically typed language, which means you can assign variables to a different type to the one they started with. The code below is valid.

let foo = "string";
foo = 10;     // changing to number
foo = false;  // changing to boolean

JavaScript lets you do this, but you don't have to. You may find it easier to understand code if variables usually keep the same type. Whether or not you use this dynamic typing feature is up to your preferred coding style.

It's also worth mentioning other programming languages have different types for numbers, such as representing integers and floating point (fractional) numbers with separate data types. JavaScript doesn't do this though, and there's only one number type, which as mentioned is a floating point number type.

typeof

JavaScript also provides the typeof operator, which can tell you what type something is. It returns a string.

// Try entering in to the console:
typeof 100       // number
typeof "Hello"   // string
typeof true      // boolean

This can help you identify what type something is if you're not sure, e.g.:

let myVar = "Hello";  // start off with string
myVar = 100;          // change to number

// ... lots more code ...

// What type is myVar?
console.log(typeof myVar); // number

The special type undefined has also come up previously, and it has its own type of "undefined" as well.

// Try entering in to the console:
typeof undefined	// "undefined"

This will also be the type of a variable that never had anything assigned.

let unassignedVariable;
console.log(typeof unnasignedVariable);	// undefined

Conclusion

In this part we've covered;

  • Statements
  • Comments
  • Variables, assignment and constants
  • Numbers, strings and boolean data types
  • Dynamic typing
  • The typeof operator

Hopefully by now you're getting familiar with entering code in both Construct and the browser console. The guide will continue to use both. In the next part, we'll learn more about operators, booleans, comparisons, and converting types.

Learn more

At the end of each part of this guide we'll include links to learn more about the JavaScript features mentioned on the MDN Web Docs, which is one of the best references for web development. You can skip over this and just carry on with the guide if you want, but if you're comfortable with what you've learned and want to dig deeper with a more complete reference or dig in to more advanced details, you can use these links to learn more.

Part 3

When you're ready to continue, head to the next part at Learning JavaScript in Construct, part 3: operators!

  • 8 Comments

  • Order by
Want to leave a comment? Login or Register an account!
  • Congratulations!! Very Clear and Objective in the explanations!!!

  • Thank you Ashley, I've been wanting to learn Javascript for sometime now. I tried another console but it was to hard to setup. Using Construct makes it simple. I am not a full time code developer, but the first language I learned on was basic using a mainframe at the Community College way back when. I am a retired teacher working with an English professor developing his English course for online learning. I'm looking forward to implementing the JavaScript in my project to make easier to develop and make it efficient.

  • You might consider including "scope" in the "VAR" section and why "var" is quirky.

      • [-] [+]
      • 3
      • Ashley's avatar
      • Ashley
      • Construct Team Founder
      • 3 points
      • (1 child)

      As explained in part 1 this tutorial isn't intended to go in to detail about the quirks of old legacy features. If you stick to let/const then you don't need to learn about all those quirks.

  • My project contains only an 'On start of layout' event block with "let b = "Hello";" in it but when I run the game, the variable 'b' returns as undefined until I manually declare it in the console.

    Is this normal behaviour or am I missing something? This is the case with any variable I make - for some reason I'm not able to declare on runtime through an event block.

    • To be more specific, the console returns:

      "Uncaught ReferenceError: b is not defined

      at <anonymous>:1:1"

        • [-] [+]
        • 1
        • Ashley's avatar
        • Ashley
        • Construct Team Founder
        • 1 points
        • (0 children)

        That's normal - the console basically works in global scope, and it can't access variables declared in other functions (and script blocks in event sheets are actually inside functions), just like how you can't write code in one function that accesses a local variable inside a different function.