• with的基本使用
  • 尴尬的with关键字

一、with的基本使用

with是用来扩展语句作用域的,什么意思呢?先来看看语法和示例:

语法:

with(expression){
statement
}

expression:将给定的表达式添加到评估语句时使用的作用域上。

statement:任何语句。

示例:

 var obj = {
name:"他乡踏雪",
age:3,
stature:666
}
with(obj){
console.log(name);//他乡踏雪
console.log(age);//
console.log(stature);//
}

描述:

with语句可以形成作用域,并且将传入的对象上的属性解析为该作用域下的变量,且取对象属性的值为变量的初始值。并且在作用域内使用变量如果被修改,expression的属性值会跟着被修改。

应用小示例:

 var a, x, y;
var r = 10; with (Math) {
a = PI * r * r;
x = r * cos(PI);
y = r * sin(PI / 2);
}

二、尴尬的with

关于with这个关键字,它的出现本身的出现是为了给代码除了方法以外,可以创建一个独立里作用域,并且可以结构对象属性成为作用域下的变量,减少代码量。而且在一定程度上还能够提升代码的执行效率。但其优势也是其劣势,而且ES5的严格模式下是不能使用的。而ES6的相关语法的出现继承了它的优势,还弥补了一些它的劣势,是不是非常尴尬。接下来具体看看with的优势与劣势:

优势:

with语句可以在不造成性能损失的情况下,减少变量的长度。其造成的附加计算量很少。使用with可以减少读取对象属性的值时,可减少对象命名空间的指针定位。

弊端:

with语句使得程序在查找变量值时,都是先在指定的对象中查找。所以那些本来不是这个对象中的属性的变量查找起来会很慢。如果对性能要求较高的场合,with下面的statement语句中的变量,只应该包含这个指定对象的属性。

上面是从性能方面考虑,接着从代码读写(语义)角度来考虑,with语句打散了对象与属性的关联性(书写和阅读),不利于代码的阅读。

接着从兼容性角度来考虑,with不能在严格模式下使用;而且还无法向前兼容,而ES6更是有一些语法可以替代with一些功能,比如let可以绑定作用域来替代with生成的作用域等。

 function f(foo, values) {
with (foo) {
console.log(values)
}
}
f([1,2,3], obj)

上面这个示例代码在ES5中没什么问题,但是ES6Array.prototype添加了一个新属性values,所以数组实例将继承这个属性。with语句中的values就变成了[1,2,3].values。

最后为什么with作为一个开发中不被推荐使用的关键字为什么会频繁的出现在面试题中?

如果需要解析with的内部机制和特性就必然会涉及到作用域、变量查找、this指向(如果传入对象上有方法,这个方法内部指向肯定指向这个传入的对象)、ES6、原型链、严格模式、甚至性能问题这些都可以被提及和延申出来,不推荐使用就很大程度上不受关注,也可以考察到面试者对语言底层特性的熟悉程度,这对面试官来说显然是一个不错的问题引入点。

