一、闭包
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