返回顶部
首页 > 资讯 > 前端开发 > JavaScript >JavaScript基础之作用域
  • 652
分享到

JavaScript基础之作用域

2024-04-02 19:04:59 652人浏览 薄情痞子
摘要

目录作用域全局作用域函数作用域if,switch,for ,while块作用域作用域链总结再聊AO和BO之前还需要了解作用域的概念,这样方便后面了解很多东西,比如this指向等。 作

再聊AO和BO之前还需要了解作用域的概念,这样方便后面了解很多东西,比如this指向等。

作用域

作用域(Scope)简单的说就是变量,函数和对象定义后其可用的范围。


console.log(a)
{
    var a=1;
}
function test(){
     var b=2;
}

在这里插入图片描述

可以看出在外面无法使用变量b。可以看出作用域可以保护数据不会被外部随意访问,以及修改。简单可以看出作用域可以相互隔离彼此的变量,也就是说在不同的作用域下的同名变量不会冲突。

而作用域最重要常用的是全局作用域和函数作用域。不过es6之后因为let 和const关键字的出现又引如了一个块级作用域。

全局作用域

全局作用域简单说就是所有域都可以访问器域下变量以及方法对象。


var a="全局1";
 function test(){
    b="没有带var,隐式转变为全局变量";
    window.c="直接将变量c作为window下也会变全局";
    var d="非全局作用域";
 }
 #第一步 执行test()
test()  #这样才会将方法内的变量进行定义以及赋值
#第二步
console.log(a)
console.log(b)
console.log(c)
console.log(d)

在这里插入图片描述

一般来说window的属性都是全局变量,而window.c 其实式将c作为一个window的属性来对待。注意一点在声明变量的时候不要带var ,最好是带着var,这样不会将其提升成全局变量,导致数据会被相互污染。

补充说一句,test这个方法也是全局域下的方法。


function test(){
    var a= function(){
        console.log("字面量的方法")
    }
    b=function(){
        console.log("不带var字面量的方法")
    } 
   function test1(){
       console.log("普通声明方法")
   }
     
}
 

在这里插入图片描述

这个可以看出字面量声明的方法,类似一个可以看成一个将函数赋值给一个变量,将其作为一个变量来对待。前面预编译的时候也演示过了。

函数作用域

函数作用域与全局作用域相反,其不是为所有的地方用,而是在一定的范围用,一般声明的变量,只在函数内部使用。


function test(){
     var a="非全局作用域";
     console.log(a)
}

现在又有了一个问题,全局方法里面可以用函数作用域内部的变量。那么函数是内部是否可以有其下面的函数生成的函数作用域呢?以及其变量是否可以相互用?


function test(){
     var a="test方法作用域";
    function test1(){
         var b="test1方法作用域";
        console.log("a的值=",a);
    }
    # 调用函数内部函数
    test1();
     console.log("b的值=",b);
 }

在这里插入图片描述

这个地方可以看出作用域是分层的,内层作用域可以访问外层作用域的变量,外部访问不了内部的变量。

if,switch,for ,while

条件语句和逻辑循环,**它们不是函数同样也不像函数,也不会创建一个新的作用域。**其块定义的变量将保留在它们存在的作用域中。


function test(a){
    if(a>1){
        var b=13;
    }else{
       var b=1;  
    }
    console.log(b);
}

在这里插入图片描述

所以在使用条件语句和逻辑循环的时候,尽可能不要再全局作用域下使用。因为其方法体中的变量会影响其他的数据。

块作用域

块作用域的出现,一般需要依赖两个关键字let或const之一,不然就不会存在这个块作用域。

在这里插入图片描述


function test(a){
    const b="23";
    if (a>2){
        const c=3
        console.log("第一个人if---c-----",c)
    }
    if (a>1){
        console.log("第二个人if----b----",b)
        console.log("第二个人if----c----",c)
    }
     
}

在这里插入图片描述

可以看出如果有关键字let和const后,其变量的范围就是在其声明的那一对花括号内。所以第一个if中的c变量再第二个if的里面无法取得。当然还是遵守:内层作用域可以访问外层作用域的变量。

了解let和const看前一篇:地址

作用域链

这个看似很神奇的概念,简单的说就是作用域内有就直接用,没有找上一层,如果都没有,找到全局就结束。


var a=1
var b=3
function test(){
    var a=2
    console.log("a的值",a);
    console.log("b的值",b);
}
 

在这里插入图片描述

多嘴说一下,作用域链其实和原型链的寻找逻辑一样,后面继续聊。

总结

本篇文章就到这里了,希望能够给你带来帮助,也希望您能够多多关注编程网的更多内容!

--结束END--

本文标题: JavaScript基础之作用域

本文链接: https://lsjlt.com/news/157200.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

