javascript IIFE in depth

function type

  1. 函数表达式

x = function (){
console.log(x);
}
ƒ (){
console.log(x);
} x;
ƒ (){
console.log(x);
} x();
ƒ (){
console.log(x);
} window.x;
ƒ (){
console.log(x);
}

x = function x(){
console.log(x);
}
ƒ x(){
console.log(x);
} x();
ƒ x(){
console.log(x);
} window.x;
ƒ x(){
console.log(x);
}

  1. 函数声明

function x(){
console.log(x);
} x();
ƒ x(){
console.log(x);
} window.x
ƒ x(){
console.log(x);
}

考察知识点

  1. closure
  2. IIFE
  3. hoisting
  4. scope
  5. function declaration / function expression
  6. named function / anonymous function

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions

closure

https://javascript.info/closure

js var hoisting

  1. function

  2. var


demo

https://muyiy.cn/question/js/33.html

// 下面的代码打印什么内容,为什么?

var b = 10;
(function b(){
b = 20;
console.log(b);
})();

var b = 10;
(function b(){
b = 20;
console.log(b);
console.log(window.b);
})(); ƒ b(){
b = 20;
console.log(b);
console.log(window.b);
}
// 10

函数表达式的函数名是常量,无法二次赋值(在正常模式下静默失效,在严格模式下报错)

非匿名自执行函数,函数名只读

'use strict';

var b = 10;
(function b(){
'use strict';
b = 20;
console.log(b);
console.log(window.b);
})(); // Uncaught TypeError: Assignment to constant variable.
at b (<anonymous>:4:7)
at <anonymous>:7:3

https://github.com/Advanced-Frontend/Daily-Interview-Question/issues/48#issuecomment-615547271



scope & hoisting

https://www.adequatelygood.com/JavaScript-Scoping-and-Hoisting.html

https://repl.it/@xgqfrms/Function-hoisting-greater-var-hoisting

https://stackoverflow.com/questions/7506844/javascript-function-scoping-and-hoisting

https://www.sitepoint.com/5-typical-javascript-interview-exercises/



xgqfrms 2012-2020

www.cnblogs.com 发布文章使用:只允许注册用户才可以访问!


javascript IIFE in depth的更多相关文章

  1. [javascript]IIFE立即执行的函数表达式

    近况:最近一直忙着找实习没有更新,不过学习还是在继续的.最近在写Node.js又稍带把javascript的角落知识捡了一遍,过半个月打算去看看python和一些CSS深层的书和博客.工作找的还好,拿 ...

  2. [Javascript] IIFE

    Javascript modules are a design pattern that allow you to encapsulate your code into smaller self ma ...

  3. [Javascript] Array methods in depth - filter

    Array filter creates a new array with all elements that pass the test implemented by the provided fu ...

  4. 每个JavaScript开发人员应该知道的33个概念

    每个JavaScript开发人员应该知道的33个概念 介绍 创建此存储库的目的是帮助开发人员在JavaScript中掌握他们的概念.这不是一项要求,而是未来研究的指南.它基于Stephen Curti ...

  5. 用简单的方法学习ES6

    ES6 简要概览 这里是ES6 简要概览.本文大量参考了ES6特性代码仓库,请允许我感谢其作者@Luke Hoban的卓越贡献,也感谢@Axel Rauschmayer所作的[优秀书籍]//explo ...

  6. JS学习笔记3_函数表达式

    1.函数表达式与函数声明的区别 函数声明有“提升”(hoisting)的特性,而函数表达式没有.也就是说,函数声明会在加载代码时被预先加载到context中,而函数表达式只有在执行表达式语句时才会被加 ...

  7. NodeJS反序列化漏洞利用

    原文来自:http://www.4hou.com/web/13024.html node.js是一个服务器端的运行环境,封装了Google V8引擎,V8引擎执行JavaScript速度非常快,性能非 ...

  8. JavaScript学习笔记(二)——闭包、IIFE、apply、函数与对象

    一.闭包(Closure) 1.1.闭包相关的问题 请在页面中放10个div,每个div中放入字母a-j,当点击每一个div时显示索引号,如第1个div显示0,第10个显示9:方法:找到所有的div, ...

  9. JavaScript学习总结(二)——闭包、IIFE、apply、函数与对象

    一.闭包(Closure) 1.1.闭包相关的问题 请在页面中放10个div,每个div中放入字母a-j,当点击每一个div时显示索引号,如第1个div显示0,第10个显示9:方法:找到所有的div, ...

随机推荐

  1. 网络编程中 TCP 半开连接和TIME_WAIT 学习

    https://blog.csdn.net/chrisnotfound/article/details/80112736 上面的链接就是说明来 SO_KEEPALIVE 选项 为什么还需要 在应用层开 ...

  2. Okio Okio源码分析

    概述 Okio 作为 Okhttp 底层 io 库,它补充了 java.io 和 java.nio 的不足,使访问.存储和处理数据更加容易.Okio 的特点如下: okio 是一个由 square 公 ...

  3. 算法总结篇---KMP算法

    目录 写在前面 例题 剪花布条 Radio Transmission OKR-Periods of Words 似乎在梦中见过的样子 Censoring 写在前面 仅为自用,不做推广 一起来看猫片吧! ...

  4. Excel 如何使用 函数 实现传说中的 多条件中位数 (MEDIANIFS)?

    数据科学交流群,群号:189158789,欢迎各位对数据科学感兴趣的小伙伴的加入! 实际上Excel中根本没有MEDIANIFS,但我们可以通过一些方式进行实现: 比如如下图的需求,需要求这一列中,1 ...

  5. java判断是否为整数

    /** * 判断是否为整数 * * @param str 传入的字符串 * @return 是整数返回true,否则返回false */ public static boolean isInteger ...

  6. Go语言学习-import

    import我们在写Go代码的时候经常用到import这个命令用来导入包文件,而我们经常看到的方式参考如下:import("fmt")然后我们代码里面可以通过如下的方式调用fmt. ...

  7. (8)Linux文件目录结构一览表

    1.使用 Linux 时,通过命令行输入 ls -l / 可以看到,在 Linux 根目录(/)下包含很多的子目录(称为一级目录),例如 bin.boot.dev 等.同时,各一级目录下还含有很多子目 ...

  8. Scala数据结构(数组,Map和Tuple)

    package com.zy import scala.collection.mutable import scala.collection.mutable.ArrayBuffer object te ...

  9. 数据结构-kmp算法

    定义 改进字符串的匹配算法 关键:通过实现一个包含了模式串的局部匹配信息的next()函数,利用匹配失败的信息,减少匹配次数. 1.BF算法 暴力匹配 给定 文本串S "BBC ABCDAB ...

  10. 【noi 2.6_9277】Logs Stacking堆木头(DP)

    题意:给出在最底层的木头的个数,问有多少种堆放木头的方式.要求木头必须互相挨着在一起. 解法:f[i]表示最底层i个木头的堆放木头的方式.注意递推的思想!只需知道上一层堆放0~i-1个(即最底层堆放i ...