执行环境

执行环境是什么?

  • javascript的解释器每次开始执行一个函数时,都会为每个函数创建一个执行环境(execution context)。
  • 执行环境定义了变量或者函数有权访问的其他数据,决定了他们各自的行为。
  • 与执行环境相关的变量对象(ariable object)中有执行环境定义的所有变量和函数

作用域链

  • 代码在一个环境中执行,便会创建变量对象的一个作用域链(scope chain)。
  • 作用域链的作用是,保证对执行环境有权访问的所有变量和函数的有序访问
  • 如果环境是函数,则其活动对象(active object)为环境变量
  • 活动对象最开始含有一个变量,名为arguments对象(该变量全局中不存在)
  • 作用域链的下一个对象来自包含对象,再下一个对象来自下一个包含环境...
  • 标识符的解析是沿着作用域链逐级向上搜索标识符的过程
  • 通过try catch/with 来延长作用域
  • 没有块级作用域(类C的花括号)

代码示例

var color = "blue";function changeColor(){if(color == "blue"){color = "red";}else{color = "blue";}
}
changeColor();
alert(color); // red
var color = "blue";function changeColor(){var anotherColor = "red";function swapColor(){var tempColor = anotherColor;anotherColor = color;color = tempColor;// 能访问 color和anotherColor,tempColor}
// 能访问 color和anotherColorswapColor();alert(color);alert(anotherColor);
}
// 能访问 color
changeColor();
alert(color);
alert(anotherColor);  //不能被访问到 undefined<pre><code><br />####js 垃圾回收 Garbage Collection(GC)
&gt; - javascript具有自动垃圾回收机制
- 两种策略,标记清除和引用计数
​- 标记清除(较为常见),第一遍标记所有变量,第二次标记待清除变量
- 引用计数,通过检测变量引用次数的值判定是否变量可以被回收,问题是存在循环引用问题####Function 类型
&gt; - 每个函数都是Function类型的实例
- 函数是对象,具有属性和方法,函数名实际上便是指向函数对象的指针
- 函数定义的三种方式
- 函数没有重载,后定义的会覆盖之前的
- 将函数名作为变量进行传参
- 函数的两个内部属性**`arguments`**和**`this`**还有一个**`caller`**
- 函数的属性(有个疑问,和内部属性什么区别么),两个`length`(参数个数)和`prototype`
- 两个非继承方法`apply()` `call()`####代码示例
*函数的三种定义方式*
</code></pre>// 函数定义的三种方式
// 函数声明
function sum(num1,num2){return num1 + num2;
}// 函数表达式
var sum  = function(num1,num2){return num1 + num2;
};// 使用Function构造函数  两次代码解析性能慢 不推荐
var sum = new Function("num1","num2","return num1 + num2");<pre><code>​*函数声明提升(function declaration hositing)*
</code></pre>// 可以访问sum
alert(sum(10,10));
function sum(num1,num2){return num1 + num2;
}// 函数表达式则不行
alert(sum1(10,10));
var sum1 = function(num1,num2){return num1 + num2;
}<pre><code>这是因为解析器在向执行环境加载数据时候,对于函数声明和函数表达式,解析器会率先读取函数声明,使其在任何代码之前可用(可以访问)  *作为值的函数,函数名做为变量进行传参*
</code></pre>function callSomeFunction(someFunction,someArgument){return someFunction(someArgument);
}function add10(num1){return num1 + 10;
}var result = callSomeFunction(add10,10);
alert(result);<pre><code><br />*函数的内部属性*
arguments对象上一篇笔记提及,类数组对象包含传入函数的所有参数
arguments对象拥有一个名为 `callee`的属性,该属性是一个指针,指向arguments对象的函数
它的作用:
</code></pre>function factorial(num){if(num <= 1){return 1;}else{// return num * factorial(num - 1);return num * arguments.callee(num - 1);}
}var trueFactorial = factorial;
factorial = function(){return 0;
}
alert(trueFactorial(5)); // 120
alert(factorial(5)); // 0<pre><code>`callee`作为指针的用法,解除了函数体内代码和函数名的耦合  **`this`**(很重要,要理解掌握)
this引用的是函数据以执行的环境对象或者说是this值(全局作用域调用函数时,this指向的引用就是window)
</code></pre>window.color = "red";var o = {color:"blue"
};
function sayColor(){alert(this.color);
}sayColor();o.sayColor = sayColor; // 函数名是指向函数的指针
o.sayColor();<pre><code>可以通过调试代码,查看当前所在的this指向的环境对象
**疑问:如果window.color 直接写color/var color,不是应该也是指向全局的么,为什么会报undefined***两个非继承的方法apply() call()*
</code></pre>// apply() call() bind()
function sum(num1,num2){return num1 + num2;
}function applySum(num1,num2){return sum.apply(this,arguments); // 传入arguments// return sum.call(this,[num1,num2]; //或者传入数组
}
alert(callSum(10,10));
function callSum(num1,num2){return sum.call(this,num1,num2);
}
alert(callSum(10,10));<pre><code>​*apply()和call() 的作用在于 扩充函数作用域(不明觉厉)*
</code></pre>window.color = "red";
var o = {color:"blue"
};
function sayColor(){alert(this.color);
}var objectSayColor = sayColor.bind(o); // bind方法 传入对象o
objectSayColor();sayColor();
sayColor.call(this);
sayColor.call(window);
sayColor.call(o);

小结

  1. 执行环境的概念
  2. 什么是作用域,作用域链的作用
  3. 函数是个对象,有相应的属性和方法
  4. 前面的哪个疑问 是什么原因?

javascript高程3 学习笔记(三)相关推荐

  1. javascript高程3 学习笔记(二)

    ECMAScript function的理解 ECMAScript 函数与其他语言函数最大的不同在于,其不介意传入多少参数以及参数的类型 比如函数的形参有两个,但是调用函数传入的参数可以写一个,三个或 ...

  2. JavaScript高级程序设计学习笔记(三)

    分享一下第五章(引用类型)的笔记,内容比较多,我拆成了两部分,今天这部分是关于Object.Array.Date和RegExp类型的. 以下的笔记是书上一些我以前学习的时候,没有太重视的js基础知识, ...

  3. JavaScript 权威指南-学习笔记(一)

    本文所有教程及源码.软件仅为技术研究.不涉及计算机信息系统功能的删除.修改.增加.干扰,更不会影响计算机信息系统的正常运行.不得将代码用于非法用途,如侵立删! JavaScript 权威指南-学习笔记 ...

  4. Mr.J-- jQuery学习笔记(三十二)--jQuery属性操作源码封装

    扫码看专栏 jQuery的优点 jquery是JavaScript库,能够极大地简化JavaScript编程,能够更方便的处理DOM操作和进行Ajax交互 1.轻量级 JQuery非常轻巧 2.强大的 ...

  5. GEE (Google Earth Engine)最基础代码学习笔记三

    GEE (Google Earth Engine)代码学习笔记三 本次学习核心为:将JavaScript objects and primitives放入Earth Engine 容器传到服务器,并处 ...

  6. 【AngularJs学习笔记三】Grunt任务管理器

    为什么80%的码农都做不了架构师?>>>    #0 系列目录# AngularJs学习笔记 [AngularJs学习笔记一]Bower解决js的依赖管理 [AngularJs学习笔 ...

  7. 7 种 Javascript 常用设计模式学习笔记

    7 种 Javascript 常用设计模式学习笔记 由于 JS 或者前端的场景限制,并不是 23 种设计模式都常用. 有的是没有使用场景,有的模式使用场景非常少,所以只是列举 7 个常见的模式 本文的 ...

  8. J2EE学习笔记三:EJB基础概念和知识 收藏

    J2EE学习笔记三:EJB基础概念和知识 收藏 EJB正是J2EE的旗舰技术,因此俺直接跳到这一章来了,前面的几章都是讲Servlet和JSP以及JDBC的,俺都懂一些.那么EJB和通常我们所说的Ja ...

  9. tensorflow学习笔记(三十二):conv2d_transpose (解卷积)

    tensorflow学习笔记(三十二):conv2d_transpose ("解卷积") deconv解卷积,实际是叫做conv_transpose, conv_transpose ...

最新文章

  1. visio 画类图时 方法里如何加参数
  2. STM32使用以下规则对过滤器编号:
  3. nginx反向代理、负载均衡、动态请求
  4. jsp程序带mysql数据库_【web开发】:JSP连接Mysql数据库(非常详细,代码一看就懂)...
  5. 两个线程并发执行以下代码,假设a是全局变量,初始为1,那么以下输出______是可能的?
  6. mysql 双从性能_MySQL双主一致性架构优化
  7. ubuntu分解压缩包
  8. JavaScript返回上一页代码区别
  9. 惠新宸php教程_百度PHP高级顾问惠新宸:PHP在百度的发展历程
  10. ubuntu下安装及配置git的方法(最全超详细教程github)
  11. linux中的进程有哪三种基本状态,Linux下的进程有哪三种状态?()
  12. Android BLE蓝牙详细解读
  13. oracle vb 用法,oracle客户端配置与使用(vb)
  14. powerDesign导出word操作步骤
  15. v-show会预先渲染_预先进行Big Design的利弊-我该怎么做
  16. 【踩坑专栏】feign.codec.EncodeException: Error converting request body
  17. Java习题练习:和尚挑水
  18. android技术分析
  19. elasticsearch数据备份与恢复(kibana操作)
  20. 金蝶BOS,界面区域按钮增加权限控制

热门文章

  1. keepalived实现nginx的高可用(双主模型)
  2. 点对点 客户端-服务器 聊天程序
  3. Android 编程下设置 Activity 切换动画
  4. IT学习--学习不一定要用在现实工作中
  5. 用html编写ASCII表,HTML ASCII
  6. 四、构建Node Web程序
  7. adb不识别设备(手机)的若干情形及解决方法
  8. 数据结构小总结(成都磨子桥技工学校数据结构前12题)
  9. boost asio resolver
  10. war部署到tomcat