浅谈js词法环境-编程思维

JavaScript 词法环境

本文主要讲解JS词法环境,我们将看到什么是词法环境,词法范围如何工作,函数内部的名称如何解析,内部属性,弄清楚词法环境利于我们理解闭包。让我们开始吧...

什么是词法环境?

在理解闭包时,最大的混淆来源是术语“词汇环境”,或者只是“词汇”这个词。在计算机科学中术语“词汇”仅表示“源代码”,或者换句话说,“与写的代码有关”。
大家请考虑以下代码:

var a = 'static';

function f1() {
   console.log(a);
}

function f2() {
   var a = 'dynamic';
   f1();
}

f2();

仔细考虑,大家觉得会输出什么?正确答案是:static。
首先 JavaScript 编译器读取程序的源代码,并在编译时根据给定函数的定义确定其可访问的环境。所以在 f1 被定义的时候它的词法范围就已经确定了,即它是全局定义的所以它的词法范围也为全局。无论在哪里调用,a 都是‘static’。
下一个例子:

var a = 'easy';

(function() {
   var b = 'easy';

   function f1() {
      console.log(a, b);
   }

   function f2() {
      var a = 'difficult';
      var b = 'difficult';
      f1();
   }

   f2();
})();

这段代码大家觉得结果会是什么?正确答案:easy easy

说明:f1 的本地环境并没有定义 a,b 因此搜索将移至词汇环境。在词汇环境中,搜索的第一个封闭环境,即 IIFE(立即执行函数) 的局部环境,存在 b;继续访问外部范围获取到全局的 a,故 f1 的输出结果为 easy easy。
最后:请始终记住函数定义的时候词法范围就决定了。与其在哪里调用无关。将在下一篇文章讲解JS中的闭包。

版权声明:本文版权归作者所有,遵循 CC 4.0 BY-SA 许可协议, 转载请注明原文链接
https://www.cnblogs.com/pglin/p/17033612.html

javascript 评测代码运行速度-编程思维

一、使用 performance.now() API 在 JavaScript 中,可以使用 performance.now() API 来评测代码的运行速度。该 API 返回当前页面的高精度时间戳,您可以在代码执行前后调用它来计算代码执行所需的时间。 例如: let t0 = performance.now();

javascript 高阶函数-编程思维

一、高阶函数 JavaScript 中的高阶函数是一种接受函数作为输入或返回函数作为输出的函数。它们提供了灵活的方式来处理函数,并允许把函数作为参数或返回值传递。它们是函数式编程的重要组成部分,并且可以提高代码的可读性和可维护性。 高阶函数的一个常见用法是对数组进行操作,例如使用 map()、reduce() 和 fi

javascript循环渲染html模板,非侵入式-编程思维

2023-2-9 09:34:26 前段渲染页面时, 经常会遇到渲染列表的需求, 当后端返回的一些字段的值是枚举类的时候(比如常用的status), 为了减轻服务端压力, 可以由前端js代码将数值转为文字显示. (映射表也由服务端下发) 这个js小插件纯js编写, 没有在标签中加入 v-for 之类的属性, 能够使HT

深入理解javascript对象-编程思维

前言 在 JavaScript 中,对象是一种非常常见的数据类型,几乎每个程序员都会在日常工作中频繁地使用对象。在本篇文章中,我们将深入了解 JavaScript 对象的一些基本概念和一些高级概念,这些概念对于我们正确理解对象在 JavaScript 中的行为非常重要。 对象的基本概念 在 JavaScript 中,对

浅谈js原型-编程思维

前言 JavaScript 原型是该语言中一个非常重要的概念。理解原型是理解 JavaScript 的关键。在本篇技术博客中,我们将深入探讨 JavaScript 的原型概念,并介绍常用的操作对象原型的方法。(欢迎点评,欢迎指正!) 什么是原型? 在 JavaScript 中,每个对象都有一个原型(prototype)

理解js函数之call,apply,bind-编程思维

前言 在 JavaScript 中,apply、bind 和 call 是三个重要的函数,它们都是 Function.prototype 的方法。这些函数可以让我们动态地改变函数的 this 值,或者传递参数来执行函数。本篇博客将详细介绍 apply、bind 和 call 的使用方法以及它们之间的区别。 apply