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+CSS实现简单滑动门(滑动菜单)效果
Sep 19 Javascript
JQuery异步加载PartialView的方法
Jun 07 Javascript
JavaScript性能优化之函数节流(throttle)与函数去抖(debounce)
Aug 11 Javascript
JavaScript编码风格指南(中文版)
Aug 26 Javascript
自定义require函数让浏览器按需加载Js文件
Nov 24 Javascript
js实现九宫格拼图小游戏
Feb 13 Javascript
Bootstrap Table 在指定列中添加下拉框控件并获取所选值
Jul 31 Javascript
vue中appear的用法
Aug 17 Javascript
ES6基础之展开语法(Spread syntax)
Feb 21 Javascript
vue过滤器用法实例分析
Mar 15 Javascript
浅谈webpack 四个核心概念之Entry
Jun 12 Javascript
vue组件暴露和.js文件暴露接口操作
Aug 11 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
删除及到期域名的查看(抢域名必备哦)
2008/05/14 PHP
PHPMailer安装方法及简单实例
2008/11/25 PHP
php中转义mysql语句的实现代码
2011/06/24 PHP
探讨如何使用SimpleXML函数来加载和解析XML文档
2013/06/07 PHP
通过table标签,PHP输出EXCEL的实现方法
2013/07/24 PHP
PHP入门教程之自定义函数用法详解(创建,调用,变量,参数,返回值等)
2016/09/11 PHP
win7 wamp 64位 php环境开启curl服务遇到的问题及解决方法
2018/09/16 PHP
说说JSON和JSONP 也许你会豁然开朗
2012/09/02 Javascript
JS中产生20位随机数以0-9为例也可以是a-z A-Z
2014/08/01 Javascript
jquery实现全选功能效果的实现代码
2016/05/05 Javascript
jQuery鼠标悬停内容动画切换效果
2017/04/27 jQuery
Vue.JS项目中5个经典Vuex插件
2017/11/28 Javascript
仿京东快报向上滚动的实例
2017/12/13 Javascript
React中嵌套组件与被嵌套组件的通信过程
2018/07/11 Javascript
Element UI 自定义正则表达式验证方法
2018/09/04 Javascript
Angular6 正则表达式允许输入部分中文字符
2018/09/10 Javascript
深入浅析Vue 中 ref 的使用
2019/04/29 Javascript
解决Layui中templet中a的onclick参数传递的问题
2019/09/20 Javascript
VUE table表格动态添加一列数据,新增的这些数据不可以编辑(v-model绑定的数据不能实时更新)
2020/04/03 Javascript
Jquery如何使用animation动画效果改变背景色的代码
2020/07/20 jQuery
微信小程序自定义yPicker组件实现省市区三级联动功能
2020/10/29 Javascript
[43:41]VP vs RNG 2019国际邀请赛淘汰赛 败者组 BO3 第二场 8.21.mp4
2020/07/19 DOTA
python利用MethodType绑定方法到类示例代码
2017/08/27 Python
django实现同一个ip十分钟内只能注册一次的实例
2017/11/03 Python
python+selenium识别验证码并登录的示例代码
2017/12/21 Python
python实现飞机大战游戏
2020/10/26 Python
CentOS6.9 Python环境配置(python2.7、pip、virtualenv)
2019/05/06 Python
WxPython实现无边框界面
2019/11/18 Python
Keras实现支持masking的Flatten层代码
2020/06/16 Python
节水倡议书范文
2014/04/15 职场文书
网上祭英烈活动总结
2015/02/04 职场文书
夫妻吵架保证书
2015/05/08 职场文书
初中英语教师个人工作总结2015
2015/07/21 职场文书
SpringBoot系列之MongoDB Aggregations用法详解
2022/02/12 MongoDB
css3新特性的应用示例分析
2022/03/16 HTML / CSS
vue css 相对路径导入问题级踩坑记录
2022/06/05 Vue.js