书法字典:https://www.shufadict.com

javascript定义函数后立即执行(IIFE)

Talk is cheap, show me the code.

// Immediately Invoked Function Expression - IIFE
// 定义后立即执行的JavaScript函数。

// 基本语法,将函数定义在()内部,最后附加()执行函数。
// 一个小技巧,先写下两个(), 然后第一个()内添加函数定义,第二个()添加调用参数。

// 无参数的情况
(function () {
  console.log("I am running immediately after define");
})();


// 有参数的情况
(function(a, b) {
  console.log(a + " + " + b + " = " + (a + b));
})(1, 2);


// 使用箭头函数,无参
(() => {
  console.log("IIFE with arrow function")
})();

// 使用箭头函数,有参。(如果箭头函数体内只有一行代码,那么return和{}可以省略)
((a, b) => console.log(a + b))(1, 2);


// 变种写法,第二个()也可以写在第一个()内部结尾处,但是这种写法不支持箭头函数哦。
(function () {
  console.log("another way...")
}());

// 使用一元运算符也可以创建IIFE,这种写法在实际应用中不常见。
!(function() {
  console.log("IIFE with !")
})();

~(function() {
  console.log("IIFE with ~")
})();

+(function() {
  console.log("IIFE with +")
})();

-(function() {
  console.log("IIFE with -")
})();

// IIFE也可以为函数取名字,但是这个名字没啥用,因为你不能使用名字调用该函数。
(function test() {
  console.log("IIFE with name...");
})();

// 为了防止合并javascript文件出错,有时候要在函数前面加分号,表示前面语句结束,这是一个新的开始。详见https://www.cnblogs.com/daysme/p/6440012.html
// 为什么要合并js文件呢?很多打包工具如webpack为了减少bundle体积,都会合并js文件,形成一个大的chunk.js,大家都不陌生吧。
;(function () {
  console.log("I am a new start");
})();

== The End ==

posted on 2020-08-08 19:31  翰墨小生  阅读(813)  评论(0编辑  收藏  举报

导航

书法字典:https://www.shufadict.com