Recently I saw an interesting code in Zhihu. The code is basically made up of emoji, but copying to the Chrome console is executable, with a “Hello World” warning box. The complete code below, you can first copy to the console to try.

゚ω゚ Blue =/ 'M ´) Blue ~ loot added // * ´ ∇ ` * / ['_']; O =(゚ * ゚) =_=3; C =(゚ θ ゚) =(゚ 漢 字 ー゚)-(゚ 漢 字); (゚ д ゚)= (゚ θ ゚)= (o^_^o)/ (o^_^o); (゚ д ゚)={゚ θ ゚:'_',゚ω゚ Blue: ((゚ω゚ blue ==3) +'_') [゚ θ ゚],゚ 漢 字 blue :(byte ω blue +'_')[o^_^o -(゚ θ ゚)],゚ д ゚ blue :(port ==3) +'_')[゚ * ゚]}; (゚ д ゚) [゚ θ ゚] =((゚ω゚ blue ==3) +'_') [c^_^o]; (゚ д ゚) ['c'[(゚ д ゚)+'_') [(゚ 漢 詩 ー゚)+(゚ 漢 詩)-(kappa Phi Kappa)]; (゚ д ゚) ['o'[(゚ д ゚)+'_') [゚ θ ゚]; (゚o゚)=(゚ д ゚) ['c'[゚ д ゚]'o']+(゚ω゚ Blue +'_')[゚ θ ゚]+ ((゚ω゚ Blue ==3) +'_'(゚ * ゚] + (゚ д ゚) +'_') [(゚ * ゚)+(゚ * ゚)]+ ((science * ゚==3) +'_') [゚ θ ゚]+((゚ * ゚==3) +'_') [(゚ * ゚) - (゚ θ ゚)]+(д fe) ['c'[(゚ д ゚)+'_') [(゚ * ゚)+(゚ * ゚)]+ (successively blued) ['o']+(゚ * ゚==3) +'_') [゚ θ ゚]; (゚ д ゚) ['_'] =(o^_^o) [゚o゚] [゚o゚]; (゚ε゚)=(゚ * ゚==3) +'_') [゚ θ ゚]+ (゚ д ゚)'_') [(゚ * ゚) +(゚ * ゚)]+((science * ゚==3) +'_') [o^_^o -゚ θ ゚]+((゚ * ゚==3) +'_') [゚ θ ゚]+ (゚ω゚ Blue +'_') [゚ θ ゚]; (゚ * ゚)+=(゚ θ ゚); ゚ д ゚)[゚ε゚]='\ \'; (゚ д ゚).゚ θ ゚ =(alternately alternately alternately)[o^_^o -(occasionally θ ゚)]; (o゚ * ゚o)=(゚ω゚ blue +'_')[c^_^o]; (゚ д ゚) [゚o゚]='\ "'; (゚ д ゚) ['_'[(゚ д ゚) ['_'] (゚ epsilon ゚ + (゚ Д ゚) [゚ ゚] o + (゚ Д ゚) [゚ epsilon ゚] + (゚ Θ ゚) + (゚ ー ゚) + (゚ Θ ゚) + (゚ Д ゚) [゚ epsilon ゚] + (゚ Θ ゚) + ((゚ ー ゚) + (゚ Θ ゚)) + (゚ ー ゚) + (゚ Д ゚) [゚ epsilon ゚] + (゚ Θ ゚) + (゚ ー ゚) + ((゚ ー ゚) + (゚ Θ ゚)) + (゚ Д ゚) [゚ epsilon ゚] + (゚ Θ ゚) + (^_^ o (o) + ^_^ o) (o) + (^_^ o (o) - (゚ Θ ゚)) + (゚ Д ゚) [゚ epsilon ゚] + (゚ Θ ゚) + (^_^ o (o) + ^_^ o) (o) + (゚ ー ゚) + (゚ Д ゚) [゚ epsilon ゚] + ((゚ ー ゚) + (゚ Θ ゚)) + (c ^_^ o) + (゚ Д ゚) [゚ epsilon ゚] + (゚ ー ゚) + (^_^ o (o) - (゚ Θ ゚)) + (゚ Д ゚) [゚ epsilon ゚] + (゚ Θ ゚) + (゚ Θ ゚) + + ^_^ o (c) (゚ Д ゚) [゚ epsilon ゚] + (゚ Θ ゚) + (゚ ー ゚) + ((゚ ー ゚) + (゚ Θ ゚)) + (゚ Д ゚) [゚ epsilon ゚] + (゚ Θ ゚) + ((゚ ー ゚) + (゚ Θ ゚)) + (゚ ー ゚) + (゚ Д ゚) [゚ epsilon ゚] + (゚ Θ ゚) + ((゚ ー ゚) + (゚ Θ ゚)) + (゚ ー ゚) + (゚ Д ゚) [゚ epsilon ゚] + (゚ Θ ゚) + ((゚ ー ゚) + (゚ Θ ゚)) + ((゚ ー ゚) + ^_^ o) (o) + (゚ Д ゚) [゚ epsilon ゚] + ((゚ ー ゚) + (゚ Θ ゚)) + (゚ ー ゚) + (゚ Д ゚) [゚ epsilon ゚] + (゚ ー ゚) + ^_^ o (c) + (゚ Д ゚) [゚ epsilon ゚] + (゚ Θ ゚) + (^_^ o (o) + ^_^ o) (o) + ((゚ ー ゚) + ^_^ o) (o) + (゚ Д ゚) [゚ epsilon ゚] + (゚ Θ ゚) + ((゚ ー ゚) + (゚ Θ ゚)) + ((゚ ー ゚) + ^_^ o) (o) + (゚ Д ゚) [゚ epsilon ゚] + (゚ Θ ゚) + (^_^ o (o) + ^_^ o) (o) + (^_^ o (o) - (゚ Θ ゚)) + (゚ Д ゚) [゚ epsilon ゚] + (゚ Θ ゚) + ((゚ ー ゚) + (゚ Θ ゚)) + (゚ ー ゚) + (゚ Д ゚) [゚ epsilon ゚] + (゚ Θ ゚) + (゚ ー ゚) + (゚ ー ゚) + (゚ Д ゚) [゚ epsilon ゚] + (゚ ー ゚) + (^_^ o (o) - (゚ Θ ゚)) + (゚ Д ゚) [゚ epsilon ゚] + ((゚ ー ゚) + (゚ Θ ゚)) + (゚ Θ ゚) + (゚ Д ゚) [゚ o ゚]) (゚ Θ ゚)) ('_');
Copy the code

