闭包和回调函数

一、闭包

        1、作用域

                （1）全局作用域：在函数、类的外部声明的变量。具有全局作用域

                （2）局部作用域：函数内部声明的变量（包括函数的形参）

                （3）块级作用域：在语句块中声明的变量

        2、什么是闭包？

                闭包：在一个函数内部创建另一个函数。把内嵌的函数称为闭包，它可以访问外部函数的局部变量

function fun(){
	let k = 0;
	function test(){  //test函数就是一个闭包
		let t = k+14
	}
}
 

        3、闭包的使用场景

                （1）用来返回值：

function fun(){
    let name='baga'
 
    //定义闭包
    return function f1(){
        return name
    }
}
 
let ft=fun()  //因为fun函数的返回值是f1函数，ft实质是一个函数
 
let na=ft()  //调用ft函数，实际调用的就是f1函数
 
console.log(na);

var nAdd;
function out() {
    var n = 999
    nAdd = function () {
        n++
        console.log(n);
    }
    return function () {
        console.log(n);
    }
}
let getN = out()
getN()  //999
nAdd()  //1000
getN()  //1000

                （2）函数赋值：在函数的内部定义函数表达式

var f2
function fn() {
    let name = '熏悟空'
    f2 = function () {  //闭包，将外部函数的name变量作为闭包的返回值。f2是一个函数
        return name
    }
}
fn()  //必须先调用fn函数，否则f2就不是一个函数
console.log(f2());

                （3）把闭包作为函数的参数

function fn() {
    let name = '猪八盖'
    //定义闭包
    return function callback() {
        return name
    }
}
let f1 = fn()  //将fn函数的返回值callback赋给f1
function f2(temp) {
    console.log(temp());  //输出temp函数的返回值。实际调用l闭包callback函数
}
//调用f2函数：将f1最为实参传递给temp
f2(f1)

                （4）在立即执行函数中使用闭包

//立即执行函数
(function () {
    let name = '沙和尚'
    let f1 = function () {  //f1是闭包
        return name
    }
    fn2(f1)  //调用fn2函数，将闭包f1作为实参传递给fn2函数
})()
function fn2(temp) {  //temp是一个形参，接受实参f1
    console.log(temp());  //对temp的调用，实际调用的是闭包f1
}

                （5）在循环中使用闭包

(function fn() {
    for (let i = 1; i <= 10; i++) {
        (function (j) {
            setTimeout(function () {
                console.log(j);
            }, j * 1000)
        })(i)
    }
})()

                （6）将闭包封装到对象中

function fun() {
    let name = '唐僧'
    setName = function (na) {  //setName是闭包：用来设置外部函数的变量
        name = na
    }
    getName = function () {  //getName是闭包：用来返回外部函数的变量
        return name
    }
    //外部fun函数的返回值:将闭包封装到对象返回中
    return {
        setUserName: setName,
        getUserName: getName
    }
}
let obj = fun()  //将fun函数的返回值（对象）赋给obj
console.log('用户名:', obj.getUserName());
obj.setUserName('白骨精')
console.log('用户名:', obj.getUserName());

                （7）通过闭包实现迭代

var arr = ['aa', 'bb', 'cc']
function fn(temp) {  //外部函数的返回值是闭包
    let i = 0
    //定义闭包：迭代获取数组元素并返回
    return function () {
        return temp[i++] || '数组已经遍历结束'
    }
}
let f1 = fn(arr)
console.log(f1());
console.log(f1());
console.log(f1());
console.log(f1());

        注意：

                （1）搞清楚谁是闭包函数

                （2）闭包的返回值、外部函数的返回值

二、回调函数

        1、什么是回调函数？

                将函数B作为实参传递给函数A，那么把函数B称为回调函数，也称为高阶函数。表示某个函数定义完成之后并不立即执行，而是在完成某些操作之后在来调用该函数。

function B(){}  //定义B函数
function A(args){}  //定义A函数
A(B)  //调用A函数，将函数B作为实参传递给A函数。将B函数称为回调函数

        2、回调函数的使用

                （1）先定义回调函数，在主调函数中传递回调函数的函数名

