这个混淆的 javascript 代码是如何工作的？

Question

我遇到了一个神秘的 jQuery，并有兴趣了解它是如何工作的。

http://jsfiddle.net/fsW6U/

同时检查下面的代码：

$ = ~ [];
$ = {
    ___: ++$,
    $$$$: (![] + "")[$],
    __$: ++$,
    $_$_: (![] + "")[$],
    _$_: ++$,
    $_$$: ({} + "")[$],
    $$_$: ($[$] + "")[$],
    _$$: ++$,
    $$$_: (!"" + "")[$],
    $__: ++$,
    $_$: ++$,
    $$__: ({} + "")[$],
    $$_: ++$,
    $$$: ++$,
    $___: ++$,
    $__$: ++$
};
$.$_ = ($.$_ = $ + "")[$.$_$] + ($._$ = $.$_[$.__$]) + ($.$$ = ($.$ + "")[$.__$]) + ((!$) + "")[$._$$] + ($.__ = $.$_[$.$$_]) + ($.$ = (!"" + "")[$.__$]) + ($._ = (!"" + "")[$._$_]) + $.$_[$.$_$] + $.__ + $._$ + $.$;
$.$$ = $.$ + (!"" + "")[$._$$] + $.__ + $._ + $.$ + $.$$;
$.$ = ($.___)[$.$_][$.$_];
$.$($.$($.$$ + "\"" + $.$_$_ + (![] + "")[$._$_] + $.$$$_ + "\\" + $.__$ + $.$$_ + $._$_ + $.__ + "(\\\"\\" + $.__$ + $.__$ + $.___ + "\\" + $.__$ + $.$_$ + $.__$ + "!\\\");" + "\"")())();

有人可以逐行分解这段代码并解释每一行的工作原理吗？

Answer 1

如果您注意到，通过立即为$ 赋值（$ 变为整数），jquery 实际上从未在此代码中使用。

// ~ is bitwise not, so this set $ = -1
$ = ~ [];

以下代码创建一个 javascript 对象。由于![] 是false，(![] + "") 将布尔值转换为字符串"false"。每个[$] 都在字符串"false" 或各种其他返回值中的指定索引$ 处获取一个字母。该代码将一系列整数和字母存储在一个对象中，然后将其分配给$。

$ = { 
    ___: ++$, // 0 since $ was -1
    $$$$: (![] + "")[$], // "f"
    __$: ++$, // 1
    $_$_: (![] + "")[$], // "a"
    _$_: ++$, // 2
    $_$$: ({} + "")[$],
    $$_$: ($[$] + "")[$], // "b"
    _$$: ++$, // see the patter when ++$ is assigned?
    $$$_: (!"" + "")[$], // see the pattern with the letters?
    $__: ++$,
    $_$: ++$,
    $$__: ({} + "")[$],
    $$_: ++$,
    $$$: ++$,
    $___: ++$,
    $__$: ++$
};

下面的想法与上面的类似。每一段（由+分隔）根据返回值返回一个字母，然后组合成一个字符串。

// "constructor"
$.$_ = ($.$_ = $ + "")[$.$_$] + ($._$ = $.$_[$.__$]) + ($.$$ = ($.$ + "")[$.__$]) + ((!$)      + "")[$._$$] + ($.__ = $.$_[$.$$_]) + ($.$ = (!"" + "")[$.__$]) + ($._ = (!"" + "")[$._$_]) +     $.$_[$.$_$] + $.__ + $._$ + $.$;

下面的代码分配了"return" 和function Function() { [native code] }。

// "return"
$.$$ = $.$ + (!"" + "")[$._$$] + $.__ + $._ + $.$ + $.$$;
// function Function() { [native code] }
$.$ = ($.___)[$.$_][$.$_];

在最后几行，

