Hello everyone , Here is 「 Daotin Sleepwalking 」 Learn from scratch Web Series of tutorials . This article first appeared in 「 Daotin Sleepwalking 」 official account , Welcome to subscribe and pay attention to . Here I will start from Web Front end zero base start , Learn step by step Web Related knowledge , I will also share some interesting projects during this period . Now let's go into Web The adventure of front end learning !

One 、 function

1、 Definition of function

// The first one is 
function fn1(){
console.log(" I'm the first way to define !");
} // The second kind
var fn2 = function (){
console.log(" I'm the second way to define !");
}; // Pay attention to the semicolon function (){
console.log(" I'm the second way to define !");
}(); // One of the ways to call the second way : Self calling of function // The third kind of
var fn3 = new Function("console.log(' I'm the third way to define !')");

The first one is :( Declaration of functions ) The first definition is the most powerful , After defining , You can use it anywhere , No location restrictions .

The second kind :( Function expression : Anonymous functions ) There are limitations to the latter two definitions .( The function must be used after the function is defined )

2、 Function call

 Function name ();

3、 Function name

  • Follow the hump nomenclature .
  • Can't have the same name ( function overloading ), Otherwise, the following function will override the previous function .
// Print the function name , It's like printing the entire function .
console.log(fn);
// Print executive functions , It is equal to printing the return value of the function .
console.log(fn());

4、 Formal parameters and actual parameters

  • Formal parameters don't need to be written var.
  • The number of formal parameters and actual parameters can be different .

5、 Return value

  1. If the function does not show the use of return sentence , So the function has a default return value :undefined
  2. If the function uses return sentence , however return There is no value behind , So the return value of the function is also :undefined.

6、 Variables and scopes

