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. Obligations for calling close() on the iterable returned by a WSGI application

    Graham Dumpleton: Obligations for calling close() on the iterable returned by a WSGI application. ht ...

  2. redis 代码结构与阅读顺序

    https://www.cnblogs.com/aixiaomei/p/6311633.html

  3. RMI笔记

    这是<java核心技术> 第11章 分布式对象的笔记. RMI基本原理 我们使用远程方法调用是希望达到这样的目的: 可以像调用本地方法一样去调用一个远程方法. 实现远程调用的方式是 为客户 ...

  4. OAuth2.0与前端无感知token刷新实现

    前言 OAuth是一个关于授权(authorization)的开放网络标准,在全世界得到广泛的应用.Facebook.Twitter和Google等各种在线服务都提供了基于OAuth规范的认证机制. ...

  5. IntelliJ Idea 解决 Could not autowire. No beans of 'xxxx' type found 的错误提示

    IntelliJ Idea 解决 Could not autowire. No beans of 'xxxx' type found 的错误提示哈,在使用 @Autowired 时,今天又遇一坑,这俩 ...

  6. 洛谷 p3391

    题目背景 这是一道经典的Splay模板题--文艺平衡树. 题目描述 您需要写一种数据结构(可参考题目标题),来维护一个有序数列,其中需要提供以下操作:翻转一个区间,例如原有序序列是5 4 3 2 1, ...

  7. slowhttptest慢速攻击工具使用详解

    参考文章 浅谈"慢速HTTP攻击Slow HTTP Attack" HTTP慢速攻击 Slowhttptest攻击原理 InstallationAndUsage tag: #slo ...

  8. JS 实现一个实时动态校验,将输入格式错误的显示为红色背景

    功能描述: 源码: 功能描述: 实时动态校验,如果输入的格式错误,将弹窗提示输入格式错误并将背景展示为红色. 源码: 前台: <hy:formfield name="cxfdl&quo ...

  9. js创建map

    function Map() { var struct = function(key, value) { this.key = key; this.value = value; } var put = ...

  10. python--基础2 (数据类型及应用)

    资源池 链接:https://pan.baidu.com/s/1OGq0GaVcAuYEk4F71v0RWw 提取码:h2sd python数据类型 字符串 列表 字典 数字(整数) 数字(浮点数) ...