By the way, post the original answer main link:

How to write Hello World as high-end and elegant? – My answer. – Zhihu

The code caught my eye, so I formatted it with a tool and looked at it piece by piece. It didn’t involve too much knowledge, but I thought there were some interesting tips worth sharing. By the way, if you see the same answer on Zhihu, it is also my answer, not plagiarism.

The code analysis

The nuggets’ comment color scheme may not be very clear, you can copy it to another environment. If you are not familiar with JS, you can skip to the next section to see the key points.

// This can be divided into three sections
// 'M ´) Blue ~ loot added/a regular
// /*´∇ '*/ here is a string of notes, can be regarded as not exist
// ['_'] adds a string inside the brackets to get the value of the same property in the object,
// Since regular expressions count as objects, the format is valid
// There is no "_" attribute in the re, so ゚ω゚ Blue is undefined゚ω゚ Blue =/ 'M ´) Blue ~ loot added / / * ´ ∇ ` * /['_']; 

// Most of the parentheses below are meaninglessO = (゚ * ゚) = _ =3; // The variables o and ゚ * ゚ and _ are defined with a value of 3
/ / defines the variable c and ゚ Θ ゚, value of ゚ ー ゚ minus ゚ ー ゚, ゚ ー ゚ defines the 3 above, so here is 0C = (゚ θ ゚) = (゚ 漢 字 ー゚) - (゚ 漢 字);// Defines variables (゚ д ゚) and (゚ θ ゚),
// (o ^ _ ^ o) notice that ^ is the xor operator,
// While o and _ are defined above, the value is 3, so this is actually 3 ^ 3 ^ 3, which is still 3 after the operation,
// So (゚ д ゚) and (゚ θ ゚) values are 3/3 = 1(゚ д ゚) = (゚ θ ゚) = (o ^ _ ^ O)/(o ^ _ ^ O);// to (゚ д ゚) re-value, so all of the above is useless...
// Defines an object (゚ д ゚)(゚ д ゚) = {゚ θ ゚:'_'.// ゚ω゚ Blue is undefined, so == 3 = Boolean false,
    False_ : false + false_ : false is converted to a string "false" according to THE JS automatic transformation mechanism, which should be added to false_ to result in "false_"
    // ゚ θ ゚
    False_ : FML // False_ : FML // FML // FML゚ω゚ blue: ((゚ω゚ blue ==3) + '_')[゚ θ ゚],゚ω゚ Blue is undefined, and the result is "undefined_"
    // in square brackets, o ^ _ ^ o xor is 3, as stated above, ゚ θ ゚ is 1, resulting in 2
    // Get the letter D with subscript 2 in "undefined_"゚ * ゚ Blue: (゚ω゚ blue +'_')[o ^ _ ^ O - (゚ θ ゚)],// The principle is the same, and the result is e゚ д ゚ Blue: (゚ー゚ ==3) + '_')[゚ * ゚]};// to ゚ д ゚ property again, so there is no use of code to analyze so much of it? (゚ д ゚)