function print(num) {
    console.log(num);
}
function add(n1, n2, callback) {  //三个参数，n1和n2是普通参数，参数callback对应的是函数
    let s = n1 + n1;
    callback(s);
}
add(12, 23, print);  //将print函数传递给形参callback。print函数就是回调函数

                （2）定义匿名回调函数

function add(n1, n2, callback) {
    let s = n1 + n2
    callback(s)
}
add(12, 23, function (num) {  //调用add函数时，给它传递一个匿名的函数（该函数就是回调函数）
    console.log(num);
})

        3、回调函数的特点

                （1）不会立即执行：在主调函数中执行中回调函数时必须带"()"，若有参数则需要传递参数

                （2）回调函数是一个闭包：它可以访问主调函数中的变量

                （3）执行前的类型判断：在主调函数中执行回调函数之前，建议判断回调函数是否是函数

function print(num) {
    console.log(num);
}
function add(n1, n2, callback) {  //三个参数，n1和n2是普通参数，参数callback对应的是函数
    let s = n1 + n1;
    if (typeof callback === 'function') {
        callback(s)
    } else {
        console.log('第三个参数必须是函数');
    }
}
//add(12, 23, print);  //将print函数传递给形参callback。print函数就是回调函数
add(12, 23, 34)

                （4）回调函数中this指向的问题

function creatDate(callback){  //createDate是主调函数，callback是回调函数
    callback();
}
let obj={
    date:100,
    tool:function(){
        creatDate(function(){
            console.log(this,1111);  //this指向window对象，为什么this指向window对象？
        })
    }
}
obj.tool();  //window  1111

                （1）使用箭头函数

function creatDate(callback){  //createDate是主调函数，callback是回调函数
    callback();
}
let obj={
    date:100,
    tool:function(){
        creatDate(()=>{
            console.log(this,1111);  //this指向obj对象
        })
    }
}
obj.tool();  // { date: 100, tool: [Function: tool] } 1111

                （2）在回调函数之前，定义一个变量将this保存起来

function creatDate(callback){  //createDate是主调函数，callback是回调函数
    callback();
}
let obj={
    date:100,
    tool:function(){
        let self=this  //定义self将this保存起来
        creatDate(function(){
            console.log('回调函数',self);  //sekf指向obj对象
        })
    }
}
obj.tool();  // {date: 100, tool: ƒ}

        5、JavaScript中使用回调函数的原因

                JavaScript是一个事件驱动型的语言。在程序的执行过程中不会因为某一次的响应没有完成而停止程序，而是继续监听后续的事件，如果后续事件的某个时间被触发，则程序继续执行

三、Node的包管理器

        1、npm：Node Package Manager，是Node.js的默认的包管理器。在开发node程序时，管理第三方的模块

                （1）常用指令：

                        npm -v ：查看版本号

                        npm i -g npm to update :更新npm到最新版本。（参数i表示install，参数g表示global）

                        npm install -g npm@版本号：更新npm到指定版本

                        npm install 包名 -g：表示全局安装到指定的包

                        npm install 包名：表示局部安装指定的包

                        npm uninstall 包名：表示卸载指定的包

                （2）设置淘宝镜像的方式

                        第一种：npm install -g cnpm --registry =https://registry.npmmirror.com（npm创建淘宝镜像）

                        在项目中安装包（第三方功能模块）的方式有两种

                                a、npm install 包名(模块名) --- 从国外的npm服务器上下载需要安装的模块

                                b、cnpm install 包名(模块名) --- 从淘宝镜像的服务器上下载需要安装的模块

                        第二种：npm config set registry =https://registry.npmmirror.com --- 将npm的服务器地址重定向的淘宝镜像

                        在项目中安装包（第三方功能模块）的方式只有一种

                                npm install包名(模块名)

                                npm config delete registry(恢复原地址) --- 将npm服务器地址恢复成默认的地址

                                npm config get registry（查看当前仓库配置）--- 显示npm服务器的地址

        2、yarn包管理器：快速、安全、可靠的依赖包管理工具

                （1）安装：npm install yarn -g

                （2）查看版本号：yarn -v

                （3）使用yarn安装包：yarn add 包名(nodemon)

                （4）将服务器的地址重新定位到淘宝镜像

                                yarn config set registry =https://registry.npmmirror.com

                （5）使用yarn卸载安装的包

                                yarn remove nondemon