`

js之with之函数声明与函数表达式

阅读更多

示例一、
<html >
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title></title>
        <script type="text/javascript">

                var obj = {value:2000};
                var value = 100;        
                with(obj){
                    function foo(){//函数声明
                        value *= 2;
                    }
                    foo();
                }        
                console.log(value); //200
                console.log(obj.value); //2000
          
                
        </script>
    </head>    
    <body>
    </body>
</html>




示例二、
<html >
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title></title>
        <script type="text/javascript">
           
                var obj = {value:2000};
                var value = 100;        
                with(obj){
                    var foo = function(){//函数表达式
                        value *= 2;
                    }
                    foo();
                }        
                console.log(value); //100
                console.log(obj.value); //4000

        </script>
    </head>    
    <body>
    </body>
</html>



【函数声明】与【函数表达式】
这个问题比较复杂,在ES5中定义了词法环境和变量环境。
当有with时,会创建新的词法环境,函数声明会取自变量环境,函数表达式会取自词法环境。
另外,函数声明不应该放在with里,虽然浏览器实现上不会报错,但从标准的角度,块中不应该包含函数声明。
你可以把函数声明换成函数表达式再看看。
不一定是with,try/catch和with在作用域的处理上十分类似。

这是【函数声明】和【函数表达式】区别的一个经典例子。
也是ECMA-262 5中区分词法环境(Lexical Enviaronment)和变量环境(Variable Environment)的主要原因。

一般很少遇到过。with确实不建议使用,只是例中的问题除了with, 在try/catch语句中也会有类似的问题。
catch(obj) {
    function(....
}
























-
分享到:
评论

相关推荐

    JavaScript详解(第2版)

     7.1.1 函数声明和调用   7.1.2 返回值   7.1.3 匿名函数变量   7.1.4 闭包   7.1.5 递归   7.1.6 函数是对象   7.2 调试技巧   7.2.1 函数语法   7.2.2 使用try/catch和throw捕捉异常  ...

    JavaScript实用范例词典01

    1.30 取整数函数的使用(ceil()与floor()) 28 1.31 平方根函数的使用(sqrt()) 29 1.32 取得两个数中的最大数(max())或 最小数(min()) 30 1.33 随机函数(random()) 31 1.34 圆形面积计算... 32 1.35 矩形面积...

    微软JavaScript手册

    :) 根据条件执行两个表达式之一。 constructor 属性 指定创建对象的函数。 continue 语句 停止循环的当前迭代,并开始一次新的迭代。 cos 方法 返回一个数的余弦。 Date 对象 提供日期和时间的基本存储和检索。...

    源文件程序天下JAVASCRIPT实例自学手册

    6.2.4 使用with声明简化表达式 6.2.5 常见属性汇总 6.2.6 常见方法汇总 6.3 Array对象 6.3.1 创建数组并访问其特定位置元素 6.3.2 数组中元素的顺序问题 6.3.3 模拟堆栈和队列操作的方法 6.3.4 使用splice()方法添加...

    编写可维护的JavaScript(中文)

    4.2 函数声明 4.3 函数调用间隔 4.4 立即调用的函数 4.5 严格模式 4.6 相等 4.6.1 eval() 4.6.2 原始包装类型 第二部分 编程实践 第5章 UI层的松耦合 5.1 什么是松耦合 5.2 将JavaScript从CSS中抽离 5.3...

    javascript文档

    :) 根据条件执行两个表达式之一。 constructor 属性 指定创建对象的函数。 continue 语句 停止循环的当前迭代,并开始一次新的迭代。 cos 方法 返回一个数的余弦。 Date 对象 提供日期和时间的基本存储和检索。...

    JavaScript基础和实例代码

    6.2.4 使用with声明简化表达式 6.2.5 常见属性汇总 6.2.6 常见方法汇总 6.3 Array对象 6.3.1 创建数组并访问其特定位置元素 6.3.2 数组中元素的顺序问题 6.3.3 模拟堆栈和队列操作的方法 6.3.4 使用splice()方法添加...

    编写可维护的javascript(英文)

    4.2 函数声明 4.3 函数调用间隔 4.4 立即调用的函数 4.5 严格模式 4.6 相等 4.6.1 eval() 4.6.2 原始包装类型 第二部分 编程实践 第5章 UI层的松耦合 5.1 什么是松耦合 5.2 将JavaScript从CSS中抽离 5.3...

    JScript 语言参考

    :) 根据条件执行两个表达式之一。 constructor 属性 指定创建对象的函数。 continue 语句 停止循环的当前迭代,并开始一次新的迭代。 cos 方法 返回一个数的余弦。 Date 对象 提供日期和时间的基本存储和检索。...

    match-json:一个用于测试JSON APIJavaScript库

    该库使用它来支持使用函数和正则表达式来声明JSON API。 您应该携带自己喜欢的测试库。 安装 npm install match-json 用法 匹配JSON基元。 // Numbers match ( 3.1415 , 3.1415 ) ; // =&gt; true //Strings match ( ...

    asp.net知识库

    与正则表达式相关的几个小工具 你真的了解.NET中的String吗? .NET中的方法及其调用(一) 如何判断ArrayList,Hashtable,SortedList 这类对象是否相等 帮助解决网页和JS文件中的中文编码问题的小工具 慎用const...

    ECMAScript 2018快速入门 高清完整PDF

    7.4.2函数表达式 60 7.4.3对象的方法 60 7.4.4bind方法创建的函数 60 7.4.5newFunction创建的函数 60 7.4.6实例 61 7.5new.target属性 61 7.6在参数中使用尾后逗号 62 7.7箭头函数 62 7.7.1基本语法 62 [2] 7.7.2...

    JavaScript高级教程

    第 1 章 JavaScript 是什么...............................................1 3 1.1 历史简述..............................................1 1.2 JavaScript 实现................................................

    freemarker总结

    逻辑与:&& 逻辑或:|| 逻辑非:! 逻辑运算符只能作用于布尔值,否则将产生错误 1.9 内建函数 FreeMarker还提供了一些内建函数来转换输出,可以在任何变量后紧跟?,?后紧跟内建函数,就可以通过内建函数来轮换输出...

    ExtAspNet_v2.3.2_dll

    ExtAspNet - ExtJS based ASP.NET Controls with Full AJAX Support ExtAspNet是一组专业的Asp.net控件库,拥有原生的AJAX支持和丰富的UI效果, 目标是创建没有ViewState,没有JavaScript,没有CSS,没有...

Global site tag (gtag.js) - Google Analytics