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 相关文章推荐
javascript 函数调用的对象和方法
Jul 01 Javascript
点击进行复制的JS代码实例
Aug 23 Javascript
使用JavaScript的ActiveXObject对象检测应用程序是否安装的方法
Apr 15 Javascript
javascript学习笔记(六)数据类型和JSON格式
Oct 08 Javascript
jQuery中:eq()选择器用法实例
Dec 29 Javascript
JS实现禁止鼠标右键的功能
Oct 15 Javascript
jQuery+HTML5实现弹出创意搜索框层
Dec 29 Javascript
Vue打包后出现一些map文件的解决方法
Feb 13 Javascript
angularjs实现对表单输入改变的监控(ng-change和watch两种方式)
Aug 29 Javascript
node.js中ws模块创建服务端和客户端,网页WebSocket客户端
Mar 06 Javascript
微信小程序 高德地图路线规划实现过程详解
Aug 05 Javascript
vue 组件内获取actions的response方式
Nov 08 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基础知识:类与对象(5) static
2006/12/13 PHP
PHP+MySQL 手工注入语句大全 推荐
2009/10/30 PHP
php smarty截取中文字符乱码问题?gb2312/utf-8
2011/11/07 PHP
THINKPHP支持YAML配置文件的设置方法
2015/03/17 PHP
基于php实现随机合并数组并排序(原排序)
2015/11/26 PHP
PHP7.1方括号数组符号多值复制及指定键值赋值用法分析
2016/09/26 PHP
详解laravel passport OAuth2.0的4种模式
2019/11/04 PHP
Javascript 定时器调用传递参数的方法
2009/11/12 Javascript
jQuery插件原来如此简单 jQuery插件的机制及实战
2012/02/07 Javascript
document.compatMode的CSS1compat使用介绍
2014/04/03 Javascript
jquery的trigger和triggerHandler的区别示例介绍
2014/04/20 Javascript
jQuery的position()方法详解
2015/07/19 Javascript
jQuery实现仿新浪微博浮动的消息提示框(可智能定位)
2015/10/10 Javascript
jQuery鼠标悬浮链接弹出跟随图片实例代码
2016/01/08 Javascript
jquery easyui DataGrid简单示例
2017/01/23 Javascript
JavaScript中从setTimeout与setInterval到AJAX异步
2017/02/13 Javascript
js HTML5 canvas绘制图片的方法
2017/09/08 Javascript
详解js中Array的方法及技巧
2018/09/12 Javascript
GOJS+VUE实现流程图效果
2018/12/01 Javascript
js实现类似iphone的网页滑屏解锁功能示例【附源码下载】
2019/06/10 Javascript
解决antd datepicker 获取时间默认少8个小时的问题
2020/10/29 Javascript
Python中Random和Math模块学习笔记
2015/05/18 Python
独特的python循环语句
2016/11/20 Python
Python上下文管理器和with块详解
2017/09/09 Python
利用pyinstaller将py文件打包为exe的方法
2018/05/14 Python
python 统计列表中不同元素的数量方法
2018/06/29 Python
python 除法保留两位小数点的方法
2018/07/16 Python
django自带调试服务器的使用详解
2019/08/29 Python
Python 实现一个手机号码获取妹子名字的功能
2019/09/25 Python
HTML5 form标签之解放表单验证、增加文件上传、集成拖放的使用方法
2013/04/24 HTML / CSS
巴西男士胡须和头发护理产品商店:Beard
2017/11/13 全球购物
CheapTickets香港机票预订网站:CheapTickets.hk
2019/06/26 全球购物
俄罗斯Sportmarket体育在线商店:用于旅游和户外活动
2019/11/12 全球购物
银行职业规划书范文
2013/12/28 职场文书
工作中个人的自我评价
2013/12/31 职场文书
心理学专业大学生职业生涯规划范文
2014/02/19 职场文书