自调用(自执行)函数的五种写法

定义函数的方式分为两种，一种是函数的声明，另一种是函数表达式(也叫匿名函数)。请看下面的例子：

//第一种：函数的声明 需要函数名
function func() {
	console.log("我是第一种定义函数的方式");
};

//第一种：函数表达式(匿名函数) 需要定义变量接收
const aa = function (){
	console.log("我是第二种定义函数的方式");
};

在js中常有需要函数自调用的情况，自调用的函数一般都是匿名函数，所以这里也称为匿名函数的自调用(自执行)。

在写自调用函数时，经常出现下面的错误代码:

//下面的代码在编辑器中报错
function () {
	console.log(111);
}();

原因是function () {console.log(111);}被当成了函数声明，而不是一个函数表达式，让后面的"();"变得孤立,从而产生语法错误。我们要解决的就是让function () {console.log(111);}是一个函数表达式，而不是函数声明语句。

方法1(推荐)： 最前面和最后加上小括号(jslint推荐的写法)

// 没有参数的情况
(function () {
    console.log(111);
}());

// 有参数的情况
(function (形参1, 形参2) {
    // 函数体
}(实参1, 实参2));

需要注意的是： 如果写代码不喜欢在行后加分号，也会出现问题，例如以下代码会报运行错：

var a = 90
(function () {
	console.log(a);
}());

方法2： function外面加括号

//没有参数的情况
(function () {
    console.log(222);
})();

//有参数的情况
(function (形参1, 形参2) {
    //函数体
})(实参1, 实参2);

方法3：最前面和最后加上中括号

//没有参数的情况
[function () {
    console.log(333);
}()];

//有参数的情况
[function (形参1, 形参2) {
    //函数体
}(实参1, 实参2)];

方法4： function前面加运算符 ，常用的是!、-、+

//没有参数的情况
!function () {
	console.log(444);
}();

//有参数的情况
!function (形参1, 形参2) {
	//函数体
}(实参1, 实参2);

方法5： function前面加void

//没有参数的情况
void function () {
	console.log(555);
}();

//有参数的情况
void function (形参1, 形参2) {
	//函数体
}(实参1, 实参2);

今天的分享就到这里啦~~

如有错误，欢迎随时雅正。