Jq_ Event Delegate _ closed packet _ self-calling function _ anonymous function

Event Delegate

<div id= "Div1" >
    <button>1</button>
    <button>2</button>
    <button>3 </button>
    <button>4</button>
    <button>5</button>
</div>
<script type= "Text/javascript" >
var fj = document.getElementById ("Div1");
    Fj.onclick = function (ev) {
    console.log (Ev.target.innerHTML)
}
</script>

Closed Package

When to apply closures

var li = 5;
function my () {
    var t = N;
    Console.log (LI); 5
   }
 my ();
 Console.log (t);  The defined
function can directly visit global variables, but it is impossible to access local variables outside of the function. The
closure comes to    

the definition: A closure is a function that is called outside the scope of the function declaration at

Thef () The scope of the function declares that the
Bibao () function called in the scope of the global environment is the closure function
Thef () {
    var thenum =;
    Bibao  This method is a closure, it can return local variables,
    function Bibao () {
        return thenum;
    }
    return Bibao;
}

Console.log (Thef ())
gets
function Bibao () {
    return thenum;
}
Console.log (Thef ()); 
Equivalent to the following form a self-calling function
(function Bibao () {
    return thenum;
} ())
is equivalent to Console.log (Bibao ());

Benefits:

 1. Local variables are not reclaimed by the garbage collection mechanism
 2. The local variables can be accessed outside the function, which is also a bridge between the functions of communication
 3. Want a variable to be stationed in memory for a long time
 4. Avoid global variable pollution, local variable existence

question: Why global variable pollution is avoided.

 1. If you declare a global variable, you can call it anywhere,
 2. If the variable name is too large/the team members work together, the same variable name may be made,
 3. Causes the variable name to be confused, data error
 4. Avoid global variable pollution, the existence of local variables
 5. So we often say: as far as possible to encapsulate the function as a method,
 6. Declare the variable you want to use within the method, avoid the global variable pollution problem

JS garbage collection mechanism
function aaa () {
    var a = 1;
}
AAA (); After the call is finished, the local variable is recycled

self-calling function (immediate execution function)

Model (function () {}) () or  (function () {} ()) for
    (var i = 0; i < divarr.length; i++) {
        (function (Ind)
            { Divarr[ind].onclick = function () {
                console.log (IND);
            };
            Console.log (Ind);//0-8
        }) (i);//Save what you write in i} The
value of each I, through the self-invocation function into the function, so that
the IND is not affected by I, preserving the current I value

two parse self-calling function (immediately executes function expression)
var a = 2;
(function foo () {
    var a = 3;
    Console.log (a); 3
}) ();
Console.log (a); 2
Since the function is contained inside a pair of parentheses, it becomes an expression that
can be executed immediately by adding another () at the end, for example (function foo () {.}). () 。 The first () turns the function into a table
-up, and the second () executes the function. Advanced

Usage: Use them as function calls and pass parameters in.
var a = 2;
(function Iife (global) {
    var a = 3;
    Console.log (a); 3
    Console.log (GLOBAL.A);//2
}) (window);
Console.log (a); 2

Tag Plus Properties

div{$}*10
<script type= "Text/javascript" >
    ------------------------------------------
    // Each label defines an IND attribute to save I, and then uses the IND attribute to retain the value of the current I
    var Divarr = Document.queryselectorall ("div");
    for (var i = 0; i < divarr.length; i++) {
        divarr[i].ind = i;
        Divarr[i].onclick = function () {
            console.log (this.ind);
        }
    }
    or
    //shape as for (Let X ...) Loop creates a new binding for x at each iteration.
    ///equivalent to create a click event for each divarr[i] for
        (Let i = 0; i < divarr.length; i++) {
            Divarr[i].onclick = function () {
  console.log (i)
            }
        }
    //or    Iife will create the scope by declaring and executing a function immediately, passing in the I value. For
    (Let i = 0; i < divarr.length; i++) {
        (function (j) {
            Divarr[j].onclick = function () {
            CONSOLE.L OG (j)
            }}
        ) (i);
    }

Zeptojs here to write the link content zeptojs

Before the JQ is a few m, in the mobile phone use, not very good,
so generally in the PC using JQ, on the mobile side use Zeptojs
because zepto only a few KB, relatively lightweight
now JQ1.3 can also

    $ ("#myDiv"). HTML ("1231231");
    $ ("#myDiv"). On ("click", Function () {
        alert ("1456456");
    })
    var arr = {};
    Console.log ($.isarray (arr));
</script>

anonymous functions are initialized only when they are called

Func ();
        function func () {
            console.log ("123");
        }

Func ();
var func = function () {
    console.log ("456");
    Func is isn't a function
}


----------for


(var i = 0; i < 5; i++) {
setTimeout (function () {
        consol E.log (i);
    } (), 0);
}
Console.log ("SetTimeout");
0 1 2 3 4 setTimeout
call setTimeout and self-invoke function


----------


var timer = setTimeout (function () {
Conso Le.log ("SetTimeout");
},0)
console.log ("12313");
12313 setTimeout

Other execution ends  call setTimeout


----------let


a = 0;
SetTimeout (() =>{
        console.log ("1", a);
    },0);
    Console.log ("2", a);
    A = 2;
    Console.log ("3", a);
 2,0 3,2 1, 2;

var let difference