javascript自执行函数

JavaScript自执行函数(Self-Invoking Function),又叫立即执行函数(Immediately-Invoked Function Expression,IIFE),是一种可以立即自动执行的函数。它的语法结构非常简单:

(function(){
  // code
})();

上述代码定义了一个匿名函数,并立即执行。整个函数块被包含在一对括号中,形成一个表达式,紧随其后的另一对括号表示立即执行该表达式。

自执行函数的特点:

  • 自执行函数可以让函数内部的变量不会被外部引用到,充分实现模块化。
  • 自执行函数形成一个独立的作用域,可以防止变量污染全局。
  • 自执行函数通过return语句可以向外输出变量或函数。

下面是两个使用自执行函数的示例:

示例1:模块化

let module = (function(){
  let name = 'module';
  let version = 1.0;

  function getName() {
    return name;
  }

  function getVersion() {
    return version;
  }

  return {
    getName: getName,
    getVersion: getVersion
  };
})();

console.log(module.getName());  // 输出 "module"
console.log(module.getVersion());  // 输出 1.0

上述代码使用自执行函数模拟了一个模块,内部有私有变量name和version,还有对外暴露的getName和getVersion两个方法。这样可以避免变量名冲突,保证代码的可维护性。

示例2:避免变量污染全局

(function(){
  let name = 'Alice';
  console.log('inner:', name);
})();
console.log('outer:', name);

上述代码中,内部的自执行函数定义了一个变量name并输出,在函数外部输出会报错,因为变量未定义,这样可以避免变量污染全局。

本站文章如无特殊说明,均为本站原创,如若转载,请注明出处:javascript自执行函数 - Python技术站

(0)
上一篇 2023年5月27日
下一篇 2023年5月27日

相关文章

  • JS AJAX前台如何给后台类的函数传递参数

    JS AJAX(Asynchronous JavaScript and XML)使得前端能够异步发起HTTP请求,获取数据,并更新页面,而无需刷新整个页面。在传递参数方面,AJAX提供了多种方式: 通过URL传递参数 通过在URL后面添加查询字符串,即可将参数传递给后台。 let xhr = new XMLHttpRequest(); let url = &…

    JavaScript 2023年6月11日
    00
  • Javascript 获取滚动条位置等信息的函数

    JavaScript 获取滚动条位置等信息的函数可以帮助我们在开发网页时,实现各种复杂的滚动效果。下面,我将为大家详细讲解相关函数的使用方法和示例演示。 获取滚动条位置的函数:scrollY scrollY 函数是用于获取文档的垂直滚动距离的函数。其用法如下: var scrollPos = window.scrollY; 其中,window 是指当前窗口,…

    JavaScript 2023年6月11日
    00
  • 详解webpack打包后如何调试的方法步骤

    当你使用webpack进行打包时,有时候会出现一些问题,此时你需要调试打包后的代码。下面是一些详细的步骤,可以帮助你进行webpack打包后的代码调试。 1. 启用source maps 开启source maps可以让你在浏览器console中看到打包前的代码,这将大大方便你对代码进行调试。 在webpack的配置文件中,可以使用devtool选项来启用s…

    JavaScript 2023年6月10日
    00
  • JavaScript实现与web通信的方法详解

    下面我将详细讲解“JavaScript实现与web通信的方法详解”的完整攻略。 JavaScript实现与Web通信的方法详解 1. HTTP请求 HTTP请求是一种在Web中广泛使用的通信方式。浏览器可以利用XMLHttpRequest对象或fetch API发出HTTP请求,并用于获取Web服务器上的数据。HTTP请求可使用以下方法之一: GET:从指定…

    JavaScript 2023年5月27日
    00
  • js实现酷炫倒计时动画

    下面是“js实现酷炫倒计时动画”的完整攻略。 1. 倒计时的原理 倒计时的实现原理是计算当前时间与目标时间之间的时间差(以秒为单位),然后将时间差转换成时、分、秒等单位,最后将这些单位显示出来。在实现动画效果时,可以将显示的数据和动画效果绑定在一起,通常是通过CSS3中的transition或者动画实现。 2. 实现步骤 2.1 设定目标时间 首先我们需要确…

    JavaScript 2023年6月10日
    00
  • JS co 函数库的含义和用法实例总结

    JS co 函数库的含义和用法实例总结 含义 co 函数库是一个基于生成器的异步流程控制库,它可以让你用更加优雅的方式写异步代码,避免了回调嵌套的问题。co 函数库可以自动将 yield 表达式的返回值封装成 Promise 对象,并使用 Promise 对象来统一处理错误。 安装 在 Node.js 中通过 npm 安装 co 函数库: npm insta…

    JavaScript 2023年5月27日
    00
  • JavaScript获取用户所在城市及地理位置

    JavaScript获取用户所在城市及地理位置可以通过浏览器的Geolocation API或第三方API实现。以下为详细攻略: 1. 使用浏览器的Geolocation API 1.1 获取经纬度 使用Geolocation API可以获取用户的经纬度信息,从而进一步获取用户所在城市等位置信息。 if (navigator.geolocation) { n…

    JavaScript 2023年6月11日
    00
  • 浅析JS中常用类型转换及运算符表达式

    浅析JS中常用类型转换及运算符表达式 类型转换 显式类型转换 字符串转换 使用toString()、String()函数将其他类型转为字符串类型,或使用+运算符将其他类型与字符串拼接即可: var num1 = 123; console.log(num1.toString()); // "123" console.log(String(n…

    JavaScript 2023年5月28日
    00
合作推广
合作推广
分享本页
返回顶部