首页 > 编程语言 >JavaScript 中的五种作用域:开发人员深入探讨

JavaScript 中的五种作用域:开发人员深入探讨

时间:2024-09-20 20:14:03浏览次数:7  
标签:function javascript 函数 开发人员 作用域 JavaScript log 变量

javascript 对变量的行为是由它的作用域决定的。理解范围是编写健壮、可维护的代码的基础。本文将探讨 javascript 中的五种主要作用域类型——全局、局部、块、函数作用域(和闭包)和作用域链。最后,您将清楚地掌握 javascript 如何跨不同上下文处理变量。 目录 1. 全球范围 解释:在任何函数或块之外声明的变量都具有全局范围。这意味着它们可以在 javascript 代码中的任何位置访问。在浏览器中运行时,全局变量成为 window 对象的属性,如果应用程序的不同部分尝试使用相同的变量名称,则可能会导致冲突。 例子:var globalvar = "i am a global variable";function displayglobal() { console.log(globalvar); // accessible from inside the function}displayglobal(); // outputs: i am a global variableconsole.log(globalvar); // accessible outside the function as well登录后复制 重要考虑因素:使用太多全局变量会污染全局命名空间,增加由于命名冲突而出现错误的可能性。 2. 本地范围 解释:函数内声明的变量位于局部范围内。它们只能从该函数内访问。一旦函数执行完毕,变量就会从内存中删除,并且无法再访问。立即学习“Java免费学习笔记(深入)”; 例子:function localscopeexample() { var localvar = "i am local to this function"; console.log(localvar); // works fine}localscopeexample();console.log(localvar); // error: localvar is not defined登录后复制 重要考虑因素:本地作用域有助于避免变量名称冲突,促进函数内的封装和数据隐私。 3. 块作用域 解释:在 javascript(特别是 es6+)中,用 let 和 const 声明的变量是块作用域的。块是 {}(大括号)之间的任何代码,例如 if 语句、循环和函数中的代码。块作用域变量仅限于定义它们的块。 例子:if (true) { let blockscopedvar = "i exist only within this block"; console.log(blockscopedvar); // accessible here}console.log(blockscopedvar); // error: blockscopedvar is not defined登录后复制 重要考虑因素:与 var 不同,let 和 const 可以防止变量意外泄漏到其预期块之外,从而使您的代码更具可预测性。 4. 闭包和函数作用域 解释:javascript 中的每个函数都会创建自己的作用域,称为 函数作用域。函数内声明的变量只能在该函数内访问。然而,javascript 还支持闭包,它允许内部函数即使在外部函数完成执行后也可以访问外部函数的变量。 例子:function outerfunction() { let outervar = "i am outside!"; function innerfunction() { console.log(outervar); // can access outervar due to closure } return innerfunction;}const closureexample = outerfunction();closureexample(); // outputs: i am outside!登录后复制 重要考虑因素:闭包非常强大,因为它们允许在函数中持久存储数据,而不会污染全局范围。它们支持数据封装和函数工厂等功能。 5. 作用域链 解释:javascript 使用作用域链来解决变量访问。如果在当前作用域中找不到变量,javascript 将查找作用域链,检查外部作用域,直到找到该变量或到达全局作用域。 例子:let globalVar = "I am a global variable";function outerFunction() { let outerVar = "I am an outer variable"; function innerFunction() { let innerVar = "I am an inner variable"; console.log(globalVar); // Found in the global scope console.log(outerVar); // Found in the outer function scope console.log(innerVar); // Found in the inner function scope } innerFunction();}outerFunction();登录后复制 重要考虑因素:作用域链有助于解析嵌套函数或块中的变量。它在父作用域中向上移动,直到找到所需的变量或在未定义的情况下抛出错误。 结论了解 javascript 中的各种类型的作用域——全局、局部、块、闭包/函数作用域和作用域链——使您能够编写更清晰、更高效的代码。通过仔细管理变量的声明和访问方式,您可以避免意外行为,特别是在更大、更复杂的应用程序中。掌握范围是成为高级 javascript 开发人员的一个关键方面,确保您的代码无论其复杂程度如何都按预期运行。喜欢阅读吗?如果您发现这篇文章富有洞察力或有帮助,请考虑给我买杯咖啡来支持我的工作。您的贡献有助于推动更多此类内容。单击此处请我喝杯虚拟咖啡。干杯! 以上就是JavaScript 中的五种作用域:开发人员深入探讨的详细内容,更多请关注我的其它相关文章!

标签:function,javascript,函数,开发人员,作用域,JavaScript,log,变量
From: https://www.cnblogs.com/aow054/p/18423201

相关文章

  • JavaScript 中的交互:“警报”、“提示”和“确认”
    ****欢迎回到我们的javascript世界之旅!在这篇博文中,我们将探讨在javascript中与用户交互的三种基本方法:警报、提示和确认。这些方法分别允许您显示消息、收集用户输入和确认操作。让我们深入研究每种方法,看看它们是如何工作的。1.?警报alert方法用于显示一个简单的对话......
  • JavaScript 中的展开和休息运算符
    零食故事:假设您有一篮子零食:constsnacks=['apple','banana','chocolate'];登录后复制现在,您想与您的朋友分享这些零食。但你不是把整个篮子都给他们,而是把每件零食都拿出来,一一递给他们:console.log(...snacks);//output:applebananachocolate登录后复制...(摊开)操作符就......
  • JavaScript For 循环示例
    标准for循环for(leti=0;i<h2>for...of循环(遍历数组)</h2><preclass="brush:php;toolbar:false">constfruits=['apple','banana','orange'];for(constfruitoffruits){console.log(fruit);登录后复制......
  • Javascript Slice 方法及其示例
    什么是javascript数组切片?array.prototype.slice是一个jsarray方法,用于从现有数组中提取连续的子数组或“切片”。javascript切片可以接受两个参数:切片的开始和结束指示符——两者都是可选的。也可以在没有任何参数的情况下调用它。因此,它具有以下调用签名://slice();slice......
  • JavaScript 与 TypeScript
    javascript(js)长期以来一直是现代web开发的支柱。随着web应用程序的复杂性不断增加,对更好工具的需求变得显而易见,尤其是在类型安全性和代码可维护性方面。这就是javascript超集typescript(ts)发挥作用的地方。让我们深入研究typescript和javascript之间的主要区别......
  • JavaScript 中 for 循环的类型
    我们都知道并且喜欢经典的for循环,但是您知道javascript还有其他一些强大的for循环选项吗?1)for/in:这个对于迭代对象的键和操作对象属性非常有用。example:constobj={name:"javascript",type:"language"};for(letkeyinobj){console.log(key);//outputs"nam......
  • HTPX 简介:适用于 JavaScript 和 Nodejs 的轻量级多功能 HTTP 客户端
    作为开发人员,我们的web应用程序通常需要一个可靠且高效的http客户端,无论我们是在浏览器中使用javascript还是在服务器端使用node.js进行构建。这就是我创建htpx的原因——一个强大的轻量级解决方案,旨在简化http请求,同时为现代开发提供一系列功能。在本文中,我将引导您......
  • DSA 与 JS:用 JavaScript 解释大 O 表示法
    废话不多说,我们直接进入正题吧。什么是大o表示法以及它的用途是什么?明确的答案是bigo表示法是一种描述算法性能如何随着输入大小的增长而变化的方法。它可以帮助您了解处理越来越大的数据量时代码的速度有多快或多慢。简单来说,bigo会告诉您最坏的情况,即随着输入变大,代码将......
  • JavaScript For 循环示例
     零食故事:假设您有一篮子零食:constsnacks=['apple','banana','chocolate'];现在,您想与您的朋友分享这些零食。但你不是把整个篮子都给他们,而是把每件零食都拿出来,一一递给他们:console.log(...snacks);//output:applebananachocolate...(摊开)操作符就像是把......
  • 代码随想录算法训练营第十六天 | Javascript | 力扣Leetcode | 回溯 | 77. 组合、216.
    目录前言简介题目链接:77.组合题目链接:216.组合总和3题目链接:17.电话号码的字母组合前言踏平坎坷成大道,斗罢艰险又出发!自律的尽头是自控,自控的尽头是硬控。愿道友们披荆斩棘,终能得偿所愿。简介本人是小几年经验的前端开发,算法基础只有力扣几十道题,非常薄......