变量的作用域无非就是两种:全局变量和局部变量。
Javascript语言的特殊之处,就在于函数内部可以直接读取全局变量。
Js代码
var n=999
function f1(){
alert(n)
}
f1()// 999
另一方面,在函数外部自然无法读取函数内的局部变量。
Js代码
function f1(){
var n=999
}
alert(n)// error
这里有一个地方需要注意,函数内部声明变量的时候,一定要使用var命令。如果不用的话,你实际上声明了一个全局变量!
Js代码
function f1(){
n=999
}
f1()
alert(n)// 999
--------------------------------------------------------------------------------------------------------
二、如何从外部读取局部变量?
出于种种原因,我们有时候需要得到函数内的局部变量。但是,前面已经说过了,正常情况下,这是办不到的,只有通过变通方法才能实现。
那就是在函数的内部,再定义一个函数。
Js代码
function f1(){
n=999
function f2(){
alert(n)// 999
}
}
在上面的代码中,函数f2就被包括在函数f1内部,这时f1内部的所有局部变量,对f2都是可见的。但是反过来就不行,f2内部的局部变量,对f1 就是不可见的。这就是Javascript语言特有的“链式作用域”结构(chain scope),
子对象会一级一级地向上寻找所有父对象的变量。所以,父对象的所有变量,对子对象都是可见的,反之则不成立。
既然f2可以读取f1中的局部变量,那么只要把f2作为返回值,我们不就可以在f1外部读取它的内部变量了吗!
Js代码
function f1(){
n=999
function f2(){
alert(n)
}
return f2
}
var result=f1()
result()// 999
--------------------------------------------------------------------------------------------------------
三、闭包的概念
上一节代码中的f2函数,就是闭包。
各种专业文献上的“闭包”(closure)定义非常抽象,很难看懂。我的理解是,闭包就是能够读取其他函数内部变量的函数。
由于在Javascript语言中,只有函数内部的子函数才能读取局部变量,因此可以把闭包简单理解成“定义在一个函数内部的函数”。
所以,在本质上,闭包就是将函数内部和函数外部连接起来的一座桥梁。
回调函数概念: 函数的参数callback是另一个参数,这个参数在原始数据中执行
例如:
let arr = [11, 22, 33, 44, 55, 66, 77, 88, 99]
function liFor(arr, callback) {
for (let i = 0i <arr.lengthi++) {
if (callback(arr[i])) {
console.log(arr[i])
}
}
}
console.log('---------遍历数组----------')
liFor(arr, val =>true)
console.log('---------输出奇数----------')
liFor(arr, val =>val % 2 !== 0)
console.log('---------输出被3整除----------')
liFor(arr, val =>val % 3 === 0)
console.log('---------输出被3和6整除----------')
liFor(arr, val =>val % 3 === 0 &&val % 6 === 0)
闭包函数概念:定义一个a方法,在a方法中定义一个b方法,并且b方法里面用到了a方法里面定义的变量,那么此时就形成了闭包函数,由于内部方法里面,用到外部方法里面的变量,外部方法里面的那个变量会一直在内存中存保存着。两个方法嵌套定义,里面的方法,用到了外面方法里面定义的变量,此时这两个方法就形成了闭包。
例如:
function a() {
console.log('a函数被调用了...')
let num1 = 100
let num2 = 200
function b() {
console.log('b函数被调用了...')
console.log(num1 + num2)
}
//返回的返回值也是一个函数,那么a函数就是高阶函数。
return b
}
// 通常情况下,函数执行完成后,函数里面定义的变量,会被销毁。
// a函数,已经调用完毕了,但是a函数里面定义变量,始终在内存中,因为b函数中用到了a函数中定义的变量。
// 那么此时这两个函数,就称之为:闭包函数。
let c = a()
c()
console.log('------------------------------------------')
// 闭包函数的实际案例
function calc(num1, num2, type) {
switch (type) {
case '+':
console.log(`${num1}+${num2}=${num1 + num2}`)
break
case '-':
console.log(`${num1}-${num2}=${num1 - num2}`)
break
}
}
// 在实际开发中,我们在做num1和num2的计算之前,可能需要先做其他事情
let num1 = 100
let num2 = 50
// 在做其他事情的过程中,我们的数据很有可能会被篡改。
console.log('查看用户是否登录')
num1 = 555
num2 = 145
console.log('检查用户的权限')
calc(num1, num2, '+') //运行结果不对,因为变量的值被篡改了。
console.log('------------------------------------------')
// 定义一个闭包函数,实现计算器功能
function myCalc(num1, num2, type) {
switch (type) {
case '+':
return function() {
return num1 + num2
}
case '-':
return function() {
return num1 - num2
}
}
}
//先准备好你的数据
let n1 = 100
let n2 = 50
//将你的数据传给计算器方法,由计算器方法,返回一个计算方法。
let js = myCalc(n1, n2, '+')
//在做具体的计算之前,还先做些其他的事情
console.log('查看用户是否登录')
n1 = 555
n2 = 145
console.log('检查用户的权限')
//其他事件准备好了后,执行计算方法
console.log(js())