JavaScript is an object-based scripting language. The unit of JavaScript code reuse is Function, but its Function is more abundant than that of structured programming language. The Function in JavaScript language is "first class citizen", which can exist independently; moreover, the Function of JavaScript can be used as a class completely (and it is also the only constructor of this class); at the same time, the Function itself is also an object, and the Function itself is a Function instance.

1, Three ways to define functions

1. Define named function

Usage:

    <script type="text/javascript " > 
     //Calling function
     hello ('yeeku') 
     // Define the function hello, which requires a parameter 
     function hello(name){
        alert(name + "Hello") ; 
     }
    </script>

It can be seen from the above example that in the same < script. / > element, JavaScript allows the function to be called first and then defined, which is actually the "function promotion" feature of JavaScript. But in different < script />Element, you must define the function before calling it. In other words, the function defined in the previous < script / > can be called in the following < scnpt.. / > element, but the previous

2. Define anonymous functions

Usage: use variable to get this function

     <script type="text/javascript " > 
     //Define anonymous function and use variable to get this function
     var f =function(name){
        alert(name + "Hello") ; 
     };
     //Variable call function
     f('yeeku'); 
    </script>

When receiving anonymous functions with variables, define the function name at the same time

     <script type="text/javascript " > 
     //Define anonymous function and use variable to get this function
     var f =function test(name){
        alert(name + "Hello") ; 
     };
     //Variable call function
     f('yeeku');
     //The test function well does not exist. There is an error in the following code
     test('hello');
    </script>

This method is more convenient and recommended.

3. Use anonymous Function of Function class

Function can accept a series of string parameters. The last string parameter is the execution body of the function. The statements of the execution body are separated by semicolons (,), while the preceding string parameters are the parameters of the function.
This method will make the code very bloated, just to understand.

2, Local variables and local functions

The same as local variables, functions also have local differences. When an external call is made to a local function in a function, an error will be reported

   <script type="text/javascript " > 
        function name() {
            function inner1() {
                document.write('Local function 1');
            }
            function inner2() {
                document.write('Local function 2');
            }
            document.write('------');
            inner1();
            inner2();
        }
        name();
        // External call to local function in name, error reported
        inner1();
    </script>

Operation result:

3, Functions, methods, objects, variables, and classes

Function is the first-class citizen of JavaScript. Function is a very important concept in JavaScript programming
When you use JavaScript to define a function, you can actually get the following four items:

• Function: like Java methods, this function can be called.
• Object: when defining a Function, the system will also create an object, which is an instance of the Function class.
• Method: when a function is defined, it is usually attached to an object as its method.
• Variable: when you define a function, you also get a variable.
• Class: while defining a function, we also get a class with the same name as the function.
  The following program defines a Person function, that is, a Person class, which will also be the only constructor of the Person class.

    <script>
        // Class is usually capitalized
         function Person(name,age){
          this.name = name;
          this.age = age;
          this.info = function(){
             document.writeln("My name:"+this.name+'<br/>');
             document.writeln("My age"+ this.age+'<br/>');
          }; 
       }
       var fun = new Person('li',20);
      fun.info();
    </script>

Operation result:
My name: li
My age is 20

4, Instance properties and class properties of functions

There are three variables in a function

• Local variable: a variable declared as var in a function. Use only locally.
• Instance property: variable decorated with this prefix in function.
• Class attribute: variable decorated with function name prefix in function.

The instance property will be different according to the defined object, and the result of the instance object will be different in different objects.
Class property, can only be called by class, only one value. When an object of a class accesses a class property, the result is undefined.

Code example:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    <script>
        function Person(nat,age){
            this.age = age;
            Person.nat = nat;
            var bb=0;
        }
        var p1 = new Person('China',20);
        document.writeln('-----'+"p1 Of age Attribute is"+p1.age+"<br/>p1 Of nat For:"+p1.nat+"<br/>Instance attribute nat: "+Person.nat+'<br/>');
        document.writeln("p1 Of bb Local variable property is"+p1.bb+"<br/><hr/>");

        var p2 = new Person('U.S.A',1);
        document.writeln("After creating two objects------<br/>");
        document.writeln('-----'+"p1 Of age Attribute is"+p1.age+"<br/>p1 Of nat For:"+p1.nat+"<br/>Instance attribute nat: "+Person.nat+'<br/>');
        document.writeln('-----'+"p2 Of age Attribute is"+p2.age+"<br/>p2 Of nat For:"+p2.nat+"<br/>Instance attribute nat: "+Person.nat);
        
    </script>
</body>
</html>

Operation result: