js 奇葩技巧之隐藏代码


Posted in Javascript onAugust 11, 2017

昨天在群看到有人发了个文章叫《“短”化你的代码》,思路非常不错,采用unicode的零宽字符来实现字符隐藏,虽然有字符,可是你却看不见它。
这篇文章详细的介绍了这种方法的实现原理,最后还给出了一个生成工具。

当然,作者算了留了一个小小的练习给我们,因为他只用了两个字符,导致转换后的数据是原始数据的 8倍。
他给我们提供了4个零宽字符,我们就可以缩小至4倍。

好了,我们来看下代码吧。

(function(window) {
 var rep = { // 替换用的数据,使用了4个零宽字符,数据量减少了一半。
  '00': '\u200b',
  '01': '\u200c',
  '10': '\u200d',
  '11': '\uFEFF'
 };
 function hide(str) {
  str = str.replace(/[^\x00-\xff]/g, function(a) { // 转码 Latin-1 编码以外的字符。
   return escape(a).replace('%', '\\');
  });
  str = str.replace(/[\s\S]/g, function(a) { // 处理二进制数据并且进行数据替换
   a = a.charCodeAt().toString(2);
   a = a.length < 8 ? Array(9 - a.length).join('0') + a : a;
   return a.replace(/../g, function(a) {
    return rep[a];
   });
  });
  return str;
 }
 var tpl = '("@code".replace(/.{4}/g,function(a){var rep={"\u200b":"00","\u200c":"01","\u200d":"10","\uFEFF":"11"};return String.fromCharCode(parseInt(a.replace(/./g, function(a) {return rep[a]}),2))}))';
 window.hider = function(code, type) {
  var str = hide(code); // 生成零宽字符串
  str = tpl.replace('@code', str); // 生成模版
  if (type === 'eval') {
   str = 'eval' + str;
  } else {
   str = 'Function' + str + '()';
  }
  return str;
 }
})(window);

大家可以通过最简单的代码例子进行测试一下,看看效果如何,也可以进一步优化,或者写成插件什么的,就当练习吧。。
虽然这个东西没什么实际用处,不过有时候玩玩还是不错的,可出面试题吓唬新人哦。。

以上就是小编为大家整理的js 奇葩技巧之隐藏代码,希望对大家有所帮助!

Javascript 相关文章推荐
javascript 自动转到命名锚记
Jan 10 Javascript
Node.js中创建和管理外部进程详解
Aug 16 Javascript
跟我学习javascript的严格模式
Nov 16 Javascript
js canvas实现擦除动画
Jul 16 Javascript
JQuery 设置checkbox值二次无效的解决方法
Jul 22 Javascript
全面解析node 表单的图片上传
Nov 21 Javascript
jquery横向纵向鼠标滚轮全屏切换
Feb 27 Javascript
JS正则替换去空格的方法
Mar 24 Javascript
vue货币过滤器的实现方法
Apr 01 Javascript
详解webpack+vue-cli项目打包技巧
Jun 17 Javascript
JS运动特效之链式运动分析
Jan 24 Javascript
webpack DllPlugin xxx is not defined解决办法
Dec 13 Javascript
echart简介_动力节点Java学院整理
Aug 11 #Javascript
Javascript中this关键字指向问题的测试与详解
Aug 11 #Javascript
使用JS编写的随机抽取号码的小程序
Aug 11 #Javascript
javascript简写常用的12个技巧(可以大大减少你的js代码量)
Mar 28 #Javascript
Mobile Web开发基础之四--处理手机设备的横竖屏问题
Aug 11 #Javascript
Vue.js仿微信聊天窗口展示组件功能
Aug 11 #Javascript
Node.js服务器开启Gzip压缩教程
Aug 11 #Javascript
You might like
Classes and Objects in PHP5-面向对象编程 [1]
2006/10/09 PHP
php var_export与var_dump 输出的不同
2013/08/09 PHP
PHP连接MySQL查询结果中文显示乱码解决方法
2013/10/25 PHP
PHP使用mysqli操作MySQL数据库的简单方法
2017/02/04 PHP
来自国外的页面JavaScript文件优化
2010/12/08 Javascript
JQuery 应用 JQuery.groupTable.js
2010/12/15 Javascript
DB.ASP 用Javascript写ASP很灵活很好用很easy
2011/07/31 Javascript
jQuery制作简单柱状图实例
2015/01/28 Javascript
基于JS实现无缝滚动思路及代码分享
2016/06/07 Javascript
针对BootStrap中tabs控件的美化和完善(推荐)
2016/07/06 Javascript
Angular 2 利用Router事件和Title实现动态页面标题的方法
2017/08/23 Javascript
vue init失败简单解决方法(终极版)
2017/12/22 Javascript
js数组常用最重要的方法
2018/02/04 Javascript
vue中各选项及钩子函数执行顺序详解
2018/08/25 Javascript
详解JavaScript原生封装ajax请求和Jquery中的ajax请求
2019/02/14 jQuery
javascript 数组精简技巧小结
2020/02/26 Javascript
[03:14]辉夜杯主赛事 12月25日每日之星
2015/12/26 DOTA
[11:42]2018DOTA2国际邀请赛寻真——OG卷土重来
2018/08/17 DOTA
在Python中操作字典之update()方法的使用
2015/05/22 Python
Python使用flask框架操作sqlite3的两种方式
2018/01/31 Python
python使用Flask操作mysql实现登录功能
2018/05/14 Python
python写入并获取剪切板内容的实例
2018/05/31 Python
Python函数和模块的使用总结
2019/05/20 Python
python实现串口自动触发工作的示例
2019/07/02 Python
基于pytorch的保存和加载模型参数的方法
2019/08/17 Python
24个canvas基础知识小结
2014/12/17 HTML / CSS
分享29个基于Bootstrap的HTML5响应式网页设计模板
2015/11/19 HTML / CSS
局域网定义和特性
2016/01/23 面试题
财务主管自我鉴定
2014/01/17 职场文书
教育学习自我评价
2014/02/03 职场文书
工程材料采购方案
2014/05/18 职场文书
报表员工作失误检讨书范文
2014/09/19 职场文书
租车协议书范本2014
2014/11/17 职场文书
2014年个人年终总结
2015/03/09 职场文书
mysql 获取相邻数据项
2022/05/11 MySQL
CSS link与@import的区别和用法解析
2023/05/07 HTML / CSS