JavaScript中with不推荐使用,为什么总是出现在面试题中?的更多相关文章

  1. JavaScript表达式--掌握最全的表达式,一切尽在掌握中,让表达不再是难事

    一.JavaScript表达式: 算术表达式: 字符串表达式: 关系(比较)表达式: 逻辑表达式 二.JavaScript运算符: ●什么是表达式--表达式是产生一个结果值的式子,常量,变量,运算符. ...

  2. 《剑指offer》— JavaScript(31)整数中1出现的次数(从1到n整数中1出现的次数)

    整数中1出现的次数(从1到n整数中1出现的次数) 题目描述 求出1~13的整数中1出现的次数,并算出100~1300的整数中1出现的次数?为此他特别数了一下1~13中包含1的数字有1.10.11.12 ...

  3. 剑指Offer(三十一):整数中1出现的次数(从1到n整数中1出现的次数)

    剑指Offer(三十一):整数中1出现的次数(从1到n整数中1出现的次数) 搜索微信公众号:'AI-ming3526'或者'计算机视觉这件小事' 获取更多算法.机器学习干货 csdn:https:// ...

  4. (转载)详解Javascript中prototype属性(推荐)

    在典型的面向对象的语言中,如java,都存在类(class)的概念,类就是对象的模板,对象就是类的实例.但是在Javascript语言体系中,是不存在类(Class)的概念的,javascript中不 ...

  5. JavaScript数组方法大全(推荐)

    原网址:http://www.jb51.net/article/87930.htm 数组在笔试中经常会出现的面试题,javascript中的数组与其他语言中的数组有些不同,为了方便之后数组的方法学习, ...

  6. 在chrome中屏蔽百度推荐

    在chrome中屏蔽百度推荐 方法1:可以使用adblock plus来进行屏蔽: 需要将chrome的扩展程序打开为调试者模式: 下载地址:http://chromecj.com/productiv ...

  7. JavaScript中一些你不一定知道的问题(持续更新中。。。。)

    一些js的问题与解析 1) ["1","2","3"].map(parseInt);的运行结果是? A.["1",&qu ...

  8. 使用 JavaScript 中的 document 对象的属性,根据下拉框中选择的属性,更改页面中的字体颜色和背景颜色

    查看本章节 查看作业目录 需求说明: 使用 JavaScript 中的 document 对象的属性,根据下拉框中选择的属性,更改页面中的字体颜色和背景颜色 实现思路: 在页面的 <body&g ...

  9. 【广州.NET社区推荐】【译】Visual Studio 2019 中 WPF & UWP 的 XAML 开发工具新特性

    原文 | Dmitry 翻译 | 郑子铭 自Visual Studio 2019推出以来,我们为使用WPF或UWP桌面应用程序的XAML开发人员发布了许多新功能.在本周的 Visual Studio ...

随机推荐

  1. 自动更新文件夹下所有DLL 至最新修改时间版本

    using System; using System.Collections.Generic; using System.ComponentModel; using System.Data; usin ...

  2. shiro中接入单点登录功能

    最近新建的系统中使用了shiro,而shiro框架中包含登录认证和鉴权的功能,因为我们系统要统一接入公司内部的单点登录(isso)系统,所以通过isso的登录用户,需要在shiro中置为已认证,一下提 ...

  3. LVS系列二、LVS集群-DR模式

    一. LVS-DR和LVS-IP TUN集群概述 1.  Direct Routing(直接路由) Director分配请求到不同的real server.real server处理请求后直接回应给用 ...

  4. Linux系统管理_主题01 :初识Linux_1.6 用好帮助文档man

    在 man 界面中,可以使用如下快捷键来进行操作:  上/下箭头 向上/下滚动一行  [Space] 向下翻一页  [Page Down] 向下翻一页  [Page Up] 向上翻一页  [ ...

  5. jenkins密码忘记解决

    1.停止jenkins sh /usr/local/tomcat/bin/shutdown.sh 2.找到config.xml [root@test3 hello]# find / -name con ...

  6. python 粘包现象

    一. 粘包现象 1. 粘包现象的由来(1)TCP属于长连接,当服务端与一个客户端进行了连接以后,其他客户端需要(排队)等待.若服务端想要连接另一个客户端,必须首先断开与第一个客户端的连接. (2)缓冲 ...

  7. 在HbuilderX的Uni-app中引入crypto-js md5

    在 hbuilderX的菜单“视图”中选择“显示终端”,在终端中把当前目录定位到uni-app的根目录,这样才可以把crypto-js库安装在正确的位置,在终端中键入:npm install cryp ...

  8. sql server 备份语句

    1.BACKUP DATABASE your_database TO DISK = 'diff.bak'with DIFFERENTIAL #差异备份,仅备份数据2.BACKUP DATABASE y ...

  9. 两表拼接 pd.concat

    a = pd.DataFrame([[1,2,3], [4,5,6], [7,8,9]],columns=['a','b','c']) b = pd.DataFrame([[11,23,45], [2 ...

  10. 通过案例来剖析JQuery与原生JS

    首先来个例子: 我们在登陆或者注册一些网站时,如果某一项点过了但没填,鼠标移走后是不是经常看到网站有相应的红色字体提示呢? 那下面我们就以这个为例来剖析下jQuery和原生JS的一些区别,来上代码: ...