First look into Java Script

(Callback Function, Arrow Function, Reduce, Map, Filter, find, forEach)

Intro

As a Sophomore College Student studying Computer Science, I had some experience playing with Java, C & C++, and Python in school. It was easy to grasp the JS language. Most of the coding languages have the basic fundamental behaviors. If you know one it is mostly easy to learn the next one. However, it will be confusing for awhile because you might use Java’ syntax into Javascript or C or C++.

For eg..

For Java, to print out “Hello World” will be:

System.out.print("Hello World") 

And in JS, it is:

console.log("Hello World")

I sometime switch between those two. However, it was just for a while.

What makes Java Script unique?

When JavaScript was created, it initially had another name: “LiveScript”. But Java was very popular at that time, so it was decided that positioning a new language as a “younger brother” of Java would help.

But as it evolved, JavaScript became a fully independent language with its own specification called ECMAScript, and now it has no relation to Java at all.

It is working very well with HTML and CSS together.

JavaScript was initially created to “make web pages alive”.

The programs in this language are called scripts. They can be written right in a web page’s HTML and run automatically as the page loads.

Scripts are provided and executed as plain text. They don’t need special preparation or compilation to run.

In this aspect, JavaScript is very different from another language called Java.

Some of my favorite Syntaxes and methods so far..

1. Reduce (Array.prototype.reduce() )

What is Reduce method and what do it do?

The reduce() method executes a user-supplied "reducer" callback function on each element of the array, in order, passing in the return value from the calculation on the preceding element. The final result of running the reducer across all elements of the array is a single value.

Get Lian B Hong’s stories in your inbox

Join Medium for free to get updates from this writer.

Remember me for faster sign in

Eg…

const array = [1, 2, 3, 4];
const sumWithInitial = array.reduce(
  (total, currentValue) => total + currentValue,
);
console.log(sumWithInitial);
// expected output: 10

In the above code-snip, it does not have the initial value, which mean it is nothing at first (will introduce in a sec). When it starts from the first index of the array, the first array, array1[0], value of 1, which become the current value because it is currently on that index (obviously) and since the initial value is nothing or there is no previous value, the total is 0 at first and it move on inside the function.

so far we get :

total = 0;
currentValue = 1;

and inside the function it add the total and the currentValue:

total + current = 0+1;  // which is equal to 1

In this case it is pretty easy, it just add the previousValue and current value. In the above code, it will be 0+1 which will return 1 and move on to the next syntax an do the same thing.

When it moves to the next index, array[1], which is the value 2 in this case. The the total value becomes 1 at that point and the current value is that index that we are on. It do the same thing, add the that total and the current index and return a new total every time until there is no more array index, then it return the total, which is the total of all index added up.

Initial value

What is it? it is the value that already there before anything happen.

Here is how we write it in code

const array = [1, 2, 3, 4];
const sumWithInitial = array.reduce(
  (total, currentValue) => {total + currentValue,
)},0;
// ^ see this 0, it is the initial value
console.log(sumWithInitial);
// expected output: 10

If we look above code, there is nothing before all add up so it is zero.

But what if we want multiple instead of adding?

Let see…

0 * 1 = initialValue * index[0]
// this will return 0

Whatever value the next index have it will always have 0 because 0 times anything is 0.

It is very important to have the initial value 1 in this code.

Not only to multiplication,

If we want to add that array to some existing number we can just change the initial value to that number, so that it will add all to that number and return the new total.