JS中的with关键字

之前在看书时也有看到过with关键字,可是书上说不推荐使用,就没有深入了解了,所以对它几乎没有啥印象,今天看书时又看到了,心里想着“存在即合理“,所以就深入的学习了一下。


一. with语句的作用:

with语句能够针对对象来创建程序块,设置代码在特定对象中的作用域。

二. 语句的格式:

with(expression) statement;

三. 使用with可以简化代码:
(1)优化前的代码:

function foo(){
        var obj = {
            name:"luwenjing",
            age:22,
            sex:'女'
        };

        console.info(obj.name+" "+obj.age+" "+obj.sex);
    }

    foo();

(2)优化后的代码:

function foo(){
        var obj = {
            name:"luwenjing",
            age:22,
            sex:'女'
        };
        with(obj){
                console.info(name+" "+age+" "+sex);
        }
    }

    foo();

当代码中需要多次使用同一个对象时,就可以用with语句,简化代码。

四. 设置代码在特定对象中的作用域:

var obj = {
        x:10,
        foo: function()
        {
            with(this){
                x = 20;
                y = 30;
                console.info(y);
            }
        }
    }
    obj.foo(); //30
    console.info(obj.x); //20
    console.info(obj.y); //undefined

在上面的代码中,对象obj只有x和foo另个属性,由于y属性并不是obj的直接属性,它是在foo函数中定义的,相当于临时变量,调用obj.y就是undefined,只有with块执行y才被定义赋值。

五. with的弊端:
(1)性能问题:比如在上面的代码中,obj有个x属性,with中也出现x,js引擎会不明确x是临时变量,还是obj的属性,就会放弃对代码的优化,从而影响代码的执行效率。
(2)语义不明,容易出现bug:

function foo(obj) {
        with (obj) {
            a = 2;
        }
    }

    var o1 = {
        a: 3
    };
    var o2 = {
        b: 3
    };

    foo(o1);
    console.info(o1.a); // 2

    foo(o2);
    console.info(a); // 2

在上面的代码中,出现的结果就和预测结果不一致,本想着打印a的结果应该是undefined的,可是却是2,这是因为在o2中没有a属性,但是执行了with语句,a被修改就成了全局变量,就出错了。


综上:with语句在代码中要避免使用,尽管它会简化代码,可是会影响执行效率,更容易出错,所以这篇博客的作用是什么呢?告诉我在编码中避免用with关键字,嗯,就是这。。。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值