js函数和变量的声明与执行顺序
一、函数执行顺序
1、正常顺序
function f(){
alert(2);
}
f(); //alert 2
所有浏览器都能测试通过。
2、倒序调用
f(); //alert 2
function f(){
alert(2);
}
之前一些浏览器会报undefined,不过,目前的版本大多都可以了
3、含参函数倒序
f(2); //alert 2
function f(a){
alert(a);
}
目前主流浏览器一样可以正常测试通过
4、声明式函数和赋值式函数
f();
function f(){ //声明式函数
alert(2);
}
f1();
var f1 = function () { //赋值式函数
alert(2);
}
声明式函数与赋值式函数的区别在于:在JS的预编译期,声明式函数将会先被提取出来,然后才按顺序执行js代码。
二、变量执行顺序
1、正常顺序
var a =2;
alert(a); //alert 2
alert(a); //alert 2
2、倒序使用变量
alert(a); //alert undefined
var a =2;
在变量未定义之前使用,会返回undefined。
3、局部变量的执行
*注意:js中全局var声明的为全局变量 函数体内var声明为局部变量(函数外部访问不到)但是,函数体内未用var声明的为全局变量(函数外部可以使用)
function f(){
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;
function f(){
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); //
alert(b); //
})();
alert(a); //undefined
alert(b); //
三、总结
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.函数的执行方法 最好在 函数的定义 之后
js函数和变量的声明与执行顺序的更多相关文章
- js函数和变量的执行顺序【易错】
js函数和变量的声明与执行顺序 一.函数执行顺序 1.正常顺序 function f(){ alert(2); } f(); //alert 2 所有浏览器都能测试通过. 2.倒序调用 f(); // ...
- js 函数和变量的提升
js 函数和变量的提升 1. 函数的作用域: js中 ,函数的作用域为函数,而不是大括号. var hei = 123;if(true){ hei = 456;}console.log(hei);// ...
- JS函数和变量
JS函数和变量 函数: 函数是由事件或者当它被调用时执行的可重复使用的代码块. 是一个独立的代码块,实现特定功能模块. 函数他不进行调用触发的话,不会自己主动执行. 像ATM机一样,不去取钱的话不会 ...
- js函数、变量提升(hoisting)
其实我只是想复习下变量提升的,然后看到了函数提升,然后再看到了函数声明.函数表达式. 有必要怀着敬仰之心提及园子里的TOM大叔的解密命名函数表达式,不愧是大叔,好好地脑补了下基础知识. 在ECMASc ...
- JS基础_变量的声明提前、函数的声明提前
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- JS函数、变量作用域
函数参数 函数的()中指定一个或多个形参(形式参数),多个形参之间用,号隔开,声明形参相当于在函数内部声明了对应的变量,但不赋值.在调用时在()中指定实参 调用时解析器不会检查实参类型.数量,实参可 ...
- JS函数和变量名称冲突
在JS中如果函数名与变量名冲突,JS是怎么执行的? <script> console.log(sum);//function sum(){} function sum(){} var su ...
- MIC中函数和变量的声明
c++/c使用 __declspec(target(mic))函数或变量声明 或 __attribute__((target(mic)))函数或变量声明 举例如下: __attribute__((ta ...
- [转]js 判断js函数、变量是否存在
本文转自:http://blog.csdn.net/liang4571231/article/details/4042519 在进行js编程时,总会出现可能一些函数或者变量未定义而被引用,导致报错的情 ...
随机推荐
- Confluence 6 复杂授权或性能问题
提交一个 服务器请求(support request) 然后在你的服务请求中同时提供下面的信息. Confluence 服务器 登录 Confluence 然后访问管理员控制台. 将 系统信息(Sys ...
- Winhex数据恢复学习笔记(三)
上次对文件系统进行简单的分析,这次就文件的镜像功能做一介绍 1.首先镜像的概念:镜像就是数据的副本,是原来数据在相同位置上以相同的排列模式生成的拷贝,所以镜像可以用来还原原始数据,代替原始数据工作,镜 ...
- 支付宝WAP支付总结
一:支付宝开放文档: 支付宝手机网站支付的开发文档: https://docs.open.alipay.com/203 二:配置应用环境: 开发者调用接口前需要先生成RSA2密钥,RSA2密钥包含应用 ...
- 开放系统的直连式存储(Direct-Attached Storage,简称DAS)
开放系统的直连式存储(Direct-Attached Storage,简称DAS)已经有近四十年的使用历史,随着用户数据的不断增长,尤其是数百GB以上时,其在备份.恢复.扩展.灾备等方面的问题变得日益 ...
- jetbrains全系列可用例:IDEA、WebStorm、phpstorm、clion等激活到2099
破解补丁激活 之前看了好多的其它的方法感觉都不是很靠谱还是这个本人亲试可以长期有效不仅能激活pycharm.jetbrains全系列可用例:IDEA.WebStorm.phpstorm.clion等激 ...
- Scrapy项目创建以及目录详情
Scrapy项目创建已经目录详情 一.新建项目(scrapy startproject) 在开始爬取之前,必须创建一个新的Scrapy项目.进入自定义的项目目录中,运行下列命令: PS C:\scra ...
- ES优化总结
ES优化总结(特别是在bulk大量数据到ES的时候) https://blog.csdn.net/chenxun_2010/article/details/78602795 将 ELASTICSEAR ...
- es6 新增字符串方法
es6新增了4个字符串处理的方法:startsWith,endsWith,includes,repeat. 1.简单使用 includes()返回布尔值,表示是否找到了参数字符串 startsWith ...
- 【Codeforces】Codeforces Round #551 (Div. 2)
Codeforces Round #551 (Div. 2) 算是放弃颓废决定好好打比赛好好刷题的开始吧 A. Serval and Bus 处理每个巴士最早到站且大于t的时间 #include &l ...
- Flask Web中用MySQL代替SQLite
由于.sqlite文件操作的诸多不便,决定常识用MySQL代替书上的SQLite作为数据库. 1.在虚拟环境中安装mysql-Python具体步骤为: <1> 安装python-dev s ...