「这是我参与2022首次更文挑战的第19天,活动详情查看:2022首次更文挑战」。
打算重新按照红宝书过一遍JavaScript了,那就一个一个更新吧。打算做成一个非常非常认真的一个系列,感兴趣的也可以关注一波。
在介绍立即执行函数之前,先补充一波函数知识点
一、函数
1.定义
函数是由事件驱动的或者当它被调用时执行的可重复使用的代码块。
2.定义方式
函数目前定义的方式有三种:函数声明、函数表达式和匿名函数。
2.1函数声明
function(参数:可选){方法体}
function fn(){
console.log("hello")
}
fn()
//输出:hello
函数声明有一个最重要的特征:函数声明提升,它和变量提升差不多。JavaScript引擎在解析代码的时候,函数声明会被提升到该作用域的顶端。也正是因为这个特征,我们可以先使用后声明。如下:
foo("hello")
function foo(message){
console.log(message)
}
//输出:hello
2.2函数表达式
let fn = function(参数:可选){方法体}
var foo = function (){
console.log("hello")
}
console.log(foo())
//输出:hello
函数表达式是没有函数声明提升的,也就是说,不能先使用再定义的。它会抛出一个错误,如下:
foo("hello")
let foo = function (message){
console.log(message)
}
2.3匿名函数
匿名函数属于函数表达式。
function(参数:可选){方法体}
3.作用域
函数针对变量的作用域分为:全局作用域和局部作用域。
- 声明在函数外部的变量作用域是全局。看下面的例子:
var name = "小铃铛的打怪之路"
function fn(){
var name ="不是小铃铛的打怪之路"
console.log(name)
}
fn()
console.log(name)
//输出:
//不是小铃铛的打怪之路
//小铃铛的打怪之路
这个例子可以看出,定义在外部的变量是作用域全局作用域的。
- 声明在函数内部的变量作用域是局部。看下面的例子:
function fn(){
var number = "23"
console.log(number)
}
fn()
console.log(number)
输出
这里不难看出,定义在函数
fn中的变量number,在函数fn外面是拿不到的,会抛出一个错误。
4.生命周期
变量的生命期从他们被声明开始,局部变量会在函数运行后删除,全局变量会在页面关闭后被删除。
看下面的例子:
var name = "小铃铛"
function fn(){
var age = 23
console.log(age)
}
fn()
console.log(name)
//这时的输出结果是:23 小铃铛
下面我们进行验证,我们不关闭页面,但是清楚页面缓存,执行下面的代码
function fn(){
var age = 24
console.log(age)
}
fn()
console.log(name)
//这时的输出结果:24 小铃铛
这个时候我们可以发现,当我们不在定义name这个变量的时候,我们在全局依旧可以拿到这个值。接着我们关闭页面,重新执行下面的代码:
function fn(){
var age = 25
console.log(age)
}
fn()
console.log(name)
//这时的输出结果是:25 ""(这里的输出结果是空,为了表示用空字符串代替)
这三段代码就验证了我们的结论,声明在全局的变量,只有的关闭页面后才会被清除,否则该变量的声明依然没有结束。
立即执行函数
虽然现在
Jquery已经算是退出历史舞台了,但是我们还是可以看见Jquery开篇就是立即执行函数。立即执行函数多用于第三方库,因为第三方库会存在大量的变量和函数,为了不造成变量污染,第三方库的开发者想到的解决办法就是立即执行函数。
下面就具体来看立即执行函数到底是什么吧
1.定义
声明好的函数可以立即执行。
2.语法
立即执行函数有两种写法:
- 第一种是一个被括号包裹的匿名函数,后面再跟随一个括号
(function (参数:可选){方法体})()
- 第二种是一个匿名函数后面跟随一个括号,全部包裹在一个括号里面
(function(参数:可选){方法体}())
3.使用
(function(test){
console.log(test)
})(1234)
输出:1234
(function(test){
console.log(test)
}(1234))
输出:1234
4.好处
我们为什么要使用立即执行函数? 通过定义一个匿名函数,创建了一个新的函数作用域,相当于创建了一个“私有”的命名空间。可以有效的隔离外部或者全局的命名冲突。