闭包,事件循环以及js校验规则

简介: 闭包,事件循环以及js校验规则

什么是闭包

闭包是指函数以及其相关的引用环境组合而成的实体。简单来说,闭包是一个函数和其周围的状态(词法环境)的集合体。

要形成闭包,通常需要满足以下两个条件:

1.在一个函数内部定义了另一个函数。

2.内部函数引用了外部函数的变量。

js实现闭包代码如下:

function outerFunction() {
  var x = 10;
  function innerFunction() {
    console.log(x);
  }
  return innerFunction;
}
var closure = outerFunction();
closure();  // 输出结果为10

在上述示例中,outerFunction 是外部函数,内部函数 innerFunction 引用了外部函数的变量 x。通过调用 outerFunction(),返回了一个闭包函数 closure,可以通过调用 closure() 来访问闭包函数并输出结果。在这个闭包中,innerFunction 保持了对 outerFunction 的词法环境的引用,因此可以访问到 x 的值。

闭包的优缺点

优点:

1.数据封装:闭包可以隐藏内部变量,只暴漏特定接口,实现数据的私有化和封装性,保护数据不受外部干扰。

2.记忆效应:闭包内的变量可以在函数调用结束后仍然保存存在,因而可以保存状态,记住上下文,实现类似于“记忆”效果,方便实现某些功能,如缓存、计数器等。

3.延长作用域链:闭包可以扩展函数的作用域链,使得内部函数可以访问外部函数的变量,灵活性更高。

缺点:

1.内存泄露:由于闭包会将他引用的外部变量保存在内存中,如果闭包被长时间持有且未释放。会导致内存泄露的问题。

2.性能消耗:闭包会占用较多的内存空间和计算资源,因为需要维护额外的作用域链和外部变量的引用。

3.对象状态的不确定性:闭包内的变量可能会被外部修改,这可能导致不可预料的结果。

闭包的应用场景

1.实现模块化:闭包可以将变量和函数封装在一个独立的作用域中,实现模块化开发,避免全局命名冲突。

2.数据缓存和记忆化:利用闭包的记忆效应,可以实现一些缓存计算、避免重复计算的功能,提高代码性能。

3.封装私有变量:通过闭包,可以创建具有私有变量和方法的对象,实现面向对象的封装性。

4.事件处理和回调:在异步编程中,可以使用闭包来保存异步操作的上下文和状态,以便在回调函数中使用

事件循环的理解

事件循环是一种处理异步任务的机制,它在JavaScript引擎中运行。

JavaScript是单线程执行的,就是一次只能执行一个任务,但是这并不就是说单线程就是阻塞,而实现单线程非阻塞的方法就是事件循环。

js的执行顺序

1.js是从上到下一行一行执行。

2.如果某一行执行报错,就不会执行下面的代码了。

3.js会执行同步代码,后执行异步代码。

事件循环的执行过程

先执行同步代码,调用栈执行后直接出栈。

在执行异步代码,接收到异步代码后,先放到web api中等待,随后等到合适的时候放入回调队列(callbackQueue),等到调用栈空时eventLoop开始工作。

记住微任务先执行,宏任务后执行。

微任务在DOM渲染前触发,宏任务在DOM渲染后触发

console.log('我是任务1');
setTimeout(()=>{
  console.log('我是任务2');
});
Promise.resolve().then(()=>{
  console.log('我是任务3');
})
console.log('我是任务4');

在上述代码块中,任务1和任务4是同步代码所以先执行,任务3为微任务,随后执行,任务2是宏任务最后执行。

事件循环的应用场景

1.用户交互:他可以响应用户的交互操作,就像点击,滚动或者拖拽等。他通过监听DOM事件,然后将对应的回调函数添加到队列中,在下一个事件循环周期中执行以更新页面状态或执行相应的逻辑。

2.异步请求:使用XMLHttpRequest、Fetch或者基于XHR封装的第三方库就像axios发送异步请求获取数据。通过将请求的回调函数或Promise的then()方法添加到任务队列,响应返回之后,在下一个事件循环周期中执行相应的回调函数来处理数据。

3.定时器:使用 setTimeout 和 setInterval 方法设置定时器,可以在指定的延迟时间过后执行特定的代码或周期性地执行代码。

js类型校验的方法

1.typeof操作符:它可以检查一个变量的类型,它返回被检查变量的数据类型,是以字符串形式展现。如“string”,“number”,“function”,“undefined”等,注意typeof对null和对象类型(包括数组)会返回“object”。

2.instanceof:它是检查一个对象是否数据某个类或者构造函数,如,obj.instanceof===Array,可以检查obj是否为Aray类型。

3.constructor:都知道JavaScript对象都有一个constructor属性,是来指向创造该对象的构造函数。通过obj.constructor ===Array可以检查obj是否为Array类型的对象

4.Array.isArray:它可以确定一个对象是否为数据,它返回一个布尔值,表示对象是否为数组类型。


