JavaScript 有个 with 关键字, with 语句的原本用意是为逐级的对象访问提供命名空间式的速写方式. 也就是在指定的代码区域, 直接通过节点名称调用对象.

with语句的作用是暂时改变作用域链、减少的重复输入。

其语法结构为:

with(object){
//statements
}

举一个实际例子吧:

with(document.forms[]){
name.value = "lee king";
address.value = "Peking";
zipcode.value = "";
}

与之对应的传统的写法是:

document.forms[].name.value = "lee king";
document.forms[].address.value = "Peking";
document.forms[].zipcode.value = "";

可以看出with语句的简洁明了,不过在代码的世界里是很难找到真正的完美。

js的解释器需要检查with块中的变量是否属于with包含的对象,这将使with语句执行速度大大下降,并且导致js语句很难被优化。为了兼顾速度与代码量可以找到一个比较折衷的方案:

var form = document.forms[];
form.name.value = "lee king";
form.address.value = "Peking";
form.zipcode.value = "";

所以在以后的高效代码开发中我们应该尽可能的避免使用with语句。

经过测试:

var a = 123;
var b = {a : 321};
with(b){
console.log(a); //
}
var a = 123;
var b = {}; 这里去掉b中的a属性
with(b){
console.log(a); //
}从作用域链来分析

在javascript中,函数也是对象,实际上,javascript中的一切都是对象。函数内部有一个只给javascript引擎访问的内部属性是[[scope]],该属性包含了函数创建时的作用域中对象的集合,这个集合就叫做作用域链。

比如下面代码:

function add(num1,num2) {
var sum = num1 + num2;
return sum;
}

在函数创建时,它的作用域链中会填入一个全局对象,该全局对象包含了所有全局变量,如下图:

当函数被执行时,会创建一个活动对象,该对象包含了函数所有局部变量、命名参数以及this,然后该对象会被推入作用域链的前端,当函数执行完毕,该对象也随之销毁。

可以看到,全局变量会被活动对象推到作用域链的最后端,这也就是为什么全局变量访问速度慢的原因!

with

一般情况下,作用域链只会被with和catch语句影响。当使创建用with的时候,函数会创建一个新的活动对象,推到最前端,该对象就是with的对象。这就意味着所有的局部变量都处于第二个作用域链对象中去了,这也就是为什么要避免使用with的原因。

转载于:https://www.jb51.net/article/84065.htm

深入浅析JavaScript中with语句的理解的更多相关文章

  1. JavaScript中with语句的理解

    with语句的作用是暂时改变作用域链.减少的重复输入. 其语法结构为: with(object){ //statements } 举一个实际例子吧: with(document.forms[0]){ ...

  2. 浅析 JavaScript 中的 函数 uncurrying 反柯里化

    柯里化 柯里化又称部分求值,其含义是给函数分步传递参数,每次传递参数后部分应用参数,并返回一个更具体的函数接受剩下的参数,这中间可嵌套多层这样的接受部分参数函数,直至返回最后结果. 因此柯里化的过程是 ...

  3. 浅析 JavaScript 中的 函数 currying 柯里化

    原文:浅析 JavaScript 中的 函数 currying 柯里化 何为Curry化/柯里化? curry化来源与数学家 Haskell Curry的名字 (编程语言 Haskell也是以他的名字 ...

  4. JavaScript中if语句优化和部分语法糖小技巧推荐

    前言 在前端日常开发过程中,if else判断语句使用的次数应该是比较频繁的了,一些较为复杂的场景,可能会用到很多判断,在某个代码块使用很多if else时,代码会显得较为冗余,阅读起来不够清晰. 除 ...

  5. javascript中关于继承的理解

    首先,你要理解在javascript中,每当一个新函数创建时,都会生成一个prototype属性,我们管它叫做原型对象.看一个例子: function foo(){ this.name='qiangq ...

  6. Javascript中闭包的个人理解

       Javascript的一个特殊点就在于它的闭包和回调特性,这两个特性让初学Javascript的我是云里雾里,至今仍在苦苦摸索与理解.在一番苦思之后,整理了一下资料,将自己的理解思路记录下来,以 ...

  7. javascript中concat方法深入理解

    最近在恶补js知识的时候,总是会因为js强大的语法而感到震撼.因为以前对前端方面的疏忽,导致了一些理解的错误.因此痛改前非,下定决心,不管做什么事情,都要有专研的精神. 在介绍前,抛出一个问题:如何将 ...

  8. JavaScript - javascript 中的 "||" 与 "&&" 的理解与灵活运

    你肯定见到过这样的代码:a = a||"xxx". 它其实就等价于下面三种形式的代码: a = a || "xxx"; 与: if (!a) { a = &qu ...

  9. 浅析 JavaScript 中的闭包(Closures)

    a { text-decoration: none; color: #4094c7 } h4,h5 { margin: 0; font-weight: 700; color: inherit; lin ...

随机推荐

  1. Window python下载安装

    Window python下载安装 http://www.runoob.com/python/python-install.html https://pan.baidu.com/s/1MoR9nWUY ...

  2. centor os 安装nginx

    安装nginx和health check wget http://nginx.org/download/nginx-1.4.5.tar.gz git clone https://github.com/ ...

  3. win10 ubuntu双系统安装后无法引导进入ubuntu

    之前按照先装windows后装ubuntu的方式装的系统,都可以引导到ubuntu,无论是将ubuntu挂在到/boot在windows用easy BCD建立ubuntu引导,还是将ubuntu挂在到 ...

  4. 详述Oracle RAC的五大优势及其劣势

    不同的集群产品都有自己的特点,RAC的特点包括如下几点: ·双机并行.RAC是一种并行模式,并不是传统的主备模式.也就是说,RAC集群的所有成员都可以同时接收客户端的请求. ·高可用性.RAC是Ora ...

  5. 解决IE下载 apk/ipa 变成zip:Android 手机应用程序文件下载服务器 配置解决方法

    解决IE apk/ipa变成zip:Android 手机应用程序文件下载服务器 配置解决方法 APK文件其实是zip格式,但后缀名被修改为apk,通过UnZip解压后,可以看到Dex文件,Dex是Da ...

  6. eclipse 自动生成json格式的toString()方法

    文本代码 {"${member.name()}":"${member.value}", "${otherMembers}"}

  7. 【转】Java自学之路——by马士兵

    作者:马士兵老师 JAVA自学之路 一:学会选择 为了就业,不少同学参加各种各样的培训. 决心做软件的,大多数人选的是java,或是.net,也有一些选择了手机.嵌入式.游戏.3G.测试等. 那么究竟 ...

  8. oracle vm中的xp添加共享文件夹

      接着就可以在虚拟的电脑系统里面打开我们的共享文件夹,在桌面找到”网络邻居“,双击打开   我们需要通过”添加一个网络邻居“来加载我们刚才添加的”共享文件夹“,根据向导一步步执行   然后点击”浏览 ...

  9. substring_index 用法

    substring_index http://blog.csdn.net/wolinxuebin/article/details/7845917 1.substring_index(str,delim ...

  10. 根据条件决定My97DatePicker日期控件弹出的日期格式

    代码如下: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <tit ...