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 相关文章推荐
js每次Title显示不同的名言
Sep 25 Javascript
jQuery链式操作如何实现以及为什么要用链式操作
Jan 17 Javascript
关于JS字符串函数String.replace()
Apr 07 Javascript
详解JavaScript函数对象
Nov 15 Javascript
jQuery插件Flexslider实现图片轮播、图文结合滑动切换效果
Apr 16 Javascript
关于Javascript中defer和async的区别总结
Sep 20 Javascript
详解Node.js串行化流程控制
May 04 Javascript
基于Vue2.0+ElementUI实现表格翻页功能
Oct 23 Javascript
layui结合form,table的全选、反选v1.0示例讲解
Aug 15 Javascript
Laravel 如何在blade文件中使用Vue组件的示例代码
Jun 28 Javascript
详解如何在Javascript中使用Object.freeze()
Oct 18 Javascript
vue使用v-model进行跨组件绑定的基本实现方法
Apr 28 Vue.js
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
使用session判断用户登录用户权限(超简单)
2013/06/08 PHP
thinkphp控制器调度使用示例
2014/02/24 PHP
基于PHP制作验证码
2016/10/12 PHP
Thinkphp5.0框架的Db操作实例分析【连接、增删改查、链式操作等】
2019/10/11 PHP
为radio类型的INPUT添加客户端脚本(附加实现JS来禁用onClick事件思路代码)
2010/11/11 Javascript
关于extjs4如何获取grid修改后的数据的问题
2013/08/07 Javascript
使用apply方法实现javascript中的对象继承
2013/12/16 Javascript
简介JavaScript中Boolean.toSource()方法的使用
2015/06/05 Javascript
easyui取消表单实时验证,提交时统一验证的简单实例
2016/11/07 Javascript
Vue.js双向绑定实现原理详解
2016/12/22 Javascript
使用jquery给新生的th绑定hover事件的实例
2017/02/10 Javascript
使用Vue构建可重用的分页组件
2018/03/26 Javascript
Vue插值、表达式、分隔符、指令知识小结
2018/10/12 Javascript
解决iview多表头动态更改列元素发生的错误的方法
2018/11/02 Javascript
JavaScript使用小插件实现倒计时的方法讲解
2019/03/11 Javascript
JavaScript深入V8引擎以及编写优化代码的5个技巧
2019/06/24 Javascript
vuex + keep-alive实现tab标签页面缓存功能
2019/10/17 Javascript
微信小程序中的video视频实现 自定义播放按钮、封面图、视频封面上文案
2020/01/02 Javascript
jquery实现加载更多"转圈圈"效果(示例代码)
2020/11/09 jQuery
Python中pip安装非PyPI官网第三方库的方法
2015/06/02 Python
Python 绘图和可视化详细介绍
2017/02/11 Python
详解Python里使用正则表达式的ASCII模式
2017/11/02 Python
python实现决策树分类算法
2017/12/21 Python
解决PyCharm控制台输出乱码的问题
2019/01/16 Python
python小程序基于Jupyter实现天气查询的方法
2020/03/27 Python
Django form表单与请求的生命周期步骤详解
2020/06/07 Python
matplotlib bar()实现百分比堆积柱状图
2021/02/24 Python
Sunglasses Shop瑞典:欧洲领先的太阳镜网上商店
2018/04/22 全球购物
PatPat阿根廷:妈妈们的购物平台
2019/05/30 全球购物
信息工作经验交流材料
2014/05/28 职场文书
投标单位介绍信
2015/05/05 职场文书
行政处罚听证告知书
2015/07/01 职场文书
遇事可以测出您的见识与格局
2019/09/16 职场文书
ThinkPHP5和ThinkPHP6的区别
2021/03/31 PHP
详解JAVA中的OPTIONAL
2021/06/14 Java/Android
Win11安装升级时提示“该电脑必须支持安全启动”
2022/04/19 数码科技