DEV Community

loading...
Cover image for What **is** JavaScript? 🤷🏼‍♀️

What **is** JavaScript? 🤷🏼‍♀️

javascriptcoff1 profile image JavaScript➕Coffee🚀 Updated on ・5 min read

We aren't going to get too technical here, but I wanted to give you a small intro to JavaScript and what, fundamentally, it ** is **.

So make a hot chocolate, sit back and relax.

Terms:

  • Operating System (OS) - the system that your computer runs on, at the very base. Could be Mac, Linux, Windows. If you want to learn more about the stuff beneath the OS, I talk about it more in-depth in my Docker article
  • Compiled language - read by your computer all at once and will completely break if you have an error.
  • Interpreted language - 'translated' into binary as it reads it and if it finds an error, will break at that point. You can also run it as soon as you have finished typing, rather than wait for it to compile.

Ok, it feels odd to write this now as I’ve been studying JS for a while, but I wanted to include it as part of my What is series; yesterday I posted on Twitter something that I’d learned from my JavaScript course, and it turned out to be not entirely technically correct:

Although that's right, the technically correct way of saying it would be 'loosely typed'.
🤷🏼‍♀️ They mean the same thing but the Tech industry likes to be confusing so of course there are two ways of saying it...

Dynamicalloosly typed then...

  • JavaScript is loosely/dynamically typed. This means that you don't have to specfically tell it what you are writing. You don't need to tell it that if you wrap something in quotes("") it's a string. It knows. You don't need to specify that if something is true or false, it's a boolean. It knows. Pretty cool! This is handy for keeping your code readable and uncluttered.

In a language that isn't dynamically/loosely typed, you'd have to specify as you go - here's an example of some statically typed C#:

  1. Declare:
    string myString;

  2. Assign:
    string myString = "Hello";

  3. Declare + Assign:
    string myString = "Hello";

Caveat for all the hawk-eyed C# fans... 👀

C# is confusing because it has dynamic 'features' - you can do this and it would work...

  1. var myString = "Hello";

Ok, so maybe C# wasn't the best example because it is the most confusing thing in the world (shoutout to Giovanni for the code snips and explanation).
I hope you saw the comparison I was trying to make there...

Back to the JavaScript, please

Let's break down exactly what JavaScript is. Skillcrush define it nicely in their blog as:

JavaScript is a scripting language used to create and control dynamic website content.

Nice, ok so what does that mean?

JavaScript is a coding language that is read, line by line, in the browser and if there's an error it will break at that point. People use it to create the 'moving parts' of websites - forms, complex animations, and authentication (sign-in, etc).

CSS does all the moving parts though, right?

Yes, CSS does help to make things move, but not in the same way as JavaScript.
We can think of web design as a house -

image

The HTML is the structure of the house. It is the foundation and the bricks. You need it, else your house would just fall down.

The CSS is the decoration in the house. You need this to ensure that people want to visit your house, and that you want to be in your house... Bare bricks and scratchy floors are no good...

JavaScript is the electricity, water, and internet connection in your house. It makes your house functional and without it, your house would be very bare. No one would be able to do anything useful, and you probably wouldn't get any visitors.

I hope that analogy works! You could also come up with different analogies to explain what JS fundamentally does - the sails on a boat, or the engine in a car maybe?
Sure, you can build a site with just HTML and CSS, but often you'll need or want some extra functionality or logic that only JavaScript can handle.

Logic? Like a human?

Yes, in that it's a human that writes the logic. 'JavaScript logic' means that someone has solved a task using JavaScript.

What kind of task?

Say on your website you wanted to have a form for people to fill out and when they click 'submit' (after they're filled out all of the fields), you want an animation of some fireworks to appear 🎆
You've got the CSS animation, lovely. Now how do you make it appear when a user clicks 'submit', but only when they have filled out all the fields?

Let's break this down - to ensure all of the fields are filled out, you'd use the 'required' attribute in your HTMl. Ok good, that's that bit sorted. Now you need the JavaScript logic - you'd put an 'event listener' onto the 'submit button' that would wait for the user to click submit!
Wait... it doesn't know to wait for all the fields to be filled in... the 'required' attribute will stop the form being sent without everything filled in, but you have put your event listener on the button, so it would show fireworks regardless of the form!
...
You need some extra JavaScript logic to say if the user clicks, and the 'required' property is being met, then fire the fireworks. Else pop up "Fill out the form!" or something similar...

That's JavaScript logic. It just means a problem that someone has solved using JavaScript.

Finally, the age-old question:

Why is it called JavaScript?!

Now, obviously, I didn't name it so people have their own interpretations about why. I have done some research and light opinion (twitter) research, and these are my findings:

  1. It has nothing at all to do with Java, except for some convoluted history. Back in the day when the internet was just a baby thing, Netscape (the biggest browser company at the time) decided to equip its browser with a scripting language that would allow web designers and users to interact with the different objects on the page (images, forms, links, etc.), but above all with Java applets (programs that allow interaction with the user). Java is a very popular language, developed by Sun Programming, that is most suited to back-end programming (more heavy logic and databases, less pretty buttons and fireworks) although can be used pretty much anywhere.

  2. It was originally going to be called Mocha ☕️ and then LiveScript. The name changed to JavaScript because Netscape and Sun did a license agreement

When JavaScript was released, Java was the big, popular, must-know language, the creators of JavaScript wanted a piece of that popularity and the Sun/Netscape agreement allowed that.

So, in conclusion: marketing and business is why JavaScript is called JavaScript.

I hope that was a nice gentle intro to JavaScript and it doesn't seem so scary now!

image

Discussion (2)

pic
Editor guide
Collapse
ricobrase profile image
Rico Brase

About the dynamically typed thing:
You are describing type inference instead of dynamic typing.

Type inference means, that the runtime/compiler infers the type of a variable/parameter from the current context (the "it knows" part).

example (JS):

var hello = "world"; // string
Enter fullscreen mode Exit fullscreen mode

example (C#):

var hello = "world"; // string
Enter fullscreen mode Exit fullscreen mode

Dynamically typed on the other hand means, that the type of the variable/parameter can be changed during runtime and is not bound to a specific type. In most cases, it's used with type inference, allowing for confusion.

example (JS):

var hello = "world"; // string
hello = 42; // number
Enter fullscreen mode Exit fullscreen mode

example (C#):

var hello = "world"; // string
hello = 42; // COMPILER ERROR, this is NOT SUPPORTED by default in C# since hello is of type string!
Enter fullscreen mode Exit fullscreen mode

C# DOES support dynamic typing, but it's required to opt-in per variable/parameter using the dynamic keyword. Please note that for most use cases, this is considered bad practice since compiler type checking DOES prevent a lot of errors in development BEFORE publishing your application to the public.
(Errors are caught during development and don't crash the application for the user in runtime.)

dynamic hello = "world"; // string
hello = 42; // int
Enter fullscreen mode Exit fullscreen mode
Collapse
javascriptcoff1 profile image
JavaScript➕Coffee🚀 Author

Thanks! I know that C# DOES technically allow for dynamically typed, hence the caveat, but this article is for codenewbies and I couldn't think of another language to explain it with or get examples from!