Object-Oriented JavaScript — Loops and Functions

Check out my books on Amazon at https://www.amazon.com/John-Au-Yeung/e/B08FT5NT62

Subscribe to my email list now at http://jauyeung.net/subscribe/

JavaScript is partly an object-oriented language.

To learn JavaScript, we got to learn the object-oriented parts of JavaScript.

In this article, we’ll look at various kinds of loops and functions.

Loops 

There are various kinds of loops we can use with JavaScript.

For…in Loops

The for…in loop lets us loop through an object’s keys.

For example, we can write:

let obj = {
  a: 1,
  b: 2,
  c: 3
}
for (const key in obj) {
  console.log(key, obj[key])
}

And we get the key with the key and we can access the value with obj[key] .

For…of Loops

The for…of loop lets us iterate through iterable objects, including arrays.

For instance, we can write:

let arr = [1, 2, 3]
for (const a of arr) {
  console.log(a);
}

We have the arr array which we loop through with the for-of loop.

a has the array entry.

Comments

Comments are part of the code that’s ignore by JavaSdcript engines.

We can use them to explain how our code works.

Single line comments starts with // and ends at the end of the line.

Multiline comments starts with /* and ends with */ .

Anything in between them are ignored.

So we can write:

// single line

and:

/* multi-line comment on a single line */

or:

/*
  multi-line comment on a single line
*/

Functions

Functions is a reusable piece of code.

We can use them to do something in our code.

There are various kinds of functions, they include:

• anonymous functions 
• callbacks 
• immediate (self-invoking) functions
• inner functions (functions defined inside other functions)
• functions that return functions 
• functions that redefine themselves 
• closures
• arrow functions

They let us group together code, give it a name, and reuse it later.

We can define a function by writing:

function sum(a, b) {
  let c = a + b;
  return c;
}

And we return the sum of a and b in the function.

a and b are parameters and we return a value.

We have the function keyword to define a function.

return lets us return a value.

If there’s no return statement, then it returns undefined .

We can also create arrow functions by writing

const sum = (a, b) => {
  let c = a + b;
  return c;
}

or we can write:

const sum = (a, b) => a + b

They don’t bind to this and they’re shorter.

Calling a Function

We can call a function by writing:

const result = sum(1, 2);

The values in the parentheses are the arguments.

They’re set as the value of the parameters.

Parameters

Parameters are the items in the parentheses of the function. 

So if we have:

function sum(a, b) {
  let c = a + b;
  return c;
}

then a and b are parentheses.

We pass in arguments to set them.

They’re set by their position.

If we forgot to pass them in then they’ll be undefined .

JavaScript isn’t picky when checking arguments.

The type can be anything, and we can skip any of them.

It’ll just do things that we don’t expect and fails silently if we don’t pass in what’s expected.

Conclusion

Functions are reusable pieces of code we can invoke.

for…in loops let us loop through objects and for…of loops let us loop through iterable objects.