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实现数码表特效

    原生 JS 实现数码表特效攻略 概述 该攻略是使用原生 JS 实现数码表特效的完整教程。该特效是指数字从 0 变化到目标数字,即数码表翻滚特效。 实现步骤 首先,我们需要在 HTML 中创建一个数码表的结构,包括外层容器和数字容器。HTML 结构如下: <div class="counter"> <div class=&…

    JavaScript 2023年6月11日
    00
  • javascript中神奇的 Date对象小结

    让我用Markdown格式为您撰写关于“javascript中神奇的 Date对象小结”的完整攻略吧。 JavaScript中神奇的Date对象小结 Date对象时JavaScript中用来处理日期和时间的内置对象,它允许我们创建、操作和格式化日期和时间。在这份攻略中,我们将深入了解Date对象的相关应用。 创建Date对象 要创建Date对象,我们简单地使…

    JavaScript 2023年6月10日
    00
  • JavaScript解决Joseph问题

    JavaScript解决Joseph问题是一道经典的计算机问题,也被称为约瑟夫问题。问题的描述是:一群人围成一个圆圈,从某个人开始,依次报数,每次报数到某个数字时,就将此人从圆圈内删除,直到最后只剩下一个人。这道题的具体解法涉及到递归算法和循环算法,本文将会详细介绍这两种算法的思路和代码实现。 递归算法解决Joseph问题 递归算法是解决Joseph问题的经…

    JavaScript 2023年6月11日
    00
  • js中style.display=””无效的解决方法

    当我们在JavaScript脚本中尝试用 style.display 修改元素的CSS display属性时,有时候会出现无效的情况。这个问题的原因在于,display属性存在一些特殊的值,例如 none 或 inline,与CSS样式表中定义的属性不同。 处理这个问题的方法有以下几种: 1. 使用CSS class 在CSS样式表中定义一个类,该类包含特定…

    JavaScript 2023年6月11日
    00
  • JavaScript 高级语法介绍

    JavaScript 高级语法介绍攻略 什么是 JavaScript 高级语法? JavaScript 高级语法是指相对于语言基础而言更深入、更难掌握的语言知识部分。学习 JavaScript 高级语法可以帮助开发者更加灵活地运用 JavaScript 编程语言,实现更复杂、更高级的功能。 JavaScript 高级语法包括哪些? JavaScript 高级…

    JavaScript 2023年5月18日
    00
  • JS动态添加iframe的代码

    下面详细讲解一下“JS动态添加iframe的代码”的完整攻略。 什么是iframe? iframe (即内嵌框架) 是 HTML 语言中一种非常强大的标签,可以将一个HTML文档文件嵌入到另一个 HTML 文档中,以达到创建分页面的效果。 如何动态添加iframe 在 JavaScript 中,可以通过以下代码,动态地添加 iframe: var ifram…

    JavaScript 2023年6月11日
    00
  • JavaScript实现form表单的多文件上传

    使用 JavaScript 实现 form 表单的多文件上传,需要按照以下步骤进行: HTML 部分 在 HTML 中添加表单和 input 元素,其中 input 的 type 属性为 file,multiple 属性为 true,表示支持选择多个文件。例如: <form id="form_upload" method=&quot…

    JavaScript 2023年5月27日
    00
  • JS日期控件My97DatePicker基本用法

    以下是JS日期控件My97DatePicker基本用法的完整攻略。 一、My97DatePicker是什么 My97DatePicker是一款轻便好用的日期控件,可以自由定制样式,并支持所有主流的浏览器。 二、基本用法 1. 引入My97DatePicker 在文档的标签中插入以下代码,即可引入My97DatePicker: <link rel=&qu…

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