Beginner: JavaScript Terminology with Exercises

Hello again,

So I asked a lot of questions in the previous thread which meant there was a lot of information there. I was recommended to make a single thread per question so I figured I’d comply since I’ve been getting a lot of help from here.

I was also told to post the relevant documentation which I’ll strive to do.

Relevant Link:
The Exercise I’m Currently At.

This should count as the official document as it contains all the information one might need to know about the objective of this exercise.

Before I get started, I wanted to make sure I had a good grasp about the terminology.
Step 1:

1. In main.js , define a function logVisibleLightWaves() .
image
Here’s how I would call each one:

  1. Name of the file.
  2. Code line number.
  3. The first part of a variable declaration. Here you’d write whether you’d be using var, const or let.
  4. Keyword, how the variable will be referred to.
  5. Assignment operator.
  6. Parameter brackets. You’d write in the parameters in between the brackets if there were any.
  7. Curved braces, that’s where you’d put in the body code.

Before going further with this exercise, I want to know if I got it right. No point going forward without being clear about the foundations.

1 Like

Alright so so far so good I guess. I wasn’t sure about some my definitions up there but I’m glad it seems to have passed the test.

Now, from what I understand and according to this, there are three ways to declare a variable. My mistake in the screenshot is that I used const to declare a variable when what I was supposed to do was to declare a function…

…or so I thought.

The correct answer was:

const logVisibleLightWaves = () => {
  const lightWaves = 'Moonlight';
  console.log(lightWaves);
};

Which comes back to what I was talking about in the other thread.

If I look at themozilla reference:

image
Both let and var mention being used to declare variables. Strangely enough, in the definition of const, there’s no mention of variable anywhere, it only says “constant”.

This I find puzzling considering that it seems like the word ‘variable’ was left out on purpose. I know for a fact that const is also used for declaring variables.

Interestingly enough when I write:
image
It’s all good, I get the check mark:
image

Which can only mean one thing: functions can be declared in various ways, there isn’t a single way to do it.

So I’ll limit myself to a single question: are functions and variables mutually exclusive? Are they two components used in coding with interact with one another while being non-exclusive.

A good example of what I mean is word class: nouns, verbs and adjectives are mutually exclusive and yet they are combined to create sentences.

This is what I’d like to know because in the answer they gave, they used const to declare a function when I read that it’s used to declare variables.

Another examples: primitives are not objects and objects are not primitives and yet they’re both components of JavaScript. I want to know if this applies to variables and functions. Considering variables are used to store data, I would think functions who don’t play this role at all are a completely different entity than variables.

References:
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements#Declarations

https://www.codecademy.com/courses/introduction-to-javascript/lessons/scope/exercises/block-scope?action=resume_content_item

Because variables are… variable. And constants are… constant. Name’s on the tin.
They both hold the same things, but constants cannot be changed - which is to say, once you’ve declared it, you cannot reassign it.

Given that you’ve just shown in your first code block that a function can be assigned to a variable (well, a constant, but same thing), you’ve already answered your own question.

1 Like

Well not really, I meant that’s not what I meant. It’s hard to explain. For example although var, const and let have different properties, they’re all used to store data as variables.

If I were to use an organisational chart it’d look something like this:
image

Well a const is still used to declare a variable. I don’t understand why they didn’t write: “Declares a constant variable”.

Let me explain:
I understand that as adjectives, something which is constant isn’t variable.

But as nouns, they’re not mutually exclusive. I mean a const does declare a variable.

I would’ve imagined they would’ve written:
const: declares a read-only named constant variable (as in it declares a variable which won’t change).

It’s hard to explain, I don’t know if I’m getting my idea across or not.

No it does not, as has already been explained. Sometimes people use terms without really thinking about what the term really means and if a constant were to be called a variable then they would be wrong. Think about the word variable. As has been explained, a constant is not variable.

Yes. And quite often it is a matter of personal preference what syntax to use but people sometimes insist that one way is the only way.

I think you are using the term mutually exclusive incorrectly so I do not understand the question.

I think you are trying to be too precise. Documentation should be precise and it often is not. The PHP documentation is especially imprecise. Sometimes people call everything a keyword instead of using a more precise word.

If you want precision then look at the ECMAScript® 2019 Language Specification. However that is not for beginners, it is written for developers of ECMAScript processors; compiler/translator/interpreter or whatever term is appropriate.

1 Like

Thank you kindly for your patience. I know I’m asking a lot of questions and me struggling can be frustrating at times but I really am doing my best. I find the point of entry to be very high. New definitions relating to terms I’m not familiar with which makes it labyrinthine to figure something out.

This being said, back to business.

Sometimes people call everything a keyword instead of using a more precise word.

Which in itself is problematic for me. There’s so much jargon to sort through and a slight imprecise understanding of the concepts makes it increasingly harder to understand what’s being explained. I feel like some terms can be freely interchanged while others should be strictly used.

No it does not, as has already been explained. Sometimes people use terms without really thinking about what the term really means and if a constant were to be called a variable then they would be wrong. Think about the word variable . As has been explained, a constant is not variable.

The way I understood it when I did the exercise, all three let, var, and const, could be used interchangeably to declare variables. On the MDN website, const is listed along var and let, both of which are used to declare variables. This let me to believe, mistakenly, that it was part of the group for lack of a better word. The syntax expressions used to declare variables.

Now the question comes to mind, since const is not used to declare variables, what is used to declare then?
image
Going back to my previous screenshot. It’s clearly categorized as syntax word meant to declare something. What can you declare besides a variable?

So before asking any further questions, I did my own research. According to this website:


Here’s what I infer from reading this sentence: variables defined with const… means const is used to declare variables just like let and var are except they cannot be reassigned. Which brings me back to:

Because variables are… variable. And constants are… constant.

