JavaScript中with不推荐使用,为什么总是出现在面试题中?
- 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不推荐使用,为什么总是出现在面试题中?的更多相关文章
- JavaScript表达式--掌握最全的表达式,一切尽在掌握中,让表达不再是难事
一.JavaScript表达式: 算术表达式: 字符串表达式: 关系(比较)表达式: 逻辑表达式 二.JavaScript运算符: ●什么是表达式--表达式是产生一个结果值的式子,常量,变量,运算符. ...
- 《剑指offer》— JavaScript(31)整数中1出现的次数(从1到n整数中1出现的次数)
整数中1出现的次数(从1到n整数中1出现的次数) 题目描述 求出1~13的整数中1出现的次数,并算出100~1300的整数中1出现的次数?为此他特别数了一下1~13中包含1的数字有1.10.11.12 ...
- 剑指Offer(三十一):整数中1出现的次数(从1到n整数中1出现的次数)
剑指Offer(三十一):整数中1出现的次数(从1到n整数中1出现的次数) 搜索微信公众号:'AI-ming3526'或者'计算机视觉这件小事' 获取更多算法.机器学习干货 csdn:https:// ...
- (转载)详解Javascript中prototype属性(推荐)
在典型的面向对象的语言中,如java,都存在类(class)的概念,类就是对象的模板,对象就是类的实例.但是在Javascript语言体系中,是不存在类(Class)的概念的,javascript中不 ...
- JavaScript数组方法大全(推荐)
原网址:http://www.jb51.net/article/87930.htm 数组在笔试中经常会出现的面试题,javascript中的数组与其他语言中的数组有些不同,为了方便之后数组的方法学习, ...
- 在chrome中屏蔽百度推荐
在chrome中屏蔽百度推荐 方法1:可以使用adblock plus来进行屏蔽: 需要将chrome的扩展程序打开为调试者模式: 下载地址:http://chromecj.com/productiv ...
- JavaScript中一些你不一定知道的问题(持续更新中。。。。)
一些js的问题与解析 1) ["1","2","3"].map(parseInt);的运行结果是? A.["1",&qu ...
- 使用 JavaScript 中的 document 对象的属性,根据下拉框中选择的属性,更改页面中的字体颜色和背景颜色
查看本章节 查看作业目录 需求说明: 使用 JavaScript 中的 document 对象的属性,根据下拉框中选择的属性,更改页面中的字体颜色和背景颜色 实现思路: 在页面的 <body&g ...
- 【广州.NET社区推荐】【译】Visual Studio 2019 中 WPF & UWP 的 XAML 开发工具新特性
原文 | Dmitry 翻译 | 郑子铭 自Visual Studio 2019推出以来,我们为使用WPF或UWP桌面应用程序的XAML开发人员发布了许多新功能.在本周的 Visual Studio ...
随机推荐
- easyUI之numberspinner数字微调框
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <hea ...
- a lot of attention under the hood
Because one of the original goals of the Node.js project was to allow developers to easily build app ...
- 关于虚拟机可以ping通本机,本机可以ping通虚拟机,但是虚拟机就是不能上网
1 需要确定虚拟的防火墙已经关闭 2 修改vi /etc/sysconfig/network-scripts/ifcfg-eth0配置文件 增加以下参数 BOOTPROTO=none------- ...
- IDEA 底部工具栏没有 Version Control 解决办法
百度了半天 都说VCS配置不对 但是默认IDEA是配置好的 根本不需要修改 忽然看到 工具栏的快捷键 于是 Alt + 9 就出现了 完美
- 学一学Transfomer
017年,Google发表论文<Attention is All You Need>,提出经典网络结构Transformer,全部采用Attention结构的方式,代替了传统的Encode ...
- 硬盘相关合集,以及LVM操作实践
1. 机器装有两块硬盘,重装系统只找到一块盘,如何解决? 正常装完系统后,运行: a. lsblk查看硬盘信息,这里可以发现还没有使用的另一块盘. b. fdisk或parted给硬盘分区,取决于硬盘 ...
- C语言递归之求根到叶节点数字之和
题目描述 给定一个二叉树,它的每个结点都存放一个 0-9 的数字,每条从根到叶子节点的路径都代表一个数字. 例如,从根到叶子节点路径 1->2->3 代表数字 123. 计算从根到叶子节点 ...
- Guava源码阅读-base-Strings
package com.google.common.base; 今天阅读的是Srings类,这在程序中经常使用. 比如判断字符串是否为空,我们在之前用jdk方法判断是会用下面这个判断语句. if( i ...
- TP5之事务处理
事务: 执行完A事件然后执行B事件,AB事件都执行完才算完成.可是有时候由于某些因素,A事件执行完,还没来得及执行B事件.怎么办?就需要回到A事件执行前.这种事情多见于电商支付功能. mysql事务要 ...
- u盘启动盘安装centos7.5操作系统
1.下载CentOS 7.5的安装镜像:CentOS-7-x86_64-DVD-1804.iso 2.下载UltraISO:https://cn.ultraiso.net/xiazai.html 3. ...