Global variables : stay script Use var Variables defined ( be-all script Share the whole picture ,js There's no block level scope in it , Only global scope and local scope ).

Implicit global variables : stay script No, var The variable of .

function fn(){
var a = b = c = 1; // b and c It's implicit global variables ( Equal sign )
var a = 1; b = 2; c = 3; // b and c It's implicit global variables ( A semicolon )
var a = 1 , b = 2 , c = 3; // b and c It's not an implicit global variable ( comma )
}

( Global variables cannot be deleted , Implicit global variables can be deleted )

var num1 = 10;
num = 20;
delete num1;
delete num2;
console.log(typeof num1); // number
console.log(typeof num2); // undefined

local variable Internal function use var Defined variables and formal parameters .

6.1、 Variable declaration promotion ( Pre parse )

effect : Check for syntax errors .js When the page is loaded , First check for syntax errors on the page . Lifting up variable declarations .( Variable declaration promotion and function overall promotion )

6.2、 The promotion of variables

Only raise variable names , Do not raise variable values .

consolas.log(aaa);// The result of printing is undefined , Because only the variable name is promoted , Do not raise variable values .
var aaa = 111;

Within the scope of the function , Still applicable .

6.3、 Function promotion

function Directly defined methods : Overall improvement ( The first function definition method mentioned above ).

fn();
var aaa = 111;
function fn(){
// Variable declaration promotion is still practical inside functions .
// The principle of proximity of functions ( Local variable scope ), Printed aaa No 111, It is undefined.
console.log(aaa); // undefined
var aaa = 222;
}

Pre parsing will be partitioned :

How right script If the function in the tag has the same name , Pre parsing does not conflict . That is to say, the scope of pre parsing is for each script label .

var Improve first ,function Further promotion :

Example :

console.log(a); // Output a The body of the function 
function a() {
console.log("aaaaa");
}
var a = 1;
console.log(a); // Output 1

When you print the first result ,var Will improve , after function Further promotion , But the function a And variables a The nuptial ,function Of a Override the variables behind a, So the first output a The body of the function .

The second front var a = 1; After promotion , This position is equivalent to only a = 1; assignment , So the second print 1.

6.4、 Anonymous functions

The effect is as follows :

//1. Call directly 
(function (){
console.log(1);
})(); //2. The binding event
document.onclick = function () {
alert(1);
} //3. Timer
setInterval(function () {
console.log(444);
},1000);

Learn from scratch Web And JavaScript( 3、 ... and ) More articles on functions

  1. Learn from scratch Web And JavaScript( One )JavaScript summary

    Hello everyone , Here is 「 Daotin Sleepwalking 」 Learn from scratch Web Series of tutorials . This article first appeared in 「 Daotin Sleepwalking 」 official account , Welcome to subscribe and pay attention to . Here I will start from Web Front end zero base start , Learn step by step Web Relevant knowledge ...

  2. Learn from scratch Web And JavaScript( Four ) Array

    Hello everyone , Here is 「 Daotin Sleepwalking 」 Learn from scratch Web Series of tutorials . This article first appeared in 「 Daotin Sleepwalking 」 official account , Welcome to subscribe and pay attention to . Here I will start from Web Front end zero base start , Learn step by step Web Relevant knowledge ...

  3. Learn from scratch Web And JavaScript( 5、 ... and ) object-oriented

    Hello everyone , Here is 「 Daotin Sleepwalking 」 Learn from scratch Web Series of tutorials . This article first appeared in 「 Daotin Sleepwalking 」 official account , Welcome to subscribe and pay attention to . Here I will start from Web Front end zero base start , Learn step by step Web Relevant knowledge ...

  4. Learn from scratch Web And JavaScript senior ( One ) Prototype , Snake case

    Hello everyone , Here is 「 Learn from scratch Web Series of tutorials 」, And update at the following address ...... github:https://github.com/Daotin/Web WeChat official account :Web At the top of the front end Blog Garden :ht ...

  5. Learn from scratch Web And JavaScript( Two ) Variable

    Hello everyone , Here is 「 Daotin Sleepwalking 」 Learn from scratch Web Series of tutorials . This article first appeared in 「 Daotin Sleepwalking 」 official account , Welcome to subscribe and pay attention to . Here I will start from Web Front end zero base start , Learn step by step Web Relevant knowledge ...

  6. Learn from scratch Web Series of tutorials

    Hello everyone , Here is 「 Learn from scratch Web Series of tutorials 」, And update at the following address …… github:https://github.com/Daotin/Web WeChat official account :Web At the top of the front end Blog Garden :http:/ ...

  7. Learn from scratch Web And BOM( 3、 ... and )offset,scroll, Variable speed animation functions

    Hello everyone , Here is 「 Learn from scratch Web Series of tutorials 」, And update at the following address ...... github:https://github.com/Daotin/Web WeChat official account :Web At the top of the front end Blog Garden :ht ...

  8. Learn from scratch Web And Ajax( 3、 ... and )Ajax summary , Quick start

    Hello everyone , Here is 「 Learn from scratch Web Series of tutorials 」, And update at the following address ...... github:https://github.com/Daotin/Web WeChat official account :Web At the top of the front end Blog Garden :ht ...

  9. Learn from scratch Web And CSS3( 8、 ... and )CSS3 Three cases

    Hello everyone , Here is 「 Learn from scratch Web Series of tutorials 」, And update at the following address ...... github:https://github.com/Daotin/Web WeChat official account :Web At the top of the front end Blog Garden :ht ...

Random recommendation

  1. hibernate note -- Based on the primary key ( double ) One to one mapping to

    In the one-to-one mapping based on foreign keys introduced in the previous section , stay Person There is a foreign key column in the table idCard_id, Corresponding idCard Primary Key id, As for one-to-one mapping based on primary key , Is refers to Person It's abandoned in the table idcard_id this ...

  2. AMBA

    be based on IP The design method of reuse is SOC It has been widely used in design , During the design process , The most critical problem for the designers of bus on chip . AMBA By ARM The bus on chip out of the company , It's a popular industry standard structure on chip . AMBA The specification mainly includes AHB(A ...

  3. WP8 Double click the back key to exit

    bool isExit = false; // Constructors public MainPage() { InitializeComponent(); isExit = false; // For localization App ...

  4. Web Form Cancel the automatic conversion of mobile terminal

    In the project Site.Mobile.Master Exclude republishing

  5. centos View hardware information

    Server hardware information is common , It's something that needs to be operated frequently : Let's share some common hardware view commands : 1.centos See the hardware information below, the content is very comprehensive . CentOS Common command view cpu more /proc/cpuinfo 2.C ...

  6. C# Realization The singleton pattern

    http://blog.sina.com.cn/s/blog_75247c770100yxpb.html

  7. .net Tips

    Simple prompt effect : <input runat="server" type="text" id="SelPerson" value=&quo ...

  8. Poj OpenJudge Bailian 1573 Robot Motion

    1.Link: http://poj.org/problem?id=1573 http://bailian.openjudge.cn/practice/1573/ 2.Content: Robot M ...

  9. Mindjet.MindManager“ Parameter error ” terms of settlement , Apply to 9.0、10.0 and 14.0

    MindManager Out 14.0 Version of the , But when you apply individual templates, you will be prompted “ Parameter error ”, And then automatically shut down . terms of settlement :    If it is win7 System , Can enter the C:\Users\( user name ) \AppData\Loca ...

  10. ZOJ3557 How Many Sets II( Lucas Theorem )

    Reprint please indicate the source : http://www.cnblogs.com/fraud/          ——by fraud How Many Sets II Time Limit: 2 Seconds    ...