相关文章
|
前端开发 JavaScript Java
JavaScript闭包深入剖析:性能剖析与优化技巧
JavaScript 闭包是强大而灵活的特性,广泛应用于数据封装、函数柯里化和事件处理等场景。闭包通过保存外部作用域的变量,实现了私有变量和方法的创建,提升了代码的安全性和可维护性。然而,闭包也可能带来性能问题,如内存泄漏和执行效率下降。为优化闭包性能,建议采取以下策略:及时解除对不再使用的闭包变量的引用,减少闭包的创建次数,使用 WeakMap 管理弱引用,以及优化闭包结构以减少作用域链查找的开销。在实际开发中,无论是 Web 前端还是 Node.js 后端,这些优化措施都能显著提升程序的性能和稳定性。
310 70
|
11月前
|
存储 JavaScript 前端开发
|
自然语言处理 JavaScript 前端开发
当面试官再问我JS闭包时,我能答出来的都在这里了。
闭包(Closure)是前端面试中的高频考点,广泛应用于函数式编程中。它不仅指函数内部定义的函数,还涉及内存管理、作用域链和垃圾回收机制。闭包可以让函数访问其外部作用域的变量,但也可能引发内存泄漏等问题。通过合理使用闭包,可以实现模块化、高阶函数和回调函数等应用场景。然而,滥用闭包可能导致代码复杂度增加、调试困难以及潜在的性能问题。为了避免这些问题,开发时应谨慎处理闭包,避免不必要的嵌套,并及时清理不再使用的变量和监听器。
513 16
当面试官再问我JS闭包时,我能答出来的都在这里了。
|
JavaScript 前端开发 Java
JS中的隐式类型转换规则
JavaScript 是一门弱类型语言,变量类型在运行时会进行隐式转换。本文总结了常见的隐式转换规则,包括运算符转换、等号比较和布尔值转换等。例如,`1 + {a: 1}` 会先调用对象的 `toString()` 方法,最终结果为 `'1[object Object]'`。此外,还详细解析了 `undefined` 和 `null` 的运算行为,以及 `![] == []` 等特殊情况。通过这些例子,帮助开发者更好地理解 JavaScript 中的类型转换机制。
256 6
JS中的隐式类型转换规则
|
JavaScript 前端开发
js 闭包的优点和缺点
【10月更文挑战第27天】JavaScript闭包是一把双刃剑,在合理使用的情况下,它可以带来很多好处,如实现数据封装、记忆功能和模块化等;但如果不注意其缺点,如内存泄漏、变量共享和性能开销等问题,可能会导致代码出现难以调试的错误和性能问题。因此,在使用闭包时,需要谨慎权衡其优缺点,根据具体的应用场景合理地运用闭包。
417 58
|
12月前
|
消息中间件 JavaScript 前端开发
最细最有条理解析:事件循环(消息循环)是什么?为什么JS需要异步
度一教育的袁进老师谈到他的理解:单线程是异步产生的原因,事件循环是异步的实现方式。 本质是因为渲染进程因为计算机图形学的限制,只能是单线程。所以需要“异步”这个技术思想来解决页面阻塞的问题,而“事件循环”是实现“异步”这个技术思想的最主要的技术手段。 但事件循环并不是全部的技术手段,比如Promise,虽然受事件循环管理,但是如果没有事件循环,单一Promise依然能实现异步不是吗? 博客不应该只有代码和解决方案,重点应该在于给出解决方案的同时分享思维模式,只有思维才能可持续地解决问题,只有思维才是真正值得学习和分享的核心要素。如果这篇博客能给您
|
12月前
|
缓存 自然语言处理 JavaScript
JavaScript中闭包详解+举例,闭包的各种实践场景:高级技巧与实用指南
闭包是JavaScript中不可或缺的部分,它不仅可以增强代码的可维护性,还能在模块化、回调处理等场景中发挥巨大作用。然而,闭包的强大也意味着需要谨慎使用,避免潜在的性能问题和内存泄漏。通过对闭包原理的深入理解以及在实际项目中的灵活应用,你将能够更加高效地编写出简洁且功能强大的代码。 只有锻炼思维才能可持续地解决问题,只有思维才是真正值得学习和分享的核心要素。如果这篇博客能给您带来一点帮助,麻烦您点个赞支持一下,还可以收藏起来以备不时之需,有疑问和错误欢迎在评论区指出~
|
JavaScript 前端开发 API
深入理解Node.js事件循环及其在后端开发中的应用
本文旨在揭示Node.js的核心特性之一——事件循环,并探讨其对后端开发实践的深远影响。通过剖析事件循环的工作原理和关键组件,我们不仅能够更好地理解Node.js的非阻塞I/O模型,还能学会如何优化我们的后端应用以提高性能和响应能力。文章将结合实例分析事件循环在处理大量并发请求时的优势,以及如何避免常见的编程陷阱,从而为读者提供从理论到实践的全面指导。
|
JavaScript API 开发者
深入理解Node.js中的事件循环和异步编程
【10月更文挑战第41天】本文将通过浅显易懂的语言,带领读者探索Node.js背后的核心机制之一——事件循环。我们将从一个简单的故事开始,逐步揭示事件循环的奥秘,并通过实际代码示例展示如何在Node.js中利用这一特性进行高效的异步编程。无论你是初学者还是有经验的开发者,这篇文章都能让你对Node.js有更深刻的认识。
|
存储 缓存 自然语言处理
掌握JavaScript闭包,提升代码质量与性能
掌握JavaScript闭包,提升代码质量与性能

热门文章

最新文章