YUI Compressor壓縮失效的場景-eval和with

一、官方文檔的說明

in the face of evil features such as eval or with, the YUI Compressor takes a defensive approach by not obfuscating any of the scopes containing the evil statement

傳送門:官方文檔
翻譯成中文就是說：eval和with語句所處的作用域，YUI Compressor是不進行壓縮混淆單詞的。

二、普通代碼測試

1）源代碼

function testCompressor(){
    // 測試YUI Compressor
    var person = {
            'name':'wall',
            'jser':true
        };
        
    console.log("my name is "+ person.name);
}

2）壓縮後重新格式化的代碼

function testCompressor() {
    var a = {
        name: "wall",
        jser: true
    };
    console.log("my name is " + a.name)
};

三、含有eval代碼測試

1）源代碼

function testCompressor(){
    // 測試YUI Compressor
    var person = {
            'name':'wall',
            'jser':true
        };
        
    console.log("my name is "+ person.name);
    eval("console.log(\"I am Jser\");");
}

2）壓縮後重新格式化的代碼

function testCompressor() {
    var person = {
        name: "wall",
        jser: true
    };
    console.log("my name is " + person.name);
    eval('console.log("I am Jser");')
}

結論：只要eval存在的作用域，代碼都無法做混淆操作。

四、解決方案

 既然無法改變這個規則，那就要儘量去避免代碼中直接出現eval。可以講eval封裝起來調用。
1）源代碼

function testCompressor(){
    // 測試YUI Compressor
    var person = {
            'name':'wall',
            'jser':true
        };
        
    console.log("my name is "+ person.name);
    myEval("console.log(\"I am Jser\");");
}

function myEval(data){
    return eval(data);
}

2）壓縮後重新格式化的代碼

function testCompressor() {
    var a = {
        name: "wall",
        jser: true
    };
    console.log("my name is " + a.name);
    myEval('console.log("I am Jser");')
}
function myEval(data) {
    return eval(data)
}

3）另一種解決方式: 改為window["eval"]進行調用

  function testCompressor(){
    // 測試YUI Compressor
    var person = {
            'name':'wall',
            'jser':true
        };
        
    console.log("my name is "+ person.name);
    window["eval"]("console.log(\"I am Jser\");");
}

with 也適用上述的解決方案

原文入口:http://www.jianshu.com/p/67973651e398