// The following formula is used above, I directly write the result(゚ д ゚)[゚ θ ゚] = ((゚ω゚ blue ==3) + '_')[c ^ _ ^ o];  / / "f"
// It's a bit of an interesting fact that the automatic transformation of the object calls the internal toString() method,
// The default toString method returns "[object object]"
// So ((゚ д ゚) + '_') results into "[object object]_"(゚ д ゚)['c'[(゚ д ゚) +'_')[(゚ 漢 詩 ー゚) + (゚ 漢 詩) - (kappa Phi Kappa)];// c(゚ д ゚)['o'[(゚ д ゚) +'_')[゚ θ ゚];// o 

// A line stands for a letter(゚o゚) = (゚ д ゚)['c'[゚ д ゚]'o'] + (゚ω゚ Blue +'_')[゚ θ ゚] + ((゚ω゚ Blue ==3) + '_'(゚ * ゚] + (゚ д ゚) +'_')[(゚ * ゚) + (゚ * ゚)] + ((science * ゚ ==3) + '_')[゚ θ ゚] + ((゚ * ゚ ==3) + '_')[(゚ * ゚) - (゚ θ ゚)] + (д fe)['c'[(゚ д ゚) +'_')[(゚ * ゚) + (゚ * ゚)] + (successively blued)['o'] + (゚ * ゚ ==3) + '_')[゚ θ ゚];// (o ^ _ ^ o) results in 3, ゚o゚ is the string constructor
["constructor"]["constructor"]
// The Number type 3 is converted to the Number object because of the automatic conversion of JS (boxing mechanism)
/ / by Number. The constructor. The constructor = = = 3) constructor. The constructor(゚ д ゚)['_'] = (o ^ _ ^ o)[゚o゚][゚o゚]; 

// One line represents a single letter, combined to return(゚ε゚) = (゚ * ゚ ==3) + '_')[゚ θ ゚] + (゚ д ゚)'_')[(゚ * ゚) + (゚ * ゚)] + ((science * ゚ ==3) + '_')[O ^ _ ^ O - ゚ θ ゚] + ((゚ * ゚ ==3) + '_')[゚ θ ゚] + (゚ω゚ Blue +'_')[゚ θ ゚]; (゚ * ゚) += (゚ θ ゚);/ / 4゚ д ゚)[゚ε゚] ='\ \'; ゚ д ゚).゚ θ ゚ = (alternately alternately alternately)[O ^ _ ^ O - (occasionally θ ゚)];// b(o゚ * ゚o) = (゚ω゚ blue +'_')[c ^ _ ^ o]; // u(゚ д ゚)[゚o゚] ='\ "'; 

