JavaScript学习笔记(三):JavaScript也有入口Main函数


Posted in Javascript onSeptember 12, 2015

在C和Java中,都有一个程序的入口函数或方法,即main函数或main方法。而在JavaScript中,程序是从JS源文件的头部开始运行的。但是某种意义上,我们仍然可以虚构出一个main函数来作为程序的起点,这样一来不仅可以跟其他语言统一了,而且说不定你会对JS有更深的理解。

1. 实际的入口

当把一个JavaScript文件交给JS引擎执行时,JS引擎就是从上到下逐条执行每条语句的,直到执行完所有代码。

2. 作用域链、全局作用域和全局对象

我们知道,JS中的每个函数在执行时都会产生一个新的作用域。具体来说,在执行流程进入函数时会建立一个新的作用域,在函数执行完成退出时会销毁这个作用域。函数的形参、局部变量都会绑定到这个作用域里,当函数调用完成作用域销毁时,它们随之被销毁。当然在特殊情况下,如果函数返回时作用域中的某些变量仍然被引用,那么作用域以及这些被引用的变量就不会被销毁,从而形成所谓的闭包。

另一方面,我们知道函数是可以嵌套的,因而作用域也是可以嵌套的。函数在定义的时候,JS引擎会给每个函数设置一个称为[[scope]]内置属性,它指向外部函数的词法作用域。通过这种方式,多个作用域形成了链式结构,称为作用域链。通常情况下,在任意时刻只存在一条作用域链,即从正在执行的函数的作用域开始,层层上溯,直到最外层的全局作用域。

[注]:作用域链上的函数就是JS源码里的层层嵌套的函数,跟函数执行时的顺序或函数调用栈无关,这也是词法作用域这个称呼的由来。

全局作用域是一个特殊的作用域,它不是一个函数作用域,但它是所有函数作用域的外层作用域,也是所有作用域链的终点。因此只要程序没有退出,全局作用域总是存在的,全局作用域内的变量也是一直有效的。

[函数3的作用域]-->[函数2的作用域]-->[函数3的作用域]-->[全局作用域]

另外,对应于全局作用域,还有一个全局对象。在浏览器中,全局对象就是window对象。全局对象是个特殊的对象:

在全局作用域中定义的变量,都会绑定到全局对象。

在任意作用域中定义的变量,如果定义时没有用 var 关键字,都会绑定到全局对象。

在全局作用域中, this 指向全局对象。

从上面列举的这些特性可以看出,如果把全局作用域当成一个对象的话,那么实际上它就是全局对象。另外,这也解释了在全局作用域中,下面的四条语句为什么是等价的:

var a = 1;
a = 1;
window.a = 1;
this.a = 1;

3. 虚构的main函数

既然都是作用域,为什么要有一个特殊的全局作用域呢?我们总是喜欢简单化、一致性,而尽量避免复杂化、特殊性。所以很自然地,我们会想能否让全局作用域看起来跟函数作用域没什么区别?答案是肯定的。我们可以做这样的构想:

 我们想象,在JS引擎执行源文件时,会将文件中的代码包装到一个叫做main的函数中。然后把这个main函数作为程序的入口。
也就是说,假设一个JS文件中有这样的代码:

var a = 1;
var b = 2;

function add(x, y) {
  var z = x + y;
  return z;
}
console.log(add(a, b));

JS引擎在程序开始执行前会把它包装成一个main函数:

// 虚构的main函数
function main() {
  var a = 1;
  var b = 2;

  function add(x, y) {
    var z = x + y;
    return z;
  }

  console.log(add(a, b));
}

然后,调用这个main函数:

main._current_scope_ = window; // 将全局作用域(对象)设为window
main.call(window) // 将this指向window

4. 意义何在?

(1) JS也有了入口函数main,跟其他语言一致了。

(2) 省去了全局作用域的概念,或者说全局作用域也成了函数作用域。

(3) 通过上面对main函数的调用过程,可以明白全局作用域中的那些特殊性质的由来。

(4) 最后一点,将所有JS源码当成一个函数,是为了后面讲事件队列、事件循环做铺垫。

以上就是小编给大家介绍的JavaScript学习笔记(三):JavaScript也有入口Main函数,希望大家喜欢。

