这里有新鲜出炉的 Javascript 教程,程序狗速度看过来!
Javascript 是一种由 Netscape 的 LiveScript 发展而来的原型化继承的基于对象的动态类型的区分大小写的客户端脚本语言,主要目的是为了解决服务器端语言,比如 Perl,遗留的速度问题,为客户提供更流畅的浏览效果。
这篇文章主要介绍了 JavaScript 闭包和范围, 结合实例形式详细分析了 javascript 闭包的使用及变量的作用范围, 需要的朋友可以参考下
本文实例分析了 JavaScript 闭包和范围。分享给大家供大家参考,具体如下:
1.
- if (!("a" in window)) {
- var a = 1;
- }
- alert(a);
【分析】代码含义:如果 window 不包含属性 a,就声明一个变量 a 并赋值为 1
①JS 引擎会先扫描所有的变量声明
②所有的全局变量都是 window 的属性
③变量声明和赋值一起用时,Js 引擎会自动将它分成两部分:变量声明提前,变量赋值没有 (不将赋值提前是因为他有可能影响代码执行出不可预期的结果)
所以代码执行顺序等价于
- var a;
- if(!("a" in window)) {
- a = 1;
- }
- alert(a);
解析:声明变量 a,判断 a 是否存在,不存在就赋值为 1,而这里 a 永远在 window 里存在,赋值语句永不执行,所以结果是 undefined
2.
- if (! ("a" in window)) {
- function a() {
- window.a = 1;
- }
- }
- alert(a);
【分析】
①函数声明也会提前并且会覆盖变量声明,但不会覆盖变量赋值,如下例子
- function value(){
- return 1;
- }
- var value;
- alert(typeof value); //"function"
- function value(){
- return 1;
- }
- var value = 1;
- alert(typeof value); //"number"
②所有全局变量都是 window 属性,语句 var a=1; 等同于 window.a=1;
所以代码执行顺序等价于
- function a() {
- window.a = 1;
- }
- if (! ("a" in window)) {
- function a() {
- var a = 1;
- }
- }
- alert(a);
输出结果:function a() {window.a = 1;}
变形:
- if ("a" in window) {
- function a() {
- window.a = 1;
- }
- }
- alert(a);
输出结果:a is not defined
函数声明里的变量定义,要到执行函数时才会定义,并不会在预编译阶段就声明变量
3.
- if (! ("a" in window)) {
- var a = function() {
- window.a = 1;
- }
- }
- alert(a);
【分析】
①函数声明和函数表达式区别
函数声明:
- function functionName(arg1, arg2){
- //函数体
- }
函数表达式 (相当于变量赋值):
- var functionName = function(arg1, arg2){
- //函数体
- };
所以代码执行顺序等价于
- var a;
- if (! ("a" in window)) {
- a = function() {
- window.a = 1;
- }
- }
- alert(a);
结果和第一题一样, undefined
4.
- var a = 1,
- b = function a(x) {
- x && a(--x);
- };
- alert(a);
【分析】
①进入执行上下文的阶段
- VO(global) = {
- a: undefined,
- b: undefined
- }
这阶段的顺序:函数的形参 -> 函数声明 -> 变量声明
②执行代码阶段
- VO(global) = {
- x: undefined,
- a: 1
- }
③定义变量 b,赋值名字为 a 的函数(这个 a 只能在函数体内使用)
④如果 x 是任何 true 值(这这里应该是非 0)则执行后面的语句
⑤换成更能理解的代码
- var a = 1,
- b = function(x) {
- x && b(--x);
- };
- alert(a);
结果为 1
5.
- function b(x, y, a) {
- arguments[2] = 10;
- alert(a);
- }
- b(1, 2, 3);
【分析】没有难点,输出 10,如果改成
- function b(x, y, a) {
- arguments[2] = 10;
- alert(a);
- }
- b(1, 2);
则输出 undefined,因为没有传递 a 的值
6.
- function a() {
- alert(this);
- }
- a.call(null);
【分析】
①a.call(b) 表示 a 对象的方法应用到 b 对象上(即 b 对象继承了 a 对象),根据规定,第一个参数是 null 或 undefined,call 方法就把全局对象(也就是 window)作为 this 的值
②call() 和 apply() 的区别:功能一样,第二个参数形式不一样,call 传递多个参数,任意形式,apply 第二个参数必须是数组形式,如
a.call(b,2,3); ==> a.apply(b,[2,3]);
输出结果:[object Window]
希望本文所述对大家 JavaScript 程序设计有所帮助。
来源: http://www.phperz.com/article/17/0517/329411.html