According to my own research there are several very important JavaScript programming language functions that each and every JavaScript Developer needs to lookup more commonly than other functions. You also need to note that you are not able to write a complete software application with just these functions alone, but you also not get that very far without knowing and understanding them either.

I highly recommend that people who are learning JavaScript for the first time try to focus on these functions more so they will not have issues with them either later in their learning of the JavaScript programming language. This article can also be used as a brain refresher for us experienced developers and veterans of coding.

Let's take a look into the JavaScript programming functions that every developer needs to know and understand.

The Most Searched JavaScript Elements

• for loop
• map
• foreach
• substring
• array
• switch
• reduce

The forEach Function

The modern JavaScript Developer will embrace functional programming, and the forEach function is an excellent example of that. The forEach loop is a very simple yet functional way to iterate over collections. This means that it keeps all the logic tight — no declaring extraneous iterator variables like you would with for. 

The following code example will show the simplicity of the forEach loop.

arr.forEach((x) => { console.log (x) })

// outputs: 5, 10, 15, 20

In the code example above, I have passed in a function to forEach, defining an inline anonymous function using the arrow syntax. Doing this is very common. If we wanted to, we could also declare a named function and pass it in.

You should notice that in forEach, the variable exposed, in our case x, is actually given the value of the element, not the index.

In the next code example, there is another simple way to get an iterator.

arr.forEach((x, i) => { console.log (i + "=" + x) })

// outputs 0=5, 1=10, 2=15, 3=20

I think you will also notice the simplified arrow syntax with forEach – which also has the same behavior – in the code example below.

arr2.forEach(x => console.log(x))

This syntax automatically returns, but at the same time, forEach doesn’t require a return value for it to work in application code.

From my own experience and knowledge, a lot of the JavaScript Developers prefer forEach to the traditional for loop. In general, use whatever loop syntax makes your code most clear and easiest for you and or the development team to understand your loop.

Do you like what you are reading so far? When you are done with this article, we recommend reading Simple Implementation to Understand worker_threads in NodeJS as the next article you read.

Simple Implemention to Understand worker_threads in NodeJS

One of the most highly request features in the NodeJS runtime environment is being able to use multiple cores — a lot of programmers don’t exactly understand the availability of NodeJS packages available to use to help with this issue. The package is worker_threads. This package really does help fix

CoderOasisCriticalKing

The array Function

All programmers and coders understands that collections of values are an essential aspect of all programming languages ranging from JavaScript to Python to PHP. When using them in JavaScript, we are using arrays to store our collections. JavaScript arrays are an absolutely amazingly flexible. This is because they are JavaScript has an awesome dynamic typing system. You can either create an empty array or one that hold values.

Collections of values are an essential aspect of all programming languages. In JavaScript, we use arrays to store collections. JavaScript arrays are incredibly flexible, which is largely due to JavaScript’s dynamic typing system. You can declare an empty array or one that already holds values.

With most other programming languages, arrays in JavaScript are base 0 or sues an index that starts with a 0 instead of a 1. You are also able to see that myOtherArray can hold a diversity of types ranging from numbers, strings, and or Booleans.

// make a new empty array:
const myArray = [];

//add a value:
myArray.push("CoderOasis is Awesome");
console.log(myArray[0]);  // outputs “CoderOasis is Awesome”

// make an array with values:
const myOtherArray = [0, "test", true];

The substring Function

String.substring is a method on string objects that lets you get a portion of the string. Here is a code example of how this is done.

// Let’s get the substring of this Emerson quote:
let myString = "CoderOasis is a technology blog that offers articles to help people learn programming and cybersecurity."

console.log(myString.substring(0,34));
// outputs: 'CoderOasis is a technology blog tha'

The switch Function

In a lot of different programming languages – such as JavaScript since we are talking about it right now – has the switch function to handle all branching control flows. Programmers use the switch function to handle branches in a more compact – and even understandable – way or better than if/else. Over the two decades, JavaScript's switch statement is grown more and more powerful. Here is the basic syntax of how to use switch in code.

switch (word) 
{
    case "Enthusiasm":
      console.log("This word is about passion and excitement.");
      break;
    
    case "mother":
      console.log("This word is about the source or origin.");
      break;
    
    case "effort":
      console.log("This word is about hard work and dedication.");
      break;
    
    default:
      console.log("I don't have specific analysis for this word.");
  }

The switch keyword function accepts a variable, which in this case is called word. Each of the case statement corresponds to a possible given values of the switch variable. Notice we have to use the break statement to end the case block. This is different from many constructs where braces are used to define scope. IF or when a break statement is omitted, the code will fall through to the next case statement by default in the application code. 

The default statement gives us the case that will execute if none of the other cases match what we want to output in the application code. The default statement is also optional if a developer wants to have a default outcome.

Here is a code example of how we can use the switch statement with quotes from Ralph Waldo Emerson to show how it would be used in a application.

