快手面试官:“你能说说 js 作用域与作用域链以及 js 上下文概念的概念吗?”

最近不是正值秋招莫,我正好也在做一些复习,就请了一位拿到两家大厂 Offer 的学长帮我做了一个面试,他告诉我他的题目主要是从 快手面试 和 字节面试 里面出的,然后他一上来就问了一道这个问题。

聊聊概念

快手面试官:"你能说说 js 作用域与作用域链以及 js 上下文概念的概念吗?"

我当时就眉头一皱,意识到事情不简单,好像我没有专门的去背这个概念,根据自己的理解说了一个版本:

我的答案

我理解作用域应该就分为三种吧,第一种是我们说的用 let 构建的块级作用域,第二种就是使用 var 定义变量的时候的全局作用域,第三种就是在函数里面定义变量产生的作用域。

而作用域链呢,就是当我们在函数作用域中没有找到当前变量,我们就会继续往外层函数去找,然后依次找到全局。

上下文的概念我就完全不是很清楚了。

后来学长和我说,他被问到了这个题目的时候也蒙了一下,然后零零碎碎的答完了。

正确答案

  1. 当我们在 JavaScript 中定义一个变量时,它的可访问范围被称为作用域。作用域控制着变量的可见性和生命周期。JavaScript 中有两种主要的作用域:全局作用域和局部作用域。
  • 全局作用域是在整个代码中都可访问的作用域。在全局作用域中声明的变量可以在代码的任何地方被访问。
  • 局部作用域是在函数内部声明的作用域。在局部作用域中声明的变量只能在函数内部访问。
  1. 作用域链是指在 JavaScript 中,每个作用域都有一个对其父级作用域的引用。当我们在一个作用域中访问一个变量时,JavaScript 引擎首先在当前作用域中查找变量,如果找不到,就会继续在父级作用域中查找,直到找到该变量或者到达全局作用域。

  2. JavaScript 上下文是指代码在执行时的环境。每当 JavaScript 代码执行时,都会创建一个执行上下文。执行上下文包含了当前代码执行所需的变量、函数和对象。JavaScript 中有三种类型的上下文:全局上下文、函数上下文和 eval 上下文。

  • 全局上下文是在代码执行之前创建的,它包含了全局作用域中的变量和函数。

  • 函数上下文是在调用函数时创建的,它包含了函数内部的变量、函数参数和 this 对象。

  • eval 上下文是在 eval 函数执行时创建的,它包含了 eval 函数内部的变量和函数。

eval 上下文和函数上下文的区别主要在于它们的创建方式和作用域规则。

  1. 创建方式:

    • 函数上下文是在调用函数时创建的,每当函数被调用时,都会创建一个新的函数上下文。

    • eval 上下文是在 eval 函数执行时创建的,每当 eval 函数被执行时,都会创建一个新的 eval 上下文。

  2. 作用域规则:

    • 函数上下文遵循词法作用域规则,即变量和函数的作用域由它们在代码中的位置决定。函数上下文可以访问外部作用域中的变量。

    • eval 上下文的作用域规则与函数上下文略有不同。eval 上下文可以访问外部作用域中的变量,但外部作用域无法访问 eval 上下文中的变量。

来点题目

这里列出一点题目,大家可以自测一下~~~~

  1. 作用域题目:
javascript 复制代码
var x = 10;  
  
function foo() {  
 var y = 20;  
 console.log(x);  
}  
  
foo();  

请问上述代码的输出是什么?

  1. 作用域链题目:
javascript 复制代码
var x = 10;  
  
function foo() {  
 var y = 20;  
   
 function bar() {  
   var z = 30;  
   console.log(x + y + z);  
 }  
   
 bar();  
}  
  
foo();  

请问上述代码的输出是什么?

  1. 上下文题目:
javascript 复制代码
var x = 10;  
  
function foo() {  
 console.log(this.x);  
}  
  
var obj = {  
 x: 20,  
 foo: foo  
};  
  
obj.foo();  

请问上述代码的输出是什么?

相关推荐
qq_12498707532 分钟前
基于node.js+vue的医院陪诊系统的设计与实现(源码+论文+部署+安装)
前端·vue.js·node.js·毕业设计
袁煦丞25 分钟前
9.12 Halo的“傻瓜建站魔法”:cpolar内网穿透实验室第637个成功挑战
前端·程序员·远程工作
围巾哥萧尘26 分钟前
大型语言模型语境学习中的演示位置偏置(DPP Bias)研究🧣
面试
universe_011 小时前
day27|前端框架学习
前端·笔记
沙尘暴炒饭1 小时前
前端vue使用canvas封装图片标注功能,鼠标画矩形框,标注文字 包含下载标注之后的图片
前端·vue.js·计算机外设
百思可瑞教育1 小时前
Vue中使用keep-alive实现页面前进刷新、后退缓存的完整方案
前端·javascript·vue.js·缓存·uni-app·北京百思可瑞教育
yinuo1 小时前
Uni-App跨端实战:APP的WebView与H5通信全流程解析(03)
前端
yinuo1 小时前
Uni-App跨端实战:支付宝小程序WebView与H5通信全流程解析(02)
前端
getdu1 小时前
Redis面试相关
数据库·redis·面试
bobz9652 小时前
libvirt 内存消耗
面试