/ / (゚ Д ゚) [' _ '] above has been assigned, is Number. The constructor. The constructor
// The constructor of a reference type points to the Function class, and the constructor of Function points to itself
// Function calls are equivalent to new Function(), which is an unusual way to create functions
Const f = new Function("num1","num2","return num1 + num2")
Const f = function (num1,num2) {return num1 + num2};(゚ д ゚)['_'[(゚ д ゚)['_'] (// The following is a long string, in fact, with a plus sign to join the single string concatenation, final output
    // "return"\141\154\145\162\164\50\42\110\145\154\154\157\54\40\167\157\162\154\144\42\51""
    // The digits here represent octal ASCII codes, such as 141, which translates octal to 10 to 97, corresponding to the ASCII letter "A"
    // So this is the string "return"alert("Hello, world")"゚ epsilon ゚ + (゚ Д ゚) [゚ ゚] o + (゚ Д ゚) [゚ epsilon ゚] + (゚ Θ ゚) + (゚ ー ゚) + (゚ Θ ゚) + (゚ Д ゚) [゚ epsilon ゚] + (゚ Θ ゚) + ((゚ ー ゚) + (゚ Θ ゚)) + (゚ ー ゚) + (゚ Д ゚) [゚ epsilon ゚] + (゚ Θ ゚) + (゚ ー ゚) + ((゚ ー ゚) + (゚ Θ ゚)) + (゚ Д ゚) [゚ epsilon ゚] + (゚ Θ ゚) + ((o ^ _ ^ o) + (o ^ _ ^ o)) + ((o ^ _ ^ o) - (゚ Θ ゚)) + (゚ Д ゚) [゚ epsilon ゚] + (゚ Θ ゚) + ((o ^ _ ^ o) + (o ^ _ ^ o)) + (゚ ー ゚) + (゚ Д ゚) [゚ epsilon ゚] + ((゚ ー ゚) + (゚ Θ ゚)) + (c ^ _ ^ o) + (゚ Д ゚) [゚ epsilon ゚] + (゚ ー ゚) + ((o ^ _ ^ o) - (゚ Θ ゚)) + (゚ Д ゚) [゚ epsilon ゚] + (゚ Θ ゚) + (゚ Θ ゚) + (c ^ _ ^ o) + (゚ Д ゚) [゚ epsilon ゚] + (゚ Θ ゚) + (゚ ー ゚) + ((゚ ー ゚) + (゚ Θ ゚)) + (゚ Д ゚) [゚ epsilon ゚] + (゚ Θ ゚) + ((゚ ー ゚) + (゚ Θ ゚)) + (゚ ー ゚) + (゚ Д ゚) [゚ epsilon ゚] + (゚ Θ ゚) + ((゚ ー ゚) + (゚ Θ ゚)) + (゚ ー ゚) + (゚ Д ゚) [゚ epsilon ゚] + (゚ Θ ゚) + ((゚ ー ゚) + (゚ Θ ゚)) + ((゚ ー ゚) + (o ^ _ ^ o)) + (゚ Д ゚) [゚ epsilon ゚] + ((゚ ー ゚) + (゚ Θ ゚)) + (゚ ー ゚) + (゚ Д ゚) [゚ epsilon ゚] + (゚ ー ゚) + (c ^ _ ^ o) + (゚ Д ゚) [゚ epsilon ゚] + (゚ Θ ゚) + (^ _ ^ o (o) + (o ^ _ ^ o)) + ((゚ ー ゚) + (o ^ _ ^ o)) + (゚ Д ゚) [゚ epsilon ゚] + (゚ Θ ゚) + ((゚ ー ゚) + (゚ Θ ゚)) + ((゚ ー ゚) + (o ^ _ ^ o)) + (゚ Д ゚) [゚ epsilon ゚] + (゚ Θ ゚) + ((o ^ _ ^ o) + (o ^ _ ^ o)) + ((o ^ _ ^ o) - (゚ Θ ゚)) + (゚ Д ゚) [゚ epsilon ゚] + (゚ Θ ゚) + ((゚ ー ゚) + (゚ Θ ゚)) + (゚ ー ゚) + (゚ Д ゚) [゚ epsilon ゚] + (゚ Θ ゚) + (゚ ー ゚) + (゚ ー ゚) + (゚ Д ゚) [゚ epsilon ゚] + (゚ ー ゚) + ((o ^ _ ^ o) - (゚ Θ ゚)) + (゚ Д ゚) [゚ epsilon ゚] + ((゚ ー ゚) + (゚ Θ ゚)) + (゚ Θ ゚) + (゚ д ゚)[゚o゚])(゚ θ ゚))('_');
// The top is equivalent to the bottom
/** Function(Function("return'alert(\"Hello, world\")'")() */ Function(Function("return'alert(\"Hello, world\")'")() */
Copy the code

Analysis of core knowledge points

In essence, this thing is the use of emoji variable names, and JS magic automatic transformation mechanism to come out.

We all know that JS is a dynamic language that will help you automatically infer the type of a variable at runtime. For example, if you add a string and a number, JS will try to convert the number into a string and then concatenate the string. If an object is involved in the operation, the toString() method inside the object is called, and then the operation is involved as follows:

const a = { 
  toString: function() { 
    return 123 
  }
}
a + 1 // The result is 124
Copy the code

With this mechanism, we can do a whole bunch of crazy things:

[] + {} // "[object Object]"
[] + 123 / / "123"[] = =0 // true
true + "123" // "true123"
(function () {}) + 123  //"function () {}123" 
Copy the code

Understand this knowledge point, the content above is easy to understand.

Another point is ASCII. In JS, you can use the string form of “/” + ASCII table corresponding numbers to obtain the corresponding characters, such as “\141” can be automatically recognized as the string “A” in JS. If it is Chinese, it can be represented by “\u” + Unicode code.

How to convert arbitrary code into emoji

The code above is really useful or the last paragraph, you can replace the last paragraph of the emoji variable into any other emoji, as for the keyword acquisition method, using js automatic transformation mechanism, you can also make a variety of tricks, here is not to say.

We can also expand on the code above. Split any code into a single character, and then convert the character to its Unicode counterpart. The Unicode codes are also broken down into emoji equivalents. Replace the key content of the last paragraph of the code above (that is, the content of the Funtion) with the generated emoji and you can complete the generation of any emoji code.

Here is an example of code that can be converted to emoji code by copying the following code to the Chrome console and typing any text. The function of the emoji code is to pop up the Chinese you just typed.

function generateEmojiCode(text) {
    // For ease of operation, maintain a mapping of Unicode key characters and corresponding emoji characters
    const emojiStrMap = {
        0:"(゚ * ゚) - (゚ * ゚)".1:"(゚ θ ゚)".2:"(゚ θ ゚) + (゚ θ ゚)".3:"(o ^ _ ^ o)".4:"(o ^ _ ^ O) + (゚ θ ゚)".5:"(゚ * ゚) + (゚ θ ゚)".6:"(o ^ _ ^ o) + (o ^ _ ^ o)".7:"(゚ * ゚) + (o ^ _ ^ O)".8:"(゚ * ゚) + (゚ * ゚)".9:"(゚ * ゚) + (゚ θ ゚) + (science ゚)".a: "((゚ д ゚).゚ θ ゚ / (゚ θ ゚) + '_')[(゚ θ ゚)]".b: "(゚ д ゚).゚ θ ゚ blue".c: "(゚ д ゚)['c']".d: "(゚ д ゚).゚ 漢 詩 ー Blue".e: "(゚ д ゚).゚ д ゚".f: "((o ^ _ ^ o)[゚o゚] + '_')[(゚ θ ゚) ^ (゚ θ ゚)]".u: "(o゚ * ゚o)"."\ \": "(゚ д ゚)[゚ε゚]",}let str = "" '";
    
    // This can theoretically be replaced with arbitrary code
    const alertText = `alert("${text}") `
    for(let t of alertText) {
        const uniNum = t.charCodeAt();
        const numstr = uniNum.toString(uniNum < 128 ? 8 : 16);
        let uniStr = uniNum < 128 ? emojiStrMap['\ \'] : emojiStrMap['\ \'] + "+" + emojiStrMap["u"];
        for(let s of numstr) {
            uniStr += "+" + emojiStrMap[s] + ")";
        }
        str += "+" + uniStr;
    }
    return str;
}

function template(text) {
    return  '゚ω゚ Blue = /' M ´) Blue ~ loot and ADDED / /*´∇ '*/['_']; O = (゚ * ゚) = _ = 3; C = (゚ θ ゚) = (゚ 漢 字 ー゚) - (゚ 漢 字); (゚ д ゚) = (゚ θ ゚) = (o ^ _ ^ O)/(o ^ _ ^ O); (゚ Д ゚) = {゚ Θ ゚ : '_', ゚ omega ゚ ノ : ((゚ omega ゚ ノ = = 3) + '_') [゚ Θ ゚], ゚ ー ゚ ノ : (゚ omega ゚ ノ + '_') [o ^ _ ^ o - (゚ Θ ゚)], ゚ Д ゚ ノ : (゚ * ゚ == 3) + '_')[゚ * ゚]}; (゚ д ゚)[゚ θ ゚] = ((゚ω blue == 3) + '_')[C ^ _ ^ O]; (゚ Д ゚) [' c '] = ((゚ Д ゚) + '_') [(゚ ー ゚) + (゚ ー ゚) - (゚ Θ ゚)]; (゚ д ゚)['o'] = ((゚ д ゚) + '_')[kappa θ ゚]; (゚ o ゚) = (゚ Д ゚) [' c '] + (゚ Д ゚) [' o '] + (゚ omega ゚ ノ + '_') [゚ Θ ゚] + ((゚ omega ゚ ノ = = 3) + '_') [゚ ー ゚] + ((゚ Д ゚) + '_') [(゚ ー ゚) + (゚ ー ゚)] + ((゚ ー ゚ = = 3) + '_') [゚ Θ ゚] + ((゚ ー ゚ = = 3) + '_') [(゚ ー ゚) - (゚ Θ ゚)] + (゚ Д ゚) [' c '] + ((゚ Д ゚) + '_') [(゚ ー ゚) + (゚ ー ゚)] + (゚ Д ゚) [' o '] + ((゚ ー ゚ = = 3) + '_')[゚ θ ゚]; (゚ д ゚)['_'] = (o ^ _ ^ O)[゚o゚][゚o disk]; (゚ epsilon ゚) = ((゚ ー ゚ = = 3) + '_') [゚ Θ ゚] + (゚ Д ゚). ゚ Д ゚ ノ + ((゚ Д ゚) + '_') [(゚ ー ゚) + (゚ ー ゚)] + ((゚ ー ゚ = = 3) + '_') [o ^ _ ^ o - ゚ Θ ゚] + ((゚ * ゚ == 3) + '_')[゚ θ ゚] + (゚ω blue + '_')[゚ θ harvest]; (゚ * ゚) += (゚ θ ゚); (゚ д ゚)[゚ε゚] = '゚ '; ゚ д ゚).゚ θ ゚ = (alternately alternately alternately)[O ^ _ ^ O - (occasionally θ ゚)]; (o゚ * ゚o) = (゚ω゚ Blue + '_')[c ^ _ ^ O]; (゚ д ゚)[゚o゚] = '\"'; (゚ д ゚)['_']((゚ д ゚)['_'](゚ε fe + (64bit)[MB] +${text}+ (゚ д ゚)[゚o゚])(゚ θ ゚))('_'); `
};

const text = window.prompt("Please enter the character you want to convert.");
const res = template(generateEmojiCode(text));
console.log(res.replace(/[\r\n\s]/g.""))
Copy the code