javascript变量提升和闭包理解

请参考以下攻略:

JavaScript变量提升

什么是变量提升?

变量提升是 Javascript 中的一种特性,它指的是在代码执行前,所有的变量声明都会被提升到代码的开头部分,但是赋值操作并不会被提升。也就是说,变量声明后的变量名可以在声明之前被使用,但是变量值会返回 undefined。

示例一:

console.log(a); // Output: undefined
var a = 5;

变量 a 的声明被提升到代码的顶部,但是赋值操作并没有被提升。所以,输出的是 undefined。

示例二:

console.log(sum(4, 6)); // Output: 10
function sum(a, b) {
  return a + b;
}

函数声明也可以被提升,所以函数可以在声明之前被使用。

let 和 const 的变量提升

let 和 const 的变量提升与 var 的不同。它们会将声明封装在一个称为暂存死区 (Temporal Dead Zone / TDZ) 的区域内,变量在此期间就不能被访问。

示例:

console.log(a); // Output: ReferenceError
let a = 5;

let 的变量声明没有被提升,所以访问 a 会引发 ReferenceError 错误

JavaScript闭包

什么是闭包?

闭包是 Javascript 中一个非常重要的概念,也是一个函数与其词法作用域中的变量环境的集合体。在一个函数内部,我们可以访问到本函数作用域中的变量和全局作用域中的变量。当本函数执行完后,这个作用域通常就会被销毁,但是当存在一个闭包时,这个被销毁的作用域仍旧存在,并且可以被外部环境所访问。

示例一:

function outerFunction() {
  var name = "Alice";
  function innerFunction() {
    console.log(name);
  }
  return innerFunction;
}
var myFunction = outerFunction();
myFunction();

innerFunction() 定义在 outerFunction() 的内部,也就是在一个私有的作用域内。但是让它成为了闭包,是因为它被外部函数返回,并且可以访问到它定义时的作用域中的变量。在这个例子中,innerFunction() 可以访问 name 变量,因为它定义在 outerFunction() 中。

示例二:

function add(x) {
  return function(y) {
    return x + y;
  }
}
var addFive = add(5);
console.log(addFive(4)); // Output: 9

在这个示例中,add() 函数返回了一个闭包,它通过定义一个函数返回另一个函数。这个闭包可以访问 add() 中定义的变量,因为它拥有 add() 中定义的作用域。在这个例子中,闭包可以访问 x 的值 5。在调用 addFive(4) 时,闭包会将 5 和传入的参数 4 相加,返回 9。

以上就是 JavaScript 变量提升和闭包理解的攻略。

本站文章如无特殊说明,均为本站原创,如若转载,请注明出处:javascript变量提升和闭包理解 - Python技术站

(0)
上一篇 2023年6月10日
下一篇 2023年6月10日

相关文章

  • JS将秒换成时分秒实现代码

    下面是JS将秒换成时分秒实现代码的完整攻略: 1. 获取秒数 首先,我们需要获取要转换的秒数,可以通过以下方式获取: let seconds = 12345; // 需要转换的秒数 2. 计算时分秒 通过以下代码可以将秒数转换为时分秒的形式: let hours = Math.floor(seconds / 3600); // 计算小时数 let minut…

    JavaScript 2023年5月27日
    00
  • JS中图片缓冲loading技术的实例代码

    下面我将详细讲解JS中图片缓冲loading技术的实例代码攻略。 1. 图片缓冲loading技术的作用 图片缓冲loading技术可以解决图片加载过慢或者图片尚未加载完成时页面出现的空白或错乱现象,使得页面更加优雅和美观。 2. 实现步骤 2.1 定义图片缓存对象 首先,我们需要定义一个空对象,用于保存本页面中所需加载的所有图片资源。 let imgObj…

    JavaScript 2023年6月11日
    00
  • js获取单元格自定义属性值的代码(IE/Firefox)

    获取单元格自定义属性值的代码需要用到JavaScript的DOM操作,具体步骤如下: 获取单元格元素 首先,我们需要获取单元格元素,可以使用document.getElementById()方法获取单元格的ID,也可以使用document.getElementsByTagName()方法获取所有单元格元素并使用索引访问特定单元格。示例代码如下: var ce…

    JavaScript 2023年6月10日
    00
  • javascript常用的设计模式

    JavaScript常用的设计模式 设计模式是一种解决特定类问题的经验总结,是经验的提炼。在JavaScript中,设计模式可以帮助我们避免重复的代码,提高代码的可维护性和可读性。下面是常见的JavaScript设计模式: 工厂模式 工厂模式是一种创建型模式,通过定义一个用于创建对象的接口来创建具体的对象实例。 function Car(type, bran…

    JavaScript 2023年6月10日
    00
  • JavaScript中string转换成number介绍

    当需要在JavaScript中使用数字时,需要将字符串转换为数字。在JavaScript中有三种方式可以将字符串转换为数字类型:Number(), parseInt() 和 parseFloat()。下面对这三种方式进行详细介绍。 Number()方法: Number()方法可以把任何JavaScript对象转换为数字。如果对象是一个字符串,字符串只包含数字…

    JavaScript 2023年5月28日
    00
  • 静态页面利用JS读取cookies记住用户信息

    静态页面读取cookie的基本原理 在使用JavaScript读取cookie之前,我们需要先了解什么是cookie。Cookie是指客户端保存在浏览器中的一小段文本数据,由Web服务器生成并存储在用户计算机上,当下次用户访问相同的站点时,服务器可读取此cookie的值,来判断用户是否合法,以及是否登录过等。 读取cookie需要使用JavaScript中的…

    JavaScript 2023年6月11日
    00
  • JavaScript 图像动画的小demo

    让我来详细讲解一下“JavaScript 图像动画的小demo”的完整攻略。 1. 设计思路 通过 Canvas 创建动画效果,可以将图形动态地展示到网页上。这个小demo的设计思路就是以一只小乌龟为例,讲解如何使用 Canvas 创建动画效果。主要有以下几个步骤: 创建 Canvas 元素 获取 Canvas 画布的上下文 加载乌龟图片资源 设置画布宽高和…

    JavaScript 2023年6月10日
    00
  • JS实现运动缓冲效果的封装函数示例

    JS实现运动缓冲效果是前端开发中常见的问题之一。我们可以封装一个函数来实现这个效果,方便快捷地进行运动缓冲效果的实现。 函数封装过程 封装函数涉及到一些关键的概念: 运动开始点 运动结束点 运动距离 运动时间 每一帧的运动距离 运动速度 缓冲系数 基于上述概念,简单描述实现运动缓冲效果的封装函数示例的攻略如下: 确定函数参数 封装函数需要定义函数的参数,以便…

    JavaScript 2023年6月11日
    00
合作推广
合作推广
分享本页
返回顶部