写在前面 今天说一下什么是IIFE函数，为什么说这个，几个原因，一个是想总结一下，第二个是面试的时候确实会问到，考验功底的时候到了，所以这里还是作为一种记录的方式给大家说一下！...解释 IIFE 是Immediately Invoked function expression的缩写，意思就是立即执行函数表达式 隐藏实现：系统看不到我们的函数，但是我们却可以用它实现逻辑功能 举例子...js中有一个很有意思的点，在于如果你想声明一个函数，比如我们经常的做法如下： function _test() { console.log("我是一个js函数") } let _test...() 回到主题，IIFE函数其实就是一个自执行函数，代码如下： (function () { console.log("我是一个IIFE函数") })() 解释一下这里为什么要使用一个小括号将函数包裹起来...费那劲，是的，但是假设我想页面上只用一个变量进行完成业务逻辑该怎么做呢？可能这里不是很明白，说人话就是我不想定义全局变量，但是我又想自执行一个函数怎么办？
html的标签的属性，比如id、class、href需要动态传递参数，拼接字符串，查了一些资料，并没有找到合适的解决方法，琢磨了一上午，终于试出了方法： v-bind:属性=“ ‘字符串’+自定义变量名
type="text/javascript"> console.log(foo); var foo = 1; console.log(foo); function foo () { } 其实，在浏览器解析js...代码的过程中，会有一个预编译的过程，遇到function 函数定义的部分，会先将该部分的代码提前，所以我们在第一个console.log(foo)中，会打印出function foo(){}，第二个和第三个...foo被变为1，所以会打出来1 我们如果将var变成let，大家应该能想到会报错，ES6规定let定义的变量不需要重复定义，但是聪明的你知道是哪里报的错吗 ?
在一些程序的操作中，都需要把一串长长的字符串，按照某一个字符把其分割成数组，然后再给数组进行排列或是任意组合，亦或者单独输出某一部份。...当然在js中也给我们提供好了函数，来把一串字符串进行分割成数组，已便于我们方便的组合或输出。 javascript中split定义与语法 定义 split() 方法用于把一个字符串分割成字符串数组。...关于sqlit的示例 利用javascript中的split分割一个字符串 代码 var str = "2,2,3,5,6,6"; //这是一字符串 var strs = new Array(); /...给果会输出：2 2 3 5 6 6 利用JS的split函数分割一段英文，为单字母显示 代码 var str = "How ary you"; //这是一字符串 var strs = new Array
常常使用此模式来避免污染全局命名空间，因为在IIFE中使用的所有变量(与任何其他普通函数一样)在其作用域之外都是不可见的。 问题 3：何时在 ES6 中使用箭头函数？...const 声明一个只读的变量，一旦声明，常量的值就不可改变： ? Object.freeze适用于值，更具体地说，适用于对象值，它使对象不可变，即不能更改其属性。 ?...问题 11: JS 的提升是什么 主题: JavaScript 难度: ⭐⭐⭐⭐ 提升是指 JS 解释器将所有变量和函数声明移动到当前作用域顶部的操作，提升有两种类型 变量提升 函数提升 只要一个var...弱引用意味着如果对象被销毁，垃圾收集器将从WeakMap中删除整个条目，从而释放内存。 问题 16: 说明下列方法为何不能用作 IIFE，要使其成为 IIFE，需要进行哪些更改？...问题 20: 如何在 JS 中“深冻结”对象 主题: JavaScript 难度: ⭐⭐⭐⭐⭐ 如果咱们想要确保对象被深冻结，就必须创建一个递归函数来冻结对象类型的每个属性： 没有深冻结 ?
/myModule'; 问题 2：什么是 IIFE (立即调用的函数表达式) 主题: JavaScript 难度: ⭐⭐⭐ IIFE是一个立即调用的函数表达式，它在创建后立即执行 (function IIFE...常常使用此模式来避免污染全局命名空间，因为在IIFE中使用的所有变量(与任何其他普通函数一样)在其作用域之外都是不可见的。 问题 3：何时在 ES6 中使用箭头函数？...就像展开语法的逆过程一样，它将数据放入并填充到数组中而不是展开数组，并且它在函数变量以及数组和对象解构分中也经常用到。...的提升是什么 主题: JavaScript 难度: ⭐⭐⭐⭐ 提升是指 JS 解释器将所有变量和函数声明移动到当前作用域顶部的操作，提升有两种类型 变量提升 函数提升 只要一个var(或函数声明)出现在一个作用域内...弱引用意味着如果对象被销毁，垃圾收集器将从WeakMap中删除整个条目，从而释放内存。 问题 16: 说明下列方法为何不能用作 IIFE，要使其成为 IIFE，需要进行哪些更改？
/myModule'; 问题 2：什么是 IIFE (立即调用的函数表达式) 主题: JavaScript难度: ⭐⭐⭐ IIFE是一个立即调用的函数表达式，它在创建后立即执行 (function IIFE...常常使用此模式来避免污染全局命名空间，因为在IIFE中使用的所有变量(与任何其他普通函数一样)在其作用域之外都是不可见的。 问题 3：何时在 ES6 中使用箭头函数？...就像展开语法的逆过程一样，它将数据放入并填充到数组中而不是展开数组，并且它在函数变量以及数组和对象解构分中也经常用到。...的提升是什么 主题: JavaScript难度: ⭐⭐⭐⭐ 提升是指 JS 解释器将所有变量和函数声明移动到当前作用域顶部的操作，提升有两种类型 变量提升 函数提升 只要一个var(或函数声明)出现在一个作用域内...弱引用意味着如果对象被销毁，垃圾收集器将从WeakMap中删除整个条目，从而释放内存。 问题 16: 说明下列方法为何不能用作 IIFE，要使其成为 IIFE，需要进行哪些更改？
js的立即执行函数（IIFE）有两种写法，分别为：(function ( ){})( ) 与 (function ( ){}( )) ，这两种写法基本上是没有区别的。 那么为什么要 IIFE？...1.传统的方法啰嗦，定义和执行分开写； 2.传统的方法直接污染全局命名空间（浏览器里的 global 对象，如 window） 函数范围与块范围界定 使用var关键字声明的局部变量的作用域为封闭函数。...假设我们要创建一个函数uniqueId，每次调用它时都会返回一个唯一标识符（如“id_1”，“id_2”等）。在IIFE中，我们将跟踪每次调用计数器函数时递增的私有计数器变量。...为了解决命名冲突问题，可以将一段代码封装在一个IIEF中，将一个全局变量（比如，jQuery）作为参数传入IIFE。...但是在Node.js中，全局对象是global。
作用域 作用域指变量所作用的范围，在 Javascript 中有两种作用域： 全局作用域 函数作用域 变量提升 变量提升（Hoisting）被认为是， Javascript 中执行上下文 （特别是创建和执行阶段...我们可以利用这个特性来替代立即执行函数（IIFE）。...事实上，当 JS 引擎检视下面的代码块有变量声明时，对于 var 声明的变量，会将声明提升到函数或全局作用域的顶部，而对 let 或 const 的时候会将声明放在暂时性死区内。...任何在暂时性死区内访问变量的企图都会导致“运行时”错误（runtime error）。只有执行到变量的声明语句时，该变量才会从暂时性死区内被移除并可以安全使用。...在默认情况下使用 const ，而只在你知道变量值需要被更改的情况下才使用 let 。这在代码中能确保基本层次的不可变性，有助于防止某些类型的错误。 思考题 两个思考题，我会把答案放在评论中。
概念介绍 立即调用的匿名函数又被称作立即调用的函数表达式（IIFE），它类似于函数声明，但由于被包含在括号中，所以会被解释为函数表达式。...紧跟在第一组括号后面的第二组括号会立即调用前面的函数表达式，位于IIFE中的代码在其外部是无法访问的。...实现私有变量 IIFE可以返回一个函数引用，当这个函数在IIFE的词法范围外执行，也会创建一个闭包，使函数能够访问局部变量。...之外无法访问函数内部的count变量，除了从IIFE中返回的函数，别处无法读写该变量，这样就能创建真正的私有状态变量。...为了解决命名冲突问题，可以将一段代码封装在一个IIFE中，将一个全局变量（比如Jquery）作为参数传入IIFE，在函数内部，就可以以一个任意的参数名（比如 $）来访问该参数值，我们举个例子来说明下，如下所示
在 JavaScript 中，闭包会随着函数的创建而被同时创建 确实不是很好理解，那么我来通俗讲一下。...闭包其实就是指在函数内部定义一个函数， 内部定义的函数可以访问外部函数作用域中的变量， 这样就形成了一个封闭的作用域，被称作闭包。 即使外部函数已经执行完毕，闭包仍然可以访问这些变量。...这样我们就可以在函数外部 使用一个函数内的变量。 闭包还可以用来创建“私有”变量和方法，提高代码的封装性和安全性。 闭包 最根本的作用就是实现函数内变量的一个长期存储，让它不会被销毁。...innerFunction() { outerVariable++ console.log(outerVariable); } return innerFunction; } //在函数执行完毕后用过一遍的变量一般都会被垃圾回收机制中的标记清除算法销毁掉...innerFunc(); 1 innerFunc(); 2 const innerFunc2 = outerFunction(); innerFunc2(); 1 innerFunc2(); 2 `` 如何在函数外部修改闭包中变量
由于篇幅过长，我将此系列分成上中下三篇，上篇： 看完这几道 JavaScript 面试题，让你与考官对答如流（上） 26. 什么是IIFE，它的用途是什么？ 27....倒数第二个救命表明我们可以将参数传递给IIFE函数。 最后一个示例表明，我们可以将IIFE的结果保存到变量中，以便稍后使用。...IIFE的一个主要作用是避免与全局作用域内的其他变量命名冲突或污染全局命名空间，来个例子。...我们要声明了graphUtility 变量，用来保存IIFE执行的结果，该函数返回一个包含两个方法createGraph和drawGraph的对象。...因此，JS引擎在这个函数外创建了一个全局变量b，之后表达式b = 0的返回值为0，并赋给新的局部变量a。 我们可以通过在赋值之前先声明变量来解决这个问题。
main.js 文件所示，包含三块内容，从上到下分别为： name.js 模块对应的转译产物，函数形态 Webpack 按需注入的运行时代码 index.js 模块对应的转译产物，IIFE(立即执行函数...、功能均相同，但表现形式发生了较大变化，例如 index.js 编译前后的内容： 上图右边是 Webpack 编译产物中对应的代码，相对于左边的源码有如下变化： 整个模块被包裹进 IIFE (立即执行函数...__ 函数调用 源码 console 语句所使用的 name 变量被转译为 _name__WEBPACK_IMPORTED_MODULE_0__.default 添加注释 那么 Webpack 中如何执行这些转换的呢...__ 对象，对象的 key 为模块标志符；值为模块转译后的代码 一个极度简化的 CMD 实现：__webpack_require__ 函数 最后，一个包裹了 entry 代码的 IIFE 函数 「模块转译...JavascriptModulesPlugin 内置的打包函数有： renderMain：打包主 chunk 时使用 renderChunk：打包子 chunk ，如异步模块 chunk 时使用 两个打包函数实现的逻辑接近
像前端中常用到的jQuery框架，就可以被视为一个公共模块，jQuery封装并简化了一系列常用的js操作，轻量级，功能强大，而且不会污染全局变量(所有的方法都只能通过jQuery对象调用)，可以说是一个非常优秀的模块...除此之外，模块化还可以带来不污染全局变量的效果。...Web页面不复杂的情况下，我们可以任性的在全局环境下定义变量和函数，但在前端日益复杂化的今天，全局变量污染往往会带来命名冲突的问题，项目持续时间越久，累计的问题就会越多，维护的成本也就越高。...typescript中的模块编译后生成的javascript代码符合IIFE模式 IIFE模式是现代模块化工具的基石，其引入参数的过程，是实现现代js模块化依赖注入的基本方式。...requirejs提供的baseUrl可以很好的解决这个问题，只需要重新设置baseUrl就可以不用更改配置文件中的每一条path。 paths: paths定义每个模块的路径。
; console.log(this.variable); // “我是一个全局变量！” 在这里，当我们声明变量时，它被附加到 window 对象上。...因此，在全局上下文中使用this.variable 会给我们那个变量的值。 在Node.js中： 如果你在Node.js环境中运行你的代码，情况会有所不同。...在Node.js中，this 的顶级值是一个空对象，不等同于 global。 console.log(this); // {} global.globalVar = “我在Node中的全局对象上！”...它舒适地使用 printActivities 中的 this。没有戏剧。 但有一个问题 箭头函数有点固执。我们用来为常规函数设置 this 的方法，如 call、apply或bind？...在IIFEs中：this 的独特角色 在我们深入了解IIFE中的 this 之前，让我们澄清一下什么是IIFE。想象一下：你刚写了一个函数，而在你有机会坐下来欣赏你的作品之前，它已经开始工作了。
Rollup的基本使用 rollup.js是一个模块打包工具，可以使项目从一个入口文件开始，将所有使用到的模块文件都打包到一个最终的发布文件中，Rollup极其适合构建一个工具库，Vue.js源码就是通过...描述 rollup对代码模块使用新的标准化格式，这些标准都包含在JavaScript的ES6版本中，而不是以前的特殊解决方案，如CommonJS和AMD等，也就是说rollup使用ES6的模块标准，这意味着我们可以直接使用...rollup实现了另一个重要特性叫做tree-shaking，这个特性可以帮助你将无用代码，即没有使用到的代码自动去掉，这个特性是基于ES6模块的静态分析的，也就是说，只有export而没有import的变量是不会被打包到最终代码中的...iife: 一个自动执行的功能，适合作为script标签这样的，只能在浏览器中运行。 umd: 通用模块定义，以amd、cjs和iife为一体。 system: SystemJS加载器格式。...当format类型为iife或者umd格式的时候需要配置output.globals选项参数以提供全局变量名来替换外部导入。
在下列代码中，标准浏览器下f()函数和IIFE都返回'bar'，但IE10-浏览器中的f()函数返回'abc' var foo = "abc"; with({ foo:"bar" }){...将变量a更改为函数的自定义属性更为恰当 function add(){ return ++add.count; } add.count = 0; console.log(add());//1 console.log...在javascript中，每一个函数在被调用的时候都会创建一个执行上下文，在该函数内部定义的变量和函数只能在该函数内部被使用，而正是因为这个上下文，使得我们在调用函数的时候能创建一些私有变量。...(function(){ /* code */ }()); // 老道推荐写法 (function(){ /* code */ })(); // 当然这种也可以 // 括号和JS的一些操作符（如...其实现在也不用去管它了，就叫IIFE好了。 最后的旁白：模块模式 立即执行函数在模块化中也大有用处。用立即执行函数处理模块化可以减少全局变量造成的空间污染，构造更多的私有变量。
IIFE（Immediately Invoked Function Expression），中文一般翻译为匿名立即执行函数 IIFE详解 构成 IIFE包含两部分。...第一部分是一个匿名函数，它包裹在分组操作符()中，拥有独立的词法作用域。 第二部分是再一次使用分组操作符()，创建一个立即执行函数表达式。Javascript引擎到此将立即执行函数。...大体结构如下所示： ;(function(){ // code })(); 优点 匿名函数中的变量和方法，不能从外部访问 (function () { var name = 'wall...匿名函数中可以正常访问更高词法作用域中的变量和方法 // 浏览器环境下 var name = 'wall'; (function(){ console.log(name); // 在控制台正常输出...IIFE在lodash中的应用 先上源码： ;(function(){ // code }.call(this))(); 第一个;的作用 工具库的源码，一般都是;开始。
1、立即执行函数 立即执行函数，英文为Immediately Invoked Function Expression，简称为IIFE。...通常结构如下： (function(){ // ...})() 从中可以看出，IIFE是一个一旦被声明就会被立即执行的匿名函数。...那么匿名的立即执行函数带来了哪些特点呢： 将逻辑的复杂性实现都封装在IIFE函数内； 由于function会隔离作用域，因此IIFE内声明的任何变量都会被当做IIFE的局部变量，从而不会污染到全局变量...2、模块化模式 模块化的模式是在立即执行函数上更进了一步，我们将需要提供给第三方的变量return出来，如下： // 将封装的模块赋值给一个变量 var helloApi = function(){...它的特点如下： 在运行阶段，将各类依赖s文件构建为一个单独的js文件，如app.js或者build.js； 浏览器只需要加载build.js或者app.js这个单一文件即可。
什么时候不使用箭头函数? 说出三个或更多的例子？ 72. Object.freeze() 和 const 的区别是什么？ 73. 如何在 JS 中“深冻结”对象？ 74....undefined是未指定特定值的变量的默认值，或者没有显式返回值的函数，如：console.log(1)，还包括对象中不存在的属性，这些 JS 引擎都会为其分配 undefined 值。...倒数第二个表明我们可以将参数传递给IIFE函数。最后一个示例表明，我们可以将IIFE的结果保存到变量中，以便稍后使用。...如何在 JS 中创建对象？...如何在 JS 中“深冻结”对象？
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
即时通信 IM
ICP备案
对象存储
实时音视频
