美文网首页
js函数和变量的执行顺序【详解】【易错】

js函数和变量的执行顺序【详解】【易错】

作者: thekings | 来源:发表于2017-12-12 12:47 被阅读0次

一、函数执行顺序

1、正常顺序

function f(){

alert(2);

}f();

//alert 2

所有浏览器都能测试通过。

2、倒序调用

f();

//alert 2

function f(){

alert(2);

}

之前一些浏览器会报undefined,不过,目前的版本大多都可以了

3、含参函数倒序

f(2);

//alert 2

functionf(a){

alert(a);

}

目前主流浏览器一样可以正常测试通过

4、声明式函数和赋值式函数

f();

functionf(){

//声明式函数

alert(2);

}

f1();

var f1 =function() {//赋值式函数

alert(2);

}

声明式函数与赋值式函数的区别在于:在JS的预编译期,声明式函数将会先被提取出来,然后才按顺序执行js代码。

二、变量执行顺序

1、正常顺序

var a  =2;

alert(a);//alert 2

2、倒序使用变量

alert(a);//alert undefined

var a  =2;

在变量未定义之前使用,会返回undefined。

3、局部变量的执行

*注意:js中全局var声明的为全局变量  函数体内var声明为局部变量(函数外部访问不到)但是,函数体内未用var声明的为全局变量(函数外部可以使用)

functionf(){

alert(a);

a = 3;

}

f();//error: a is not defined

这里Firefox的控制台中会报错ReferenceError(引用错误):a 未被定义。。。。所以建议函数体内最好用var声明变量,保持局部性 如:

function f(){

alert(a);

var a = 3;

}

f();//undefined

这里alert语句可以弹出,虽然是undefined ,但是没有报错,这是为什么呢??

事实上,JS的解析过程分为两个阶段:预编译期(预处理)执行期

预编译期JS会对本代码块中的所有var声明的变量和函数进行处理(类似与C语言的编译),但需要注意的是此时处理函数的只是声明式函数,而且变量也只是进行了声明但未进行初始化以及赋值。

执行期会按照代码块的顺序逐行执行。。

*函数再度声明赋值,函数f()内有局部变量a时,会优先使用自己的变量,只不过第一次alert时未赋值

var a = 1;

function f(){

alert(a);

var a = 3;

alert(a);

}

f();//undefined 和 3

*函数再度全局声明,会修改全局的a

var a = 1;

functionf(){

alert(a);

a = 2;

alert(a);

}

f();//1 和 2

*函数内全局赋值一次,var声明一次    函数f()内还是会优先使用自己的变量a

var a = 1;//函数f()内变量a的执行顺序

function f(){

alert(a);

a= 2;//#2

alert(a);

var a = 3;//等价于 var a ;      #1

              //a = 3 ;      #3

alert(a);

}

f();//undefined 2 和 3

alert(a);//1

函数f()内 变量a 声明与赋值 的执行顺序如上,应该很明确了!!

*一个经典的例子复习一下:

var a,b;

(function(){

alert(a);          //undefined

alert(b);          //undefined

var a=b=3;            //等价于 var a = 3 ; b = 3; b是全局的

alert(a);          //3

alert(b);          //3

})();

alert(a);              //undefined

alert(b);              //3

三、总结

1、JS的解析过程分为两个阶段:预编译期(预处理)执行期

预编译期 JS会对本代码块(两个script块互不影响)中的所有var声明的变量函数进行处理(类似与C语言的编译)

此时处理函数的只是声明式函数,而且变量也只是进行了声明但未进行初始化以及赋值。

执行期 会按照代码块的顺序筑行执行

2、把执行方法写在函数定义之前是不太规范的,但这个界限被弱化了。如今在一个作用范围之内,都可以被正常调用。

所以,建议和优化如下:

1.函数体内变量最好var声明为局部,保持安全性和局部性。

2.所有变量的声明最好一次性写在作用域的顶端,函数不必需如此,如:

function f(){

var a, b, c;

a = "abc";

b = [1,3,1];

c = 12;

}

3.函数的执行方法 最好在 函数的定义 之后


来源:https://www.cnblogs.com/highshao/p/5442460.html

相关文章

网友评论

      本文标题: js函数和变量的执行顺序【详解】【易错】

      本文链接:https://www.haomeiwen.com/subject/chwgixtx.html