通俗易懂详解Scope

原创 2016年09月09日 15:31:45
简单认识js作用域
var a = 1;

if(true){
    var b = 1;
}

console.log(b) //1

在面向对象的强语言中(Java,C……),其作用域都是基于块的(即:{}),块内可以对块外的变量进行操作,但是块外却对块内的变量是无法操作的。但是JS呢?一门弱语言,其并没有实现基于块的作用域,而是基于function的,因此上面的代码运行出来的结果b并不是undefined,说明最终a和b是定义在一个Scope内的。

预编译(变量提升)
var a = 1;
var b = 2;

function doit(){
    console.log(b);
    var b = 3;
    console.log(b);
}

doit();

console.log(b);

//undefined
//3
//2

相当于下面

var a = 1;
var b = 2;

function doit(){
    var b;
    console.log(b);
    b = 3;
    console.log(b);
}

doit();

console.log(b);

//undefined
//3
//2

讲到了Scope,不得不讲一讲js的预编译,为什么我们得到的第一个log的结果为undefined呢?按照强语言的思路来说这里应该是2才对呀,这就是js的预编译。js的代码在首次被加载完成后进行编译时,会将所有的function和var提前进行声明,但是并不会对其进行赋值,赋值则都是在该代码块进行执行时才会对其进行赋值,那么第一个log则是在预编译为b进行了声明后,这时b是没有时行赋值的,所以会log出undefined。

由于js是基于function来创建Scope的,所以只有doit执行时才会创建新的Scope

版权声明:本文为博主原创文章,未经博主允许不得转载。

全面解读HTTP Cookie

今天webryan给team做了一个关于HTTP cookie的分享,从各个方面给大家介绍一下大家耳熟能详的Cookie。主要是翻了维基百科的很多内容,因为维基百科的逻辑实在是很清晰:),ppt就不分...
  • zzy7075
  • zzy7075
  • 2016年10月15日 09:02
  • 565

Spring scope属性详解

摘自《Spring 解密》 scope用来声明IOC容器中的对象应该处的限定场景或者说该对象的存活空间,即在IOC容器在 对象进入相应的scope之前,生成并装配这些对象,在该对象不再处于这些s...
  • smile_from_2015
  • smile_from_2015
  • 2016年04月27日 11:05
  • 1631

spring中的scope详解

0.思维导图 1. scope概论 spring中scope是一个非常关键的概念,简单说就是对象在spring容器(IOC容器)中的生命周期,也可以理解为对象在spring容器中的创建方式。 2...
  • weinabanta
  • weinabanta
  • 2014年10月16日 22:40
  • 24578

javascript变量的作用域--ExtJS scope必备法宝

javascript变量的作用域--ExtJS scope必备法宝 博客分类:  javascript JavaScriptEXTFirebugFirefox浏览器  ...
  • evilcry2012
  • evilcry2012
  • 2015年12月11日 11:50
  • 234

通俗易懂的USB协议详解(转载)

转自东海的博客http://6xudonghai.blog.163.com/blog/static/3364062920086253155137/ USB作为一种串行接口,应用日益广泛。如同每个...
  • yu704645129
  • yu704645129
  • 2014年09月15日 11:54
  • 1192

AngularJS内幕详解之 Scope

在AngularJS的代码库中呈现出了大量有趣的设计,最有趣的两个例子是scope的工作方式和directives(指令)的表现。 有的人第一次接触AngularJS时就被告知directive...
  • alex8046
  • alex8046
  • 2016年08月24日 14:06
  • 4711

简单易懂的USB协议理解

通俗易懂的USB协议详解(转载) 转自 Branchesss的博客:http://blog.sina.com.cn/s/blog_8bbf650701013mub.html USB...
  • aba13579
  • aba13579
  • 2014年03月11日 14:39
  • 954

日志库EasyLogging++学习系列(9)—— 性能跟踪功能

性能跟踪是 Easylogging++ 其中一个非常显著的功能,而且使用起来也十分简单。如果在Windows平台下使用性能跟踪的话,其原理是基于 Windows API函数 GetSystemTime...
  • Qsir
  • Qsir
  • 2017年06月16日 16:53
  • 241

Android 神兵利器Dagger2使用详解(四)Scope注解的使用及源码分析

前言在我的上一篇文章Android 神兵利器Dagger2使用详解(三)进阶篇,不可自拔爱上Dagger2 中,我们以简单的案例对Dagger2依赖注入库在实际开发中的使用方法进行了学习。本文内容: ...
  • mq2553299
  • mq2553299
  • 2017年06月18日 11:58
  • 1147

[AngularJS面面观] 9. scope事件机制 - 基本概念以及生命周期

发布-订阅模式(Publish-Subscribe Pattern) 事件的生命周期-注册和注销 事件与scope继承树-$emit以及$broadcast 事件的停止传播以及阻止默认行为 事件在sc...
  • dm_vincent
  • dm_vincent
  • 2016年07月04日 00:09
  • 4667
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:通俗易懂详解Scope
举报原因:
原因补充:

(最多只允许输入30个字)