let myString = "Enthusiasm is the mother of effort, and without it nothing great was ever achieved."
    
function analyzeWord(word) 
{  
  switch (word) 
  {
    case "Enthusiasm":
      console.log("This word is about passion and excitement.");
      break;
      
    case "mother":
      console.log("This word is about the source or origin.");
      break;
      
    case "effort":
      console.log("This word is about hard work and dedication.");
      break;
      
    default:
      console.log("I don't have specific analysis for this word.");
  }
}

myString.split(" ").forEach((word) => analyzeWord(word)); 

The for Loop Function

The for loop is a fundamental component of all programming languages, yet for some reason JavaScript's version has some peculiarities. The basic syntax of the for loop is as follows.

for (let i = 0; i < 10; i++)
{
  console.log("i is going up: "+ i);
}

The code example above says the following:

 Give me a variable named i, and so long as it is less than 10, do what is indicated inside the braces. Every time you do, add 1 to i. This is a common loop variable, where "i" is short for "iterator."

This form of the for function in JavaScript function is pretty much the same different programming languages.. It’s just a simple declarative type of loop. This function is very flexible for how a developer would want to use it in their application code.

// This will loop forever, unless something else changes i, because i is not modified by the loop
for (let i = 0; i < 10;)
{
  console.log("i is going up: "+ i);
}

// you can declare multiple variables, tests and modifiers at once
for (let i = 0, j = 10; i * j < 80 && i < 10; i++, j=j+5)
{
    console.log(i * j); // outputs 0, 15, 40, 75 and breaks
}

This function can be very helpful to all developers, especially when dealing with super complex nested loops, to declare more descriptive iterators like userIterator or productCounter. 

Don't forget that there is also a for-in loop in JavaScript, useful for looping over JSON objects. The example code is right below.

let myObject = { foo: "bar", test: 1000 }

for (let x in myObject) 
{ 
 for (let x in myObject) { console.log(x + "=" + myObject[x]) } 
}

// outputs: foo=bar test=1000

There is also the for-in function on arrays to go with it if needed.

let arr = [5, 10, 15, 20];

for (let x in arr2) 
{ 
  console.log(x + "=" + arr2[x]);
}

// outputs: 0=5, 1=10, 2=15, 3=20

While used in objects, the iterator (x) becomes the name of the property. As for the array, it becomes the index. This can then be used to access the object or array properties and elements.

The map Function

When we use the forEach function, it simply loops over each element, the map function allows you to loop on the array and perform actions on each of the different elements, arrays, functions, and objects. The map function returns a new collection with the action applied to each element.

In the following code example, I am going to multiple each element by 10.

let modifiedArr = arr.map((x) => { return x * 10 } )

// modifiedArray now holds: [50, 100, 150, 200]

Don't forget that there is a short form version of this code.

let modifiedArr = arr.map(x => x * 100 )

// modifiedArray now holds: [500, 1000, 1500, 2000]

If you needed to use the long form, you can perform arbitrary logic inside the callback. The code example is right below of how to do this.

let modifiedArr = arr.map((x) => { 
  let foo = 1000;
  
  // Do more stuff
  
  return x * foo; 
})

The simplicity of map declines as application code becomes way more elaborate. The goal here is to always remember that you are going to want to prefer simple callbacks whenever you can and possible.

The reduce Function

Alongside with the map function, reduce is a functional part of JavaScript. It lets you take a collection and then get back a single value if needed. Anytime you need to perform an operation across an array that reduces it to a single value, you can use reduce. Here is a good code example of how this works right below.

const numbers = [1, 2, 3, 4];
const sum = numbers.reduce((accumulator, number) => accumulator + number);
console.log(sum); // Output: 10

The reduce function will take a two-argument function, where the first argument is the accumulator — a variable that will live across all iterations, ultimately becoming the output of the reduce call. The second argument (number) is the value of the element for the iteration. 

You can use reduce function to specify a starting value by setting a second argument after the callback function in the following code example.

// With initial value of 10

const sum2 = numbers.reduce((accumulator, number) => accumulator + number, 10);
console.log(sum2); // Output: 20 (10 + 1 + 2 + 3 + 4)

This is also extremely helpful when the collection could also be empty. In that case, the second argument acts as a default value.

Do you like what you're reading from the CoderOasis Technology Blog? We recommend reading our Implementing RSA in Python from Scratch series next.

Implementing RSA in Python from Scratch

Please note that it is essential for me to emphasize that the code and techniques presented here are intended solely for educational purposes and should never be employed in real-world applications without careful consideration and expert guidance. At the same time, understanding the principles of RSA cryptography and exploring various

CoderOasisExiledTech

The CoderOasis Community

Did you know we have a Community Forums and Discord Server? which we invite everyone to join us? Want to discuss this article with other members of our community? Want to join a laid back place to chill and discuss topics like programming, cybersecurity, web development, and Linux? Consider joining us today!