博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
JavaScript变量的作用域
阅读量:6152 次
发布时间:2019-06-21

本文共 2173 字,大约阅读时间需要 7 分钟。

hot3.png

    虽然《JavaScript权威指南》这本书很好,但是有一些东西让人容易理解错。最近在恶补基础,结合这本书,我想把变量的作用域重新梳理一下:

    "一个变量的作用域(scope)是程序源代码中定义这个变量的区域。全局变量拥有全局作用域,在JavaScript代码中的任何地方都是有定义的。然而在函数内声明的变量只在函数体内有定义。"----摘自《JavaScript权威指南》第6版

     "在一些类似C语言的编程语言中,花括号内的每一段代码都具有各自的作用域,而且变量在声明他们的代码段之外是不可见的,我们称之为块级作用域。"----摘自《JavaScript权威指南》第6版

    在ECMAScript 6之前是没有块级作用域的,这里说的是ECMAScript5.1规范标准。

    变量分全局变量,局部变量。这就决定了变量的作用域:全局作用域、与函数作用域

demo1:

var scope = "global"; //声明一个全局变量function check() {        var scope = "local";    //声明一个同名的局部变量    return scope;        //返回局部变量的值,而不是全局变量的值}check();        => "local"

解:

    " 在函数体内,局部变量的优先级高于同名的全局变量。如果在函数内声明的一个局部变量or函数参数中带有的变量和全局变量重名,那么全局变量就会被局部变量所遮盖。"----摘自《JavaScript权威指南》第6版

实践证明:

var scope = "global"; //声明一个全局变量function check() {        var scope = "local";    //声明一个同名的局部变量    return scope;        //返回局部变量的值,而不是全局变量的值}check();        => "local"console.log(scope);      =>"blobal"

    书上的话容易误导人,很多人一开始把这里的"遮盖"当成了覆盖,想当然认为全局变量scope的值变成了"local",实则不然。 在函数体内,局部变量的优先级高于同名的全局变量。其实check函数返回就是局部变量scope,而不是全局变scope;两者只是同名而已。

demo2:

scope = "global"; //声明一个全局变量,不使用var声明function t() {        scope = "local";    //修改了全局变量    myscope = "local;    //声明一个新的全局变量    return [scope,myscope];        //返回两个值}t();        scope => "local"    myscope => "local" //两者都为 "local"

解:

    在js中,如果给一个没有声明的变量赋值,都是全局变量,而且是全局对象的属性。

demo3:

var scope="global";  //声明一个全局变量function t(){      console.log(scope);      var scope="local"      console.log(scope);  }  t();     scope => 第一次为 undefined      第二次才为 "local"

解:

       很多人勿认为第一次打印的是全局变量,其实不然。 js函数作用域:指在函数内声明的所有变量在函数体内始终是可见的。有意思的是,这意味着变量在声明之前甚至已经可用。js这个特性被非正式地成为声明提前。即:js函数里声明的所有变量都(不涉及赋值)被“提前”到函数体的顶部。

    上述过程等价:将函数内的变量声明“提前”至函数体顶部,变量初始化留在原来的位置。等价于如下的代码:

var scope="global";  //声明一个全局变量function t(){      var scope;    //顶部声明了局部变量    console.log(scope);  //变量存在,但未初始化    scope="local"     //初始化并赋值    console.log(scope);  }  t();

函数内声明的变量都是局部变量,函数外是无法访问的,外部想要访问函数内的变量可以采用闭包来实现,代码实例如下:

demo4:

function t (){    var x=10;    return function () {        return x;    }}console.log(x);    //报错,x未定义var a = t();console.log(a());    //10

在js编写当中,由于规范太少,写法灵活,可能导致出现各种bug。声明变量时,最好放在函数体顶部,增加易读性。

es6中,增加了很多特性,js的规范越来越标准化,已成为一门通吃各个平台的语言,加油!

转载于:https://my.oschina.net/wjj328938669/blog/633177

你可能感兴趣的文章
SQL Server编程系列(1):SMO介绍
查看>>
在VMware网络测试“专用VLAN”功能
查看>>
使用Formik轻松开发更高质量的React表单(三)<Formik />解析
查看>>
也问腾讯:你把用户放在什么位置?
查看>>
CSS Sprites 样式生成工具(bg2css)
查看>>
[转]如何重构代码--重构计划
查看>>
类中如何对list泛型做访问器??
查看>>
C++解析XML--使用CMarkup类解析XML
查看>>
P2P应用层组播
查看>>
Sharepoint学习笔记—修改SharePoint的Timeouts (Execution Timeout)
查看>>
CSS引入的方式有哪些? link和@import的区别?
查看>>
Redis 介绍2——常见基本类型
查看>>
asp.net开发mysql注意事项
查看>>
(转)Cortex-M3 (NXP LPC1788)之EEPROM存储器
查看>>
ubuntu set defult jdk
查看>>
[译]ECMAScript.next:TC39 2012年9月会议总结
查看>>
【Xcode】编辑与调试
查看>>
用tar和split将文件分包压缩
查看>>
[BTS] Could not find stored procedure 'mp_sap_check_tid'
查看>>
PLSQL DBMS_DDL.ALTER_COMPILE
查看>>