猜你喜欢
  • JavaScript基础之作用域
    目录作用域全局作用域函数作用域if,switch,for ,while块作用域作用域链总结再聊AO和BO之前还需要了解作用域的概念,这样方便后面了解很多东西,比如this指向等。 作...
    99+
    2024-04-02
  • Python3基础-Python作用域详
    转载文章 作者:骏马金龙 出处:http://www.cnblogs.com/f-ck-need-u/p/9925021.html 作用域是指变量的生效范围,例如本地变量、全局变量描述的就是不同的生效范围。 python的变量作用域的...
    99+
    2023-01-30
    作用 基础 Python
  • JavaScript基础之对象
    目录1.对象1.1什么是对象?1.2为什么需要对象2.创建对象的三种方式2.1利用对象字面量创建对象{}2.2利用new Object创建对象2.3 利用构造函数创建对象总结1.对象...
    99+
    2024-04-02
  • JavaScript基础之变量
    目录1.变量概述1.1变量在内存中的存储 1.2 变量的使用1.声明变量2.赋值3.变量的初始化1.3变量语法扩展1.更新变量2.声明多个变量3.声明变量特殊情况1.5变量...
    99+
    2024-04-02
  • Python基础教程之名称空间以及作用域
    目录前言名称空间什么是名称空间名称空间的意义名称空间的查找顺序局部名称空间详解嵌套函数中的查找顺序关于嵌套函数的使用作用域什么是作用域global语句nonlocal语句题目题目小结...
    99+
    2024-04-02
  • JavaScript基础之运算符
    目录1.运算符总结1.运算符 运算符(operator)也称操作符,是用于实现赋值、比较和执行算术运算等功能的符号。 JavaScript中常用的运算符有: 算术运算符 (...
    99+
    2024-04-02
  • JavaScript基础之this指向
    目录this方法中对象中隐藏的this严格模式总结JavaScript中this也是一件很神奇 事情,在面向对象(比如java)中表示一个当前的对象引用,但是在JavaScript中...
    99+
    2024-04-02
  • JavaScript基础之Array forEach使用示例
    目录前言尝试一下forEach实现对象模仿数组forEach跳出循环体?前言 forEach() 方法对数组的每个元素执行一次给定的函数。 回调函数中传递三个参数: 第一...
    99+
    2022-12-21
    JavaScript Array forEach JavaScript 基础
  • JavaScript基础之函数详解
    目录一、函数简介1.1.函数的创建1.2.函数的参数和返回值二、函数的类型2.1. 构造函数2.2. 立即执行函数2.3. 构造函数的原型prototype2.4. 函数中的this...
    99+
    2024-04-02
  • 详解Javascript基础之循环
    目录循环forfor-infor-ofwhiledo-while跳出循环总结循环 for 循环是任何一门语言都会有个命令,用于反复执行某段代码。 例如,循环代码块5次: for ...
    99+
    2024-04-02
  • python之LIST基础操作
    1,创建列表>>> list1=['a','b','c','d'] >>> list2=[1,2,3,4] >>> list3=['a','b','c',1,2,3]2,访问列表中的值&...
    99+
    2023-01-31
    操作 基础 python
  • Javascript之作用域、作用域链、闭包的示例分析
    这篇文章主要介绍Javascript之作用域、作用域链、闭包的示例分析,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!什么是作用域?作用域是一种规则,在代码编译阶段就确定了,规定了变量...
    99+
    2024-04-02
  • python基础-内置函数-作用域-闭包
    内置函数-作用域-闭包-递归 1.几个可能用到的内置函数 查看内置函数: print(dir(__builtins__)) 常见函数: len 求长度 min 最小值 max 最大值 sorted 排...
    99+
    2023-01-31
    函数 作用 基础
  • JavaScript详细解析之作用域链
    以上就是JavaScript详细解析之作用域链的详细内容,更多请关注编程网其它相关文章!...
    99+
    2022-11-22
    JavaScript 前端
  • python基础之文件操作
    目录1、打开文件2、写入3、追加4、读文件5、文件拷贝6、tell()7、truncate(size)8、seek()1、打开文件 open()函数简介 : 打开文件使用open函数...
    99+
    2024-04-02
  • MongoDB基础之集合操作
    一、创建集合 本章节我们为大家介绍如何使用 MongoDB 来创建集合。 MongoDB 中使用 createCollection() 方法来创建集合。 语法格式...
    99+
    2024-04-02
  • MongoDB基础之文档操作
    一、插入文档 文档的数据结构和 JSON 基本一样。 所有存储在集合中的数据都是 BSON 格式。BSON 是一种类似 JSON 的二进制形式的存储格式,是 Binary ...
    99+
    2024-04-02
  • python基础之序列操作
    类似于and操作 类似于or操作 # 类型转换 # sorted li=[2,45,1,67,23,10] li.sort() #list的排序方法 p...
    99+
    2024-04-02
  • python基础之共有操作
    #共有方法 + * in stra='人生苦短' strb='我用python' lista=list(range(10)) listb=list(range(11,20)) ...
    99+
    2024-04-02
  • JavaScript之ES6常用基础知识有哪些
    这篇文章主要介绍了JavaScript之ES6常用基础知识有哪些,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。ES6 let与const及其...
    99+
    2024-04-02
软考高级职称资格查询
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作