$.$$ + "\"" + $.$_$_ + (![] + "")[$._$_] + $.$$$_ + "\\" + $.__$ + $.$$_ + $._$_ +        $.__ + "(\\\"\\" + $.__$ + $.__$ + $.___ + "\\" + $.__$ + $.$_$ + $.__$ + "!\\\");" + "\""`

等价于

"return"ale\162t(\"\110\151!\");""

当传递给$.$()时，它变成了一个函数

function anonymous() { return "alert(\"Hi!\");"; }

然后是实际执行警报的最后一条语句。

$.$($.$($.$$ + "\"" + $.$_$_ + (![] + "")[$._$_] + $.$$$_ + "\\" + $.__$ + $.$$_ + $._$_ + $.__ + "(\\\"\\" + $.__$ + $.__$ + $.___ + "\\" + $.__$ + $.$_$ + $.__$ + "!\\\");" + "\"")())();

为了让整个概念更容易理解，我还提供了半反混淆代码。

obj = {
    ___: ++index, // = 0
    $$$$: (![] + "")[index], // = "f" from 'f'alse
    __$: ++index, // = 1
    $_$_: (![] + "")[index], // = "a" from f'a'lse
    _$_: ++index, // = 2
    $_$$: ({} + "")[index], // = "b" from [o'b'ject Object]
    $$_$: (index[index] + "")[index], // = "d" from un'd'efined
    _$$: ++index, // = 3
    $$$_: (!"" + "")[index], // = "e" from tru'e'
    $__: ++index, // = 4
    $_$: ++index, // = 5
    $$__: ({} + "")[index], // = "c" from [obje'c't Object]
    $$_: ++index, // = 6
    $$$: ++index, // = 7
    $___: ++index, // = 8
    $__$: ++index // = 9
};

// obj.$_ = "c" + "o" + "n" + "s" + "t" + "r" + "u" + "c" + "t" + "o" + "r";
obj.$_ = (obj.$_ = obj + "")[obj.$_$] + (obj._$ = obj.$_[obj.__$]) + (obj.$$ = (obj.$ + "")[obj.__$]) + ((!obj) + "")[obj._$$] + (obj.__ = obj.$_[obj.$$_]) + (obj.$ = (!"" + "")[obj.__$]) + (obj._ = (!"" + "")[obj._$_]) + obj.$_[obj.$_$] + obj.__ + obj._$ + obj.$;

// obj.$$ = "r" + "e" + "t" + "u" + "r" + "n"
obj.$$ = obj.$ + (!"" + "")[obj._$$] + obj.__ + obj._ + obj.$ + obj.$$;

// obj.$ = function Function() { [native code] } <- a function constructor
obj.$ = (obj.___)[obj.$_][obj.$_];

// If you don't know what Function() is, read
// https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function to learn about Function()
// before continuing.  It'll make more sense.

// body1 = "return"ale\162t(\"\110\151!\");"";
body1 = obj.$$ + "\"" + obj.$_$_ + (![] + "")[obj._$_] + obj.$$$_ + "\\" + obj.__$ +    obj.$$_ + obj._$_ + obj.__ + "(\\\"\\" + obj.__$ + obj.__$ + obj.___ + "\\" + obj.__$ +       obj.$_$ + obj.__$ + "!\\\");" + "\"";

// body2 = "alert("Hi!");" since \162 = "r", \"\110\151\!" = "Hi!"
body2 = obj.$(body1)();

// calls "alert("Hi!");"
obj.$(body2)();

// This works because the last argument to Function() becomes the
// body of that function.

Answer 2

jQuery 在第一行代码中变得无关紧要：

$ = ~[];

这导致-1。紧随其后，您会看到分配给$ 的对象同时对其进行引用，例如：

___: ++$,              // $.___ is now 0
$$$$: (![] + "")[$],   // $.$$$$ is f (false[0] = f)
__$: ++$,              // 1
$_$_: (![] + "")[$],   // a (false[1] = a)
_$_: ++$,              // 2
$_$$: ({} + "")[$],    // b ("[object Object]"[2])
$$_$: ($[$] + "")[$],  // d ("undefined"[2])
_$$: ++$,              // 3
$$$_: (!"" + "")[$],   // e ("true"[3])
$__: ++$,              // 4
$_$: ++$,              // 5
$$__: ({} + "")[$],    // c ("[object Object]"[5])
$$_: ++$,              // 6
$$$: ++$,              // 7
$___: ++$,             // 8
$__$: ++$              // 9

等等...如果您逐个执行并执行它，您将看到 Javascript 的行为方式。最终你会发现你的代码通过这些求值使js输出值调用了alert，并将它们组合成alert。

这个问题让我想起了Obfuscated javascript code with binary values?