Javascript 相关文章推荐
ymPrompt的doHandler方法来实现获取子窗口返回值的方法
Jun 25 Javascript
jquery.artwl.thickbox.js  一个非常简单好用的jQuery弹出层插件
Mar 01 Javascript
jquery如何判断某元素是否具备指定的样式
Nov 05 Javascript
Eclipse下jQuery文件报错出现错误提示红叉
Jan 13 Javascript
javascript如何判断输入的url是否正确
Apr 11 Javascript
微信小程序开发之toast提示插件使用示例
Jun 08 Javascript
vue之数据交互实例代码
Jun 16 Javascript
简单快速的实现js计算器功能
Aug 17 Javascript
Vue实现active点击切换方法
Mar 16 Javascript
使用react实现手机号的数据同步显示功能的示例代码
Apr 03 Javascript
Vue实现todolist删除功能
Jun 26 Javascript
javascript实现动态时钟的启动和停止
Jul 29 Javascript
JS实现仿QQ面板的手风琴效果折叠菜单代码
Sep 11 #Javascript
JS实现仿Windows7风格的网页右键菜单效果代码
Sep 11 #Javascript
jQuery+css实现的蓝色水平二级导航菜单效果代码
Sep 11 #Javascript
js实现的后台左侧管理菜单代码
Sep 11 #Javascript
微信企业号开发之微信考勤Cookies的使用
Sep 11 #Javascript
微信企业号开发之微信考勤百度地图定位
Sep 11 #Javascript
JavaScript处理解析JSON数据过程详解
Sep 11 #Javascript
You might like
PHP 学习路线与时间表
2010/02/21 PHP
PHP hebrev()函数用法讲解
2019/02/21 PHP
Laravel框架处理用户的请求操作详解
2019/12/20 PHP
一个刚完成的layout(拖动流畅,不受iframe影响)
2007/08/17 Javascript
javascript 设置某DIV区域内的checkbox复选框
2009/11/30 Javascript
jQuery validate 中文API 附validate.js中文api手册
2010/07/31 Javascript
javascript hashtable 修正版 下载
2010/12/30 Javascript
jquery如何把参数列严格转换成数组实现思路
2013/04/01 Javascript
Jquery 切换不同图片示例代码
2013/12/05 Javascript
通过onmouseover选项卡实现img图片的变化
2014/02/12 Javascript
js实现的彩色方块飞舞奇幻效果
2016/01/27 Javascript
Angularjs通过指令监听ng-repeat渲染完成后执行脚本的方法
2016/12/31 Javascript
jQuery.parseHTML() 函数详解
2017/01/09 Javascript
JS 实现缓存算法的示例(FIFO/LRU)
2018/03/20 Javascript
浅谈ElementUI中switch回调函数change的参数问题
2018/08/24 Javascript
微信小程序实现带放大效果的轮播图
2020/05/26 Javascript
Vue项目中数据的深度监听或对象属性的监听实例
2020/07/17 Javascript
vue 子组件修改data或调用操作
2020/08/07 Javascript
[03:22]DSPL第一期精彩集锦:酷炫到底!
2014/11/07 DOTA
[01:20]DOTA2 齐天大圣至宝动态展示
2016/12/13 DOTA
Python的函数嵌套的使用方法
2014/01/24 Python
RC4文件加密的python实现方法
2015/06/30 Python
python 列表降维的实例讲解
2018/06/28 Python
python调用百度语音REST API
2018/08/30 Python
Python的条件表达式和lambda表达式实例
2019/01/31 Python
pytorch加载自己的图像数据集实例
2020/07/07 Python
非常漂亮的CSS3百叶窗焦点图动画
2016/02/24 HTML / CSS
Topman美国官网:英国著名的国际平价时尚男装品牌
2017/12/22 全球购物
Banana Republic英国官网:香蕉共和国,GAP集团旗下偏贵族风
2018/04/24 全球购物
澳大利亚领先的亚麻品牌:Bed Threads
2019/12/16 全球购物
青年文明号服务承诺
2014/03/31 职场文书
市场部岗位职责
2015/02/12 职场文书
2016年优秀教师先进事迹材料
2016/02/26 职场文书
Python的flask接收前台的ajax的post数据和get数据的方法
2021/04/12 Python
MySQL 角色(role)功能介绍
2021/04/24 MySQL
python机器学习实现oneR算法(以鸢尾data为例)
2022/03/03 Python