Function declarations and function expressions

This is the 5th day of my participation in the August More Text Challenge

preface

Functional programming is the mainstream programming mode of front-end development, but you have always used functions, do you know how to define functions in two ways?

This article mainly explains what function expressions are, what function declarations are, the similarities and differences between function expressions and function declarations, and the linkage between self-executing functions and function expressions.

The introduction

The self-executing Function (IIFE) is often used in module encapsulation. The integrity of the IIFE is the Immediately Invoked Function Expression, but translated into Chinese, the Function Expression is Invoked Immediately. The text reflects the two characteristics:

1. Immediately call
2. Functional expression

Function test1(){console.log(" console.log ")} () function test2(){console.log(" console.log ")} ()Copy the code

When we compare self-executing functions with function declarations, we see two extra pairs of parentheses. (1) Call the function immediately; (2) call the function immediately after the function is defined. But characteristic ② function expression is very difficult to understand, what is a function expression? What does he have to do with the other parentheses? So let’s go into functions with these questions in mind.

Function declaration

Let’s review the use of function declarations

Function test2(){console.log(" console.log ")} test2()Copy the code

You need to declare the function first and call it where it is used

The characteristics of

• Functions need to be declared before they can be called, and there are no hard and fast rules about where declarations and calls go in code. Declarations can come before or after a call.
• Function declarations are precompiled (prepromoted)
• Functions form a function scope when executed
• You must have a function name

Functional expression

Function expressions are commonly used for callback functions, self-executing functions, and closure exposure functions

SetTimeout (function(){},1000) // Function test1(){console.log(" console.log ")})()Copy the code

Contrast function declarations to find that function expressions are preceded by other symbols besides function (, or other symbols

This is also understood at the level of statements and expressions: function declarations are statements that implement some behavior; Functional expressions, on the other hand, are expressions that produce values

What are expressions and statements

 let a = 10;
 let b;
 b = a + 1;
Copy the code

In the above code let a = 10; And let the b; A = 10 and b = a + 1 are expressions.

A statement is an action that produces no value. Expressions produce values.

But there are some special things, some expressions in JavaScript can be used either as separate statements or as expressions, but statements are procedures, whereas expressions produce values, so they have different effects.

Function test(){}; function test(){}; Function test(){})+1; {console.log(18)} // generates a variable {age:18};Copy the code

Browsers do not compile correctly, so when using these expressions, you need to start with the (, +, = operators

Let test=function(){} // function(){} () setTimeout(function(){},1000) // function text(){} // function declarationCopy the code

Similarities and differences between function expressions and function declarations

Because function expressions and function declarations are branches of functions, the basic characteristics of functions are the same. For example, create a function scope, pass parameters, return values, etc.

There are also unique features of equivalence before, one is a declaration statement, one is an expression.

Pre ascension

Function declarations are pre-promoted, so they can be called both inside the function and in its parent scope

Function expressions are not pre-promoted, and functions cannot be called by name anywhere except inside the function itself

Test () function test(){Copy the code

Let cs=function test(){} cs()Copy the code

The function name

Function test(){} let cs=function (){Copy the code