学习笔记01-函数,作用域,闭包基础

${var}

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

函数function

像处理(字符串、数组或数字）一样来处理函数
1)存储在变量中。
2)从一个函数返回。
3)作为参数传递给另一个函数

回调函数

接受其他函数作为参数（和/或返回函数，如上一部分所述）的函数被称为高阶函数。作为参数传递给另一个函数的函数被称为回调函数。

数组方法 forEach()遍历数组,map获取数组中元素的详情,filter筛选

forEach()
数组的 forEach() 方法接受一个回调函数，并为数组中的每个元素调用该函数。换句话说，forEach() 让你可以迭代（即遍历）一个数组，类似于使用 for 循环

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

map()
map() 不同于forEach(),会根据回调函数所返回的内容返回一个新的数组。
map() 方法返回一个新的数组，而不会修改原始数组。

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

filter 过滤器
数组的 filter() 方法与 map() 方法类似,

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

作用域

函数的作用域包括：
1)该函数的参数。
2)该函数内部声明的局部变量。
3)来自其父函数作用域的变量。
4)全局变量。
在访问变量时，JavaScript 引擎将遍历作用域链，首先查看最内层（例如函数的局部变量），然后查看外层作用域，最后在必要时到达全局作用域。
变量阴影
当你所创建的变量与作用域链中的另一个变量具有相同名称时
JavaScript 不会弹出错误消息或阻止你创建这样一个变量。实际上，局部作用域的变量只会暂时“遮蔽”外部作用域中的变量。这被称为变量阴影。

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

闭包基础

有权访问另一个函数作用域内变量的函数都是闭包
一个函数引用另外一个函数的变量，因为变量被引用着所以不会被回收，一般可以用来封装一个私有变量
例如:

// 构造函数
function IceCream() {
  this.scoops = 0;
}
// 为 IceCream 添加 addScoop 方法
IceCream.prototype.addScoop = function() {
  setTimeout(function() {
    this.scoops++;
    console.log('scoop added!');
  }, 500);
};
const dessert = new IceCream();
dessert.addScoop(); //500毫秒之后,dessert.scoops任为0

使用闭包

// 构造函数
function IceCream() {
  this.scoops = 0;
}
// 为 IceCream 添加 addScoop 方法
IceCream.prototype.addScoop = function() {
  const cone = this; // 设置 `this` 给 `cone`变量
  setTimeout(function() {
    cone.scoops++; // 引用`cone`变量
    console.log('scoop added!');
  }, 500);
};

const dessert = new IceCream();
dessert.addScoop(); //500毫秒之后,dessert.scoops = 1

立即调用函数表达式(IIFE)

定义之后立即被调用的函数
将一个函数包在圆括号中，然后在末尾添加一对圆括号来调用它

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

IIFE 的主要用途之一就是创建私有作用域
如果你只想完成某个一次性任务（例如初始化应用程序），那么 IIFE 将是完成任务，同时避免额外变量污染全局环境的好办法