Javascript面向对象编程指南(三)

变量的作用域

这是一个至关重要的为题。特别是当我们从别的语言转向JS的时,必须要明白这一点,即在Javascript中,变量的定义并不是以代码块作为作用域的,而是以函数作为作用域的。也就是说,如果变量是在某个函数中定义的,那么它在函数以外的地方是不可见的。而如果变量是定义在if或者for这样的代码块中的,它在代码块以外是可见的。另外,在Javascript中,术语“全局变量”指的是定义在所有函数之外的变量(也就是定义在全局代码中的变量),与之相对的是“局部变量”,所指的则是在某个函数中定义的变量。其中,函数内的代码可以像访问自己的局部变量那样访问全局变量,反之,则不行。

下面来看一个具体演示,请注意两点:

  • 函数f()可以访问变量global;
  • 在函数f()以外,变量local是不存在的。
var global = 1;
function f() {
  var local = 2;
  global ++;
  return global;
}

f();  // 2
f();  // 3
local;  // local is not defined

这里还有一点很重要,如果我们声明一个变量时没有使用var语句,该变量就会被默认为全局变量。

最佳实践

  • 尽量将全局变量的数量降到最低,以避免命名冲突,因为如果有两个人在同一脚本的不同函数中使用了相同的全局变量名,就很容易到很容易导致不可预测的结果喝难以观察的bug
  • 最好总是使用var语句来声明变量
  • 可以考虑使用“单一var”模式,即,仅在函数体内的第一行使用一个var来定义这个作用域中所有需要的变量。这样一来,我们就能很轻松地找到相关变量的定义,并且在很大程度上避免了不小心污染全局变量的情况。
变量提升

下面我们来看一个很有趣的例子,它显示了关于局部和全局作用域的另一个重要问题。

var a = 123;
function f(){
  alert(a);
  var a = 1;
  alert(a);
};
f();

你可能会想当然的认为alert()第一次显示的是123(也就是全局变量a的值),而第二次显示的是1(即局部变量a)。但事实上并非如此,第一个alert()实际上显示的是undefined,这是应为函数域始终优先于全局域,所以局部变量a会覆盖掉所有与它同名的全局变量,尽管在alert()第一次被调用时,a还没有被正式定义(即该值为undefined),但该变量本身已经存在于本地空间了。这种特殊的现象叫做提升

也就是说,当Javascript的执行过程进入新的函数时,这个函数内被声明的变量都会被移动(或者说被提升)到函数最开始的地方。这个概念很重要,必须牢记。另外需要注意的是,被提升的只有变量的声明,这意味着,只有函数体内声明的这些变量在该函数执行开始时就存在,而与之相关的赋值操作并不会被提升,它还在原来的位置上。譬如在上面的例子中,局部变量本身被提升到了函数开始处,但并没有在开始处就被赋值为1。这个例子可以等价为:

var a = 123;
function f() {
  var a;
  alert(a);  // undefined
  var a =1;
  alert(a)  // 1
}
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 203,772评论 6 477
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 85,458评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 150,610评论 0 337
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,640评论 1 276
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,657评论 5 365
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,590评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,962评论 3 395
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,631评论 0 258
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,870评论 1 297
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,611评论 2 321
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,704评论 1 329
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,386评论 4 319
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,969评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,944评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,179评论 1 260
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 44,742评论 2 349
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,440评论 2 342

推荐阅读更多精彩内容

  • 第一章: JS简介 从当初简单的语言,变成了现在能够处理复杂计算和交互,拥有闭包、匿名函数, 甚至元编程等...
    LaBaby_阅读 1,636评论 0 6
  • 来源:仗剑走天涯! 关于javascript的作用域的一些总结,主要参考以上文章,加上自己的整理的理解。 近日对j...
    Michael_林阅读 919评论 0 1
  • 深入理解JavaScript系列文章,包括了原创,翻译,转载,整理等各类型文章,如果对你有用,请推荐支持一把,给大...
    DaveWeiYong阅读 585评论 0 1
  • 透过六月的葱茏新翠, 看枝头洒落日光晕圈。 绿肥红瘦, 燕舞莺歌, 掬一捧清泉, 闻晶莹滴过荷叶尖尖。 稚女的白裳...
    知识管理某李阅读 164评论 1 4