关山难越,谁悲失路之人;萍水相逢,尽是他乡之客。
百度360必应搜狗淘宝本站头条
当前位置:网站首页 > 编程教程 > 技术文章 > 正文

JavaScript的作用域

guanshanw 2023-08-22 03:05 24 浏览 0 评论

作用域(重点)
●什么是作用域,就是一个变量可以生效的范围
○变量不是在所有地方都可以使用的,而这个变量的使用范围就是作用域
○也就是说作用域最大的用处就是隔离变量,不同作用域下同名变量不会有冲突。
●作用域分类
○全局作用域
○局部作用域也叫私有作用域或者函数作用域
●作用域上下级关系
○你在哪一个作用域下书写的函数, 就是哪一个作用域的子级作用域

全局作用域
●全局作用域是最大的作用域
●在全局作用域中定义的变量可以在任何地方使用
●页面打开的时候,浏览器会自动给我们生成一个全局作用域 window
●这个作用域会一直存在,直到页面关闭就销毁了

JavaScript的作用域

//  下面两个变量都是存在在全局作用域下面的,都是可以在任意地方使用的
var num = 100
var num2 = 200
// 在全局作用域下书写了一个 函数f1
// 此时 f1 也是在全局作用域下
function f1() {}

局部作用域
●局部作用域就是在全局作用域下面有开辟出来的一个相对小一些的作用域
●在局部作用域中定义的变量只能在这个局部作用域内部使用
●在 JS 中只有函数能生成一个局部作用域,别的都不行
●每一个函数,都是一个局部作用域


// 这个 num 是一个全局作用域下的变量 在任何地方都可以使用
var num = 100

function f1() {
    // f1 内部就形成了一个私有作用域
    // 下面这个变量就是一个 f1 私有作用域内部的变量
    // 只能在 f1 函数内部使用
    var num2 = 200
}
f1()


变量使用规则(重点)
●有了作用域以后,变量就有了使用范围,也就有了使用规则
●变量使用规则分为三种,定义规则、访问规则 和 赋值规则

定义规则
●你定义在哪一个作用域下的变量,就是哪一个作用域的私有变量
●该变量只能在该作用域及其后代作用域中使用

function f1() {
    // f2 : 定义在 f1 私有作用域的变量
    // 只能在 f1 及其 f1 的后代作用域内使用
    // 全局不能使用 f2
    function f2() {
        // 这里可以使用 num 吗 ?
        // 可以, 因为 f2 是 f1 的后代作用域
        console.log(num);
    }
    f2()
    // num 只能在 f1 和 f1 的后代作用域内使用
    var num = 100
}
f1()

访问规则
●当我想获取一个变量的值的时候,我们管这个行为叫做 访问
●获取变量的规则:
○首先,在自己的作用域内部查找,如果有,就直接拿来使用
○如果没有,就去上一级作用域查找,如果有,就拿来使用
○如果没有,就继续去上一级作用域查找,依次类推
○如果一直到全局作用域都没有这个变量,那么就会直接报错(该变量 is not defined)


var num = 100
function fn() {
    var num2 = 200
    function fun() {
        var num3 = 300
        console.log(num3) // 自己作用域内有,拿过来用
        console.log(num2) // 自己作用域内没有,就去上一级,就是 fn 的作用域里面找,发现有,拿过来用
        console.log(num) // 自己这没有,去上一级 fn 那里也没有,再上一级到全局作用域,发现有,直接用
        console.log(a) // 自己没有,一级一级找上去到全局都没有,就会报错
    }
    fun()
}
fn()

○变量的访问规则 也叫做 作用域的查找机制
○注意:作用域的查找机制只能是向上找,不能向下找


function fn() {
    var num = 100
}
fn()
console.log(num) // 发现自己作用域没有,自己就是全局作用域,没有再上一级了,直接报错

案例


var n = 100
function fn(n) {
    // 形参 n 就相当于 fn 函数内部的私有变量 n
    // fn 私有作用域内有 n 变量, 值是 undefined
    var n = 200
    function fun() {
        // var n = 300
        console.log(n)
    }
    fun()
}
fn()

赋值规则
●当你想给一个变量赋值的时候,那么就先要找到这个变量,在给他赋值
●变量赋值规则:
○先在自己作用域内部查找,有就直接赋值
○没有就去上一级作用域内部查找,有就直接赋值
○还没有再去上一级作用域查找,有就直接赋值
○如果一直找到全局作用域都没有,那么就把这个变量定义为全局变量,再给他赋值


function fn() {
    num = 100
}
fn()
// fn 调用以后,要给 num 赋值
// 查看自己的作用域内部没有 num 变量
// 就会向上一级查找
// 上一级就是全局作用域,发现依旧没有
// 那么就会把 num 定义为全局的变量,并为其赋值
// 所以 fn() 以后,全局就有了一个变量叫做 num 并且值是 100
console.log(num) // 100

案例


