JS Learning Note 01-functions, scopes, closures

${var}

//变量的占位符, ${}里边 依旧是js,字符串拼接var str1 = "Hello";var str2 = "World";console.log("say: "+str1+" "+str2+"!");console.log(`say: ${str1} ${str2}!`);

Functional function

Handle functions like a string, array, or number
1) stored in the variable.
2) return from a function.
3) passed as a parameter to another function

callback function

Functions that accept other functions as arguments (and/or return functions, as described in the previous section) are called higher-order functions. A function passed as a parameter to another function is called a callback function.

Array Method ForEach () iterates through the array, map gets the details of the elements in the array, filter filters

ForEach ()
The ForEach () method of the array accepts a callback function and calls it for each element in a group. In other words, ForEach () allows you to iterate (that is, iterate) an array, similar to using a For loop

[1, 5, 2, 4, 6, 3].forEach(function logIfOdd(n) {  if (n % 2 !== 0) {    console.log(n);  }});// 1 //5//3function logIfOdd(n) {  if (n % 2 !== 0) {    console.log(n);  }    }[1, 5, 2, 4, 6, 3].forEach(logIfOdd);

Map ()
Unlike foreach (), map () returns a new array based on what the callback function returns.
The map () method returns a new array without modifying the original array.

var arrayName = ["fish","sugarbeans","theredhands"];var arrayNameLength = arrayName.map(function(name){    return name.length;})console.log(arrayNameLength);//[4,10,11]

Filter Filters
The filter () method of the array is similar to the map () method,

var arrayNewName = arrayName.filter(function(name){    return name.length>6;})console.log(arrayNewName);

Scope

The scope of the function includes:
1) The parameters of the function.
2) Local variables declared inside the function.
3) A variable from its parent function scope.
4) Global variables.
When accessing a variable, the JavaScript engine traverses the scope chain, first looking at the outermost layer (for example, the function's local variable), then looking at the outer scope, and finally reaching the global scope if necessary.
Variable Shadow
When you create a variable with the same name as another variable in the scope chain
JavaScript does not eject the error message or prevent you from creating such a variable. In fact, a variable in a local scope only temporarily "obscures" the variables in the outer scope. This is called a variable shadow.

let n = 2;function myFunction() {  let n = 8;  console.log(n);}myFunction();// 8

Closed Package

Closure--The combination of the function and the lexical context of the function declaration location
1) Each time a function is defined, a closure is created for the function
2) The function maintains a reference to its parent scope, and if the reference to the function is still accessible, the scope remains unchanged
3) closure mechanism similar to Java private properties

function count() {    var arr = [];    for (var i=1; i<=3; i++) {        arr.push(function () {            return i * i;        });    }    return arr;}var results = count();var f1 = results[0]; //()=>16var f2 = results[1]; //()=>16var f3 = results[2]; //()16

Call function expression immediately (iife)

Functions that are called immediately after the definition
Wrap a function in parentheses and then add a pair of parentheses at the end to invoke it

(function sayHi(){    alert(‘Hi there!‘);  })();    //带参数(function (x, y){    console.log(x * y);  })(2, 3);   // 6

One of the main uses of Iife is to create private scopes
If you only want to complete a one-off task (such as initializing an application), then Iife will be a good way to complete the task while avoiding the extra variables that pollute the global environment

JS Learning Note 01-functions, scopes, closures