JavaScript function

Premise
Just started programming(1~Two months)It summarizes what I learned.
There may be things that do not work or mistakes in the actual field.
If you notice it, please let us know in the comments.

JavaScript function definition

It is one of the basic configurations of JavaScript, and the same process is defined together so that it can be used many times. The image of a method in Ruby is a function in JavaScript. There are two main types of JavaScript functions. Function declarations and function expressions. important point JavaScript functions have rules regarding return values. The return value must be specified in return.

Function declaration

What is defined below is called a function declaration.

function Function name(argument){processing}

Function expression

To define without defining the function name

variable= function(argument){processing}

Difference between function declaration and function expression

The loading timing is different. Function declarations are read first, function expressions are not read first. For example ** For function declaration **

good()

function good(){
console.log('good')
}

The following output is output without any error.

good

** For function expressions **

good()

const good = function(){
console.log('good')
}

I get the following error.

Uncaught ReferenceError: good is not defined
    at <anonymous>:1:1

From the above results, the function declaration is displayed because the defined function is read first. On the other hand, in the case of a function expression, the defined function is not read first, so an error occurs that the variable is not defined.

There are three more types of function expressions

Function expressions can be further divided into three types. (This is also a rough sketch, so there are more if you divide it into smaller pieces.) ・ Anonymous function ・ Immediate function ・ Arrow function

Anonymous function

function(argument){}

The expression described in is called an anonymous function. Can you write more concise code? is. I compared the following. ** Anonymous function **

const calc = function(num1,num2){
return num1*num2
}

const num1 = 3
const num2 = 4
console.log(calc(num1,num2))

** Function declaration **

function calc(){
return num1*num2
}

const num1 = 3
const num2 = 4
console.log(calc(num1,num2))

Does function declaration seem easier in this case? I wondered if the description was too simple would make such a difference. Also, I couldn't imagine it concretely because there was no function name, so I would like to continue learning and update it.

Immediate function

Syntax executed at the same time as defining a function You can save the trouble of calling the function.

(function Function name() {
console.log(num)
})(1)

By placing the function definition starting with function in (), the function can be executed immediately.

Arrow function

Syntax that allows you to define a function with the description () =>, omitting the description of function I will write and compare.

//Anonymous function
const variable name= function(){processing}
//Arrow function
const variable name= () => {processing}

Summary

Semicolon rules in JavaScript

A semicolon (;) is added to indicate the end of the description. Basically, it can be omitted, but it seems that the rules vary depending on the development site. When adding a semicolon ・ Definition of variables

const name = "Nako";

・ Method

console.log(name);

・ Function expression (anonymous function)

const good = function(){};

・ Function expression (immediate function)

(function good(){})();

・ Function expression (arrow function)

const good = () => {};

Without a semicolon ・ Function declaration

function good(){}

・ If statement

if(true){}els{}

As for the semicolon, it depends on the development site, so At the learning stage, it seems better not to have a very fixed idea.

Summary

** There are two main types of function definitions in JavaScript ** -Function declarations and function expressions ・ The big difference between the two is the timing of loading ** The presence or absence of a semicolon depends on the development site **