// var n = 100
function fn() {
    //   因为 var n 这句代码, 导致 fn 私有作用域内有 n 这个私有变量
    // var n = 200
    console.log('n 赋值之前 :', n)
    n = 300
    console.log('n 赋值之后 :', n)
}
console.log('fn 执行之前 : ', n)
// 因为 fn 函数内的某一行代码执行
// 导致在全局定义了一个叫做 n 的变量
fn()
console.log('fn 执行之后 : ', n)

作用域链
●变量取值是到创建这个变量的函数的作用域中取值。但是如果在当前作用域中没有查找到值,就会向上级作用域去查找,直到查找到全局作用域,这么一个查找过程形成的链条就叫做作用域链
●由于变量的查找是沿着作用域链来实现的,所以也称作用域链为变量查找的机制



相关推荐

七条简单命令让您玩转Git
七条简单命令让您玩转Git

凭借着出色的协作能力、快速部署效果与代码构建辅助作用,Git已经得到越来越多企业用户的青睐。除了用于开发商业及消费级应用之外,众多科学及政府机构也开始尝试使用这...

2023-10-07 12:14 guanshanw

基本完整的关于Git分支branch的操作
基本完整的关于Git分支branch的操作

Git使用背景项目中要用到dev或者其他分支开发完代码,需要将该分支合并到master的需求操作步骤下面以dev名称为lex为分支名为例来操作一遍客户端操作:...

2023-10-07 12:14 guanshanw

Git 进阶(合并与变基)
Git 进阶(合并与变基)

在Git中整合来自不同分支的修改主要有两种方法:合并(merge)以及变基(rebase)合并(merge)merge流程图merge的原理是找到这两个分...

2023-10-07 12:13 guanshanw

Git学习笔记 003 Git进阶功能 part5 合并(第一部分)

合并(merge)是很常用的操作。尤其是一个庞大的很多人参与开发的企业级应用。一般会设定一个主分支,和多个副分支。在副分支开发完成后,合并到主分支中。始终保持主分支是一个完整的,稳定的最新状态的分支。...

非标题党,三张图帮你理解git merge和git rebase的区别
非标题党,三张图帮你理解git merge和git rebase的区别

初始场景:基于正常的开发分支修改几个小bug,然后在合并到开发分支上。gitmergegitcheckoutfeaturegitmergeho...

2023-10-07 12:13 guanshanw

git 初次使用(01)
git 初次使用(01)

先从github上克隆代码下来:使用vscode克隆代码如下图,填写上github仓库地址:vscode有时候克隆代码速度比较慢,可以用命令行方式克隆gitc...

2023-10-07 12:12 guanshanw

Git 远程操作

4.Git远程操作命令说明gitremote远程版本库操作gitfetch从远程获取版本库gitpull下载远程代码并合并gitpush上传远程代码并合并4.1远程版本库操作gitre...

Git常用命令-总结
Git常用命令-总结

创建git用户$gitconfig--globaluser.name"YourName"$gitconfig--globaluser.em...

2023-10-07 12:12 guanshanw

git中删除从别人clone下来项目的git信息,并修改为自己的分支

如果你从别人的Git存储库中克隆了一个项目,并想要删除与该存储库相关的Git信息,并将其修改为你自己的分支,则可以执行以下步骤:使用gitclone命令克隆存储库:gitclone<u...

git系列-回滚和放弃本地修改

回滚历史提交就是reset的功能。这种情况是已经提交远程仓库,需要回滚到之前的提交。gitreset--hardcommitId//注:强制提交后,当前版本后面的提交版本将会删掉!gi...

GIT使用小技巧大全
GIT使用小技巧大全

在大型软件工程的开发过程中,版本控制是无法绕过去的;目前来说,最火的版本控制软件就是GIT了。早两年SVN比较火,不过被大神linus喷了几次后,就日落西山了,...

2023-10-07 12:11 guanshanw

git相关命令-上
git相关命令-上

这些命令都是看了文档后,个人觉得比较有用的一些,展示给大家。回到远程仓库的状态抛弃本地所有的修改,回到远程仓库的状态。gitfetch--all&...

2023-10-07 12:10 guanshanw

Git命令行接口:掌握Git的必备技能
Git命令行接口:掌握Git的必备技能

Git是一款强大的分布式版本控制工具,它支持命令行界面操作。熟练掌握Git命令行接口,是开发者使用Git的必备技能之一。在这篇文章中,我们将介绍Git命令行接口...

2023-10-07 12:10 guanshanw

Git命令详解
Git命令详解

相信各位小伙伴们应该都对git有一些了解,毕竟作为代码管理的神器,就算不是IT行业的小伙伴肯定也或多或少的听说过一些。今天就来和小伙伴们分享一下自己总结的常用命...

2023-10-07 12:10 guanshanw

工作7年收集到的git命令
工作7年收集到的git命令

概念git中的术语解释:仓库也叫版本库(repository)stage:暂存区,add后会存到暂存区,commit后提交到版本库git安装linux...

2023-10-07 12:10 guanshanw

取消回复欢迎 发表评论: