文章详情

短信预约-IT技能 免费直播动态提醒

请输入下面的图形验证码

提交验证

短信预约提醒成功

为什么停止使用JavaScript IIFE!

2024-04-02 19:55

关注

为什么停止使用JavaScript IIFE!,针对这个问题,这篇文章详细介绍了相对应的分析和解答,希望可以帮助更多想解决这个问题的小伙伴找到更简单易行的方法。

JavaScript语言中,IIFE代表立即调用函数表达式,它是一个定义后即刻执行的函数。

为什么我说别再在代码中编写IIFE了?本文将给你答案。

可以在JavaScript中定义Block-Scoped 变量

以ES6作为标准发布,你可以使用let和const声明块级作用域的变量和常量。它还引入了独立块,可以将变量和常量隔离到外部无法使用的自身块中。

例如,可以写:

{ let x = 1;}

那么x对外不可用。

这要比以下代码清晰许多:

(()=>{   let x = 1; })();

现如今,几乎所有浏览器都支持ES6,停止使用IIFE能将变量从外部分离。

另一种隔离变量的方法是使用模块,它也得到广泛支持。只要不将其导出,其他模块就无法使用。

不再需要闭包

闭包是返回另一个函数的函数。返回的函数能够运行在其外部的代码,但内部的代码则由闭包函数运行。

例如,它可能会产生:

const id = (() => {   let count = 0;   return () => {     ++count;     return `id_${count}`;   }; })();

而既有了块和模块以隔离数据,上述函数就变得更加复杂和不必要了。

可以将所有函数放入其自身模块,这样就不必担心暴露数据了,但这也会产生副作用。由于不是纯函数,很难对其进行测试。

在可以避免嵌套的时候,返回函数的函数也会引入嵌套,所以它比没有返回函数的函数更易混淆。用模块代替是最好的方法。使用模块可以编写:

let count = 0;export const id =() => {   ++this.count;   return `id_${count}` }

上面代码中,有相同的count声明且导出了id函数,以供其他模块使用。这像IIFE一样,隐藏了count并暴露出我们想要的函数,但是嵌套较少,不需要定义另一个函数来运行它。

别名变量

同样,写如下内容:

window.$ = function foo() {   // ... };(function($) {   // ... })(jQuery);

使用模块就可以编写,为何还要仅为给变量创建别名而编写IIFE?利用模块,可以导入不同名称的内容。

你可以这样为变量创建别名的编写方式:

import { $ as jQuery } from"jquery";const $ = () => {};

此外,不要给窗口对象添加新属性,这会影响全局作用域。

为什么停止使用JavaScript IIFE!

捕捉全局对象

使用globalThis,就不必担心不同作用域中全局对象的名称问题,它正在成为一种标准。无需再使用IIFE以捕获全局对象,你可以在区域顶级编写如下内容:

(function(global) {   // ... })(this);

甚至即使在“globalThis”之前,编写如下内容设置全局对象也不太难:

const globalObj = self || window|| global;

或者如果想更精确,可以写:

const getGlobal = () => {   if (typeof self !== 'undefined') {return self; }   if (typeof window !== 'undefined') {return window; }   if (typeof global !== 'undefined') {return global; }   throw new Error('unable to locateglobal object'); };

不必通过IIFE添加额外函数调用和引入嵌套。

优化压缩

应用JavaScript模块,就不必用IIFE隔离代码,这可以适当地压缩文件。

网络包、浏览、包裹、汇总等(Webpack、Browserify、Parcel、Rollup等程序),都可以正确处理模块,为何不用这些程序来创建更清晰的代码。

在代码中编写IIFE了已经过时了,它还增加了额外的函数定义和嵌套。2020年,请选择使用模块和块来分离代码!

关于为什么停止使用JavaScript IIFE!问题的解答就分享到这里了,希望以上内容可以对大家有一定的帮助,如果你还有很多疑惑没有解开,可以关注编程网行业资讯频道了解更多相关知识。

阅读原文内容投诉

免责声明:

① 本站未注明“稿件来源”的信息均来自网络整理。其文字、图片和音视频稿件的所属权归原作者所有。本站收集整理出于非商业性的教育和科研之目的,并不意味着本站赞同其观点或证实其内容的真实性。仅作为临时的测试数据,供内部测试之用。本站并未授权任何人以任何方式主动获取本站任何信息。

② 本站未注明“稿件来源”的临时测试数据将在测试完成后最终做删除处理。有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341

软考中级精品资料免费领

  • 历年真题答案解析
  • 备考技巧名师总结
  • 高频考点精准押题
  • 2024年上半年信息系统项目管理师第二批次真题及答案解析(完整版)

    难度     813人已做
    查看
  • 【考后总结】2024年5月26日信息系统项目管理师第2批次考情分析

    难度     354人已做
    查看
  • 【考后总结】2024年5月25日信息系统项目管理师第1批次考情分析

    难度     318人已做
    查看
  • 2024年上半年软考高项第一、二批次真题考点汇总(完整版)

    难度     435人已做
    查看
  • 2024年上半年系统架构设计师考试综合知识真题

    难度     224人已做
    查看

相关文章

发现更多好内容

猜你喜欢

AI推送时光机
位置:首页-资讯-前端开发
咦!没有更多了?去看看其它编程学习网 内容吧
首页课程
资料下载
问答资讯