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. slice 切片实现 Slice object interface

    1.Python切片对象可以为任意类型 https://github.com/python/cpython/blob/master/Include/sliceobject.h /* Slice obj ...

  2. SpringMVC听课笔记(四:映射请求参数 & 请求头)

    1.请求参数 @RequestParam  来映射请求参数  http://localhost:8080/springmvc-1/springmvc/testRequestParam?username ...

  3. SQL操作数据——SQL组成,查询基础语法,where,Oracle常用函数等

    SQL组成 DML数据操作语言 DCL数据控制语言 DQL数据查询语言 DDL数据定义语言 查询基础语法 记录筛选 where 子句 记录筛选 where 子句 实例练习 实例练习 Select语句中 ...

  4. Kafka踩坑填坑记录

    Kafka踩坑填坑记录 一.kafka通过Java客户端,消费者无法接收消息,生产者发送失败消息 二. 一.kafka通过Java客户端,消费者无法接收消息,生产者发送失败消息 在虚拟机上,搭建了3台 ...

  5. H3C交换机堆叠

    (1)      配置Device A# 将用作IRF物理端口的Ten-GigabitEthernet1/0/1-Ten-GigabitEthernet1/0/4的手工关闭.使用端口批量配置功能可以更 ...

  6. Asp.net core通过自定义特性实现双端数据验证的一些想法

    asp.net core集成了非常方便的数据绑定和数据校验机制,配合操作各种easy的vs,效率直接高到飞起. 通过自定义验证特性(Custom Validation Attribute)可以实现对于 ...

  7. vscode开发vue,热更新

    1.首先用vscode去安装热更新插件 2.vscode安装后默认修改的文件是没有开启自动保存的,需要将自动保存勾选 这样就不用每次修改都去open with live server:

  8. jRating五星评级

    <!DOCTYPE html> <html> <head> <title>jrating使用示例</title> <meta char ...

  9. mybatis Sql语句配置详解

    sql语句配置 id sqlSession执行的唯一标识 resultMap 结果集封装映射,可用于内部对象一对多封装 resultType 返回的结果类型,直接就是一个po对象 resultSets ...

  10. P3381 [模板] 最小费用最大流

    EK  + dijkstra (2246ms) 开氧气(586ms) dijkstra的势 可以处理负权 https://www.luogu.org/blog/28007/solution-p3381 ...