Even though constant are constant, they’re still used to declare variables. This is where I think we misunderstood each other. So I was right to say that const are used to declare variables. I was puzzled by this citation as I clearly misunderstood what it was meant to say. My misunderstanding of this sort of led me astray a bit.

And so back to my original question (I’ll limit my questions to one a piece):
image
Why is it that they say they’ve defined a function logSkyColor()?

As I’ve already established, let, var and const are used to declare variables. Perhaps what m_hutlet meant by saying variables were variables was that they could be many different things. So let’s do some research about variables.

A variable is quote:

A variable is a named location for storing a value. That way an unpredictable value can be accessed through a predetermined name.

From the get go, I figured values for variables could only be primitives which could have been a wrong assumption on my part.

We know what variables come with an identifier or what I’ve personally called keyword in the past. From what I understand they mutually interchangeable or synonyms when it comes to computer syntax.

If I go back to:
image
logSkyColor is the identifier. So far so good.

From here, we know that a variable can doesn’t only hold primitives, they can hold functions as well. So a variable can hold both functions and primitives.

Let’s carry on. Back to my exercise:
image
So we can see there’s another variable in the code block of const. But we also see the arrow notation which is likely why const is called a function here.

Then boom! While doing research I find it, what I had been looking for:


So a variable which refers to a function stops being a variable declaration but is instead refers to a function.

Which comes back to my own question: why is const here called a function? The answer is because the variable declaration refers to a function.

The reason why I’m saying const refers to a function is because of the arrow => notation.

According to this:

are a more concise syntax for writing function expressions

So function expressions, what are those? According to this:


So a function expression is when a function is stored in a variable just like… here:
image
Which means here, this is a function expression, not just a function declaration.

Now that this is settled, let’s carry on. We were talking about the arrow notation which is used in function expressions.

When it comes to arrow notations, we find out that:

.

That is to say both function and return are implied in the arrow notation, also called ‘fat arrow’.

Normally with a variable I’d have the parameters in between my brackets, if any.

Anyhow, in the second step of the exercise, I’m told:
image
Here by ‘within’ I interpret that they want me to have the variable declaration within the code body { }. And so I type something like this:
image
which works for step 2.

Step 3 doesn’t come as a challenge to me:
image
which I easily clear:
image

Step 4 doesn’t come as a challenge either:
image
image

As all in all I managed to make it with plenty of research and I’m patting myself on the back :blush:.

Function declarations (and variable declarations) are hoisted by the interpreter to the top of the scope in which they are defined, whereas function expressions are defined when code execution gets to them.

What that means, is that function expressions aren’t defined before they are defined, whereas function declarations are always available.

console.log(funcExpression); // undefined
console.log(funcDeclaration); // funcDeclaration

var funcExpression = function funcExpressionName() {
    // do stuff
    return;
};

console.log(funcExpression); // funcExpressionName
console.log(funcDeclaration); // funcDeclaration

function funcDeclaration() {
  // do stuff
  return;
}

It’s a good habit though to not rely on hoisting of variables and function declarations. Many linters actively prevent that behaviour as it can lead to programmer confusion and unexpected results.

When there are multiple statements in a function, function declarations tend to be preferred because they are visually more distinct from other ways of defining the function.

Function expressions are used in the same way as function declarations, but tend to be most useful when you want to refer to a variable that’s outside of the function, such as when using the forEach method.

When several functions however have only a single statement, such as when using functional programming techniques, arrow-notation tends to be preferred as it dramatically reduces the vertical footprint of those single-statement functions.

2 Likes

So I gather this is incorrect then, right?

Nope, take another look at this example of a function expression:

var funcExpression = function funcExpressionName() {
    // do stuff
    return;
};

The funcExpressionName function is stored in a variable called funcExpression

They don’t have to be similar names either. For example:

var foo = function bar() {
    return "qux";
};
1 Like

Oh ok great, that’s a relief then!

Let us say that we have the number 87 in many places in many files. Let us say that something happens and the number changes to 93. Then someone must go through all files and change every occurrence of 87 to 93. If we had made 87 a constant then we need to change 87 to 93 in just the const statement(s); it is much easier. Programmers have learned to do things like that. Also, a name such as defaultColor is easier to remember than a number such as 5973895. When you make a constant then JavaScript will simply convert the name to the corresponding value.

No they are not, because constants are constant and variables are variable. In this situation, you can use a dictionary of the English langauge to understand the difference.

It is not normal to make functions constants. I see no value in that, it just confuses you.

Also, I think it would help to not refer to a function as a variable. That is not normal at the beginner level.

I consider function expressions and the arrow notation to be advanced topics.

I understand that, it’s very clear.

No they are not, because constants are constant and variables are variable. In this situation, you can use a dictionary of the English langauge to understand the difference.

Well:
image

I’m not saying you’re wrong, it’s just to show that based on the screenshot above, it seems like const is a type of variable which is why it’s called a const variable, regardless of what the dictionary would say.

When it comes to code the correct “dictionaries” to go to are standards documentation. In this case

https://www.ecma-international.org/ecma-262/10.0/index.html#sec-declarations-and-the-variable-statement

I find a lot of documentation to be hard to digest even with a lot of chewing :wink:

Though perhaps not as technically precise, I find MDN to be a lot easier to comprehend eg.
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/const

Constants are block-scoped, much like variables defined using the let statement. The value of a constant can’t be changed through reassignment, and it can’t be redeclared.

as for “what it is”

The const declaration creates a read-only reference to a value.

i.e. a “reference”

Is a const a Variable? Technically yes. but you cant change the value. So is it truly a variable if it doesnt vary?

Its o ne of those things where the term doesnt quite match the language

Well it is a case of people using terminology without thinking. That is not an authoritive reference.

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.