JS执行顺序

javascript给人的直观感受是,从上往下执行,但实际上却不是这样的,先看个例子

1. console.log(test);

2. var test = "你好";

3. console.log(test);

4. console.log(test2);

第1行结果为:undefined

第3行结果为:"你好"

第4行会报错:test2 is not defined

执行第1行时,test还没有定义,为什么没像第4行一样报错?

因为javascript执行时,在同一个作用域内是先编译再执行

编译的时候会编译 function 和 var 这两个关键词定义的变量,编译完成后从上往下执行并向变量赋值

所以执行第1行时, var test 已经执行过了,所以test不会报错,而test2就会报错

需要注意的是,对 var test 执行编译时,只是先定义了 test 这个变量,并不会把 "你好" 这个值赋给test,而是到第2行时才给test赋值的,这就是为什么第1行的执行结果是 undefined

对于上面的例子,可以这样理解

//先编译 var 定义的变量

1. var test;

//编译完成后,从上到下执行代码

2. console.log(test);

3. test = "你好";

4. console.log(test);

5. console.log(test2);

再看一下function的编译执行过程

例子

test();//执行结果是"你好"

function test() {

console.log("你好");

}

模拟编译执行过程

//找到 function 定义的部分进行编译

//以函数名作为变量名,同时用函数赋值

1. var test = function (){

console.log("你好");

};

//从头执行

2. test();

编译时,function和var是有些不一样的, function编译时会把function赋值给变量,而var编译时不会赋值

再看一个例子

var a = 1;

function test() {

a = 2;

return;

function a() {}

}

test();

console.log(a); //结果还是1

为什么结果是1不是2?我们模拟下编译执行过程就理解了

var a;

var test = function (){

//原因就在这

//这里 a 已经变成了局部变量

var a = function (){};

//这时给 a 赋值,实际是给局部变量a 赋值

a = 2;

return;

}

test();

console.log(a);

原文发布于微信公众号 - 性能与架构(yogoup)

原文发表时间:2015-10-14

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏用户2442861的专栏

JAVA反射机制作用是什么

Java的反射机制是Java特性之一,反射机制是构建框架技术的基础所在。灵活掌握Java反射机制,对大家以后学习框架技术有很大的帮助。

1.8K20
来自专栏前端侠2.0

大白话讲解Promise(一)一文 的学习+新领悟

1、Promise是一个构造函数,自己身上有all、reject、resolve、then、catch。。。。。

22820
来自专栏python成长之路

自定义异常并抛出,捕获

16150
来自专栏数据结构与算法

BZOJ3585: mex(主席树)

Description   有一个长度为n的数组{a1,a2,...,an}。m次询问,每次询问一个区间内最小没有出现过的自然数。 Input   第一行n,m...

43290
来自专栏编程

python的函数(二):作用域

我们在写函数时,时常需要引用全局的变量,或对全局变量赋值。又或者偶尔遇到局部变量与全局变量同名。在处理这些问题时,python语言的游戏规则是怎样的?今天我们就...

20550
来自专栏尚国

PHP反序列化漏洞

这里你可以看到, 我代码里的类定义为: class F, 这个序列化就是 F, 我定义变量名字是filename, 它这里也是 filename, 我们可以修改...

12320
来自专栏小勇DW3

redis中各种数据类型的常用操作方法汇总

string是redis最基本的类型,你可以理解成与Memcached一模一样的类型,一个key对应一个value。 string类型是二进制安全的。意思是re...

21230
来自专栏一枝花算不算浪漫

[Java面试二]Java基础知识精华部分.

42490
来自专栏微信公众号:Java团长

探究Java虚拟机栈

Java 虚拟机的内存模型分为两部分:一部分是线程共享的,包括 Java 堆和方法区;另一部分是线程私有的,包括虚拟机栈和本地方法栈,以及程序计数器这一小部分内...

12920
来自专栏java初学

java中 i = i++和 j = i++ 的区别

418100

扫码关注云+社区

领取腾讯云代金券