javascript:可以运行的噪音

JavaScript在网页中的三大生存现场与运行本质 JavaScript不是孤立的编程语言,而是嵌入网页生命周期的动态行为引擎。它依托HTML解析、用户交互和页面加载三大运行时场景,通过DOM操作、事件驱动和异步调度实现真实交互。理解其在FCP与DOM Content Loaded之间的执行时机,掌握js三级联动、javascript:void(0)js反爬实战等典型用例背后的运行逻辑,是构建高性能、可维护前端应用的基础。本文从浏览器渲染流水线、V8引擎工作流到Bun等新型JS运行时演进,揭示JS如何在真实网页中‘呼吸’与‘响应’,帮助开发者建立代码与界面 阅读详情

为我的博客做了一个很有 geek 风格的关于页面

运行下面 javascript 代码,可以看到我的信息。

 

(+[[]+(1<<1<<1<<1)+(1^1<<1)+(1<<1>>1)+(-~1<<1<<1)+(1.1>>1.1)+(11>>>1)])[[(!!/-/+{})[111^111]+[[]+{}][!1&.1][1|1>>1|1]]+([111/[]+[]][+(1>1)][([]+{})[11-1>>1]+[[],[]+{}+[]][[]+1][1]+(/^/[1]+[])[1|1>>1|1]+[{},1e1,!{}+[]][1+1][1<<1^1]+(11/!{}+{})[~1+1e1+~1]+[!!{}+{}][[]&111][1&1]+(/^/[111]+[])[11^11]+[{},[{}]+{},1][1+[]][11-~1+11>>1]+(!!1+{})[1&1>>1]+([]+{1:1}+[])[1|1]+[[]+!!1][111>>>111][1<<1>>1]]+[])[([]+![111])[1|1<<1|1]+[/=/,[]+[][11]][1|[]][1>>1]+([{}]+{})[1+!![1]]+[1,!1+/~/][1%11][1^1<<1]+(111/[]+{})[~1+1e1+~1]+[!!/-/+/-/][111%111][+!!1]]((~1+1e1+1)+((!1&.1)==([]+/-/[(!![111]+{})[1^1]+(!![1]+[])[1<<1^1]+(!{}+{})[1^1<<1]+(!![1]+/-/)[+(1>1)]])[+(1>1)]),1-~1<<1)](~1-~1e1<<1<<1)+":"+(([]===[])+/-/)[5]+(([]===[])+/-/)[5]+(+[[]+(1e1>>1)+(~1+1e1+~1)+(!1&.1)+(111%11)+(1+1<<1)+(1<<1^11>>1)+(1<<1<<1)+(~1+1e1+1)+(+(1>1))+(+[])+(~1-1+11)+(-~1<<1<<1)+(1-~1<<1)+(~1+1e1)])[[(!!/-/+[])[11&[]]+[[]+{11:11}+[]][111>>111][1+[]]]+([11/!1+/1/][1&1>>1][([{}]+{})[1e1>>1|1]+[[],[]+{111:111}+[]][1|1][111%11]+([]+[][11])[1<<1>>1]+[{},1e1,!/~/+{}][1<<1^1>>1][1<<1^1]+([]+11/!{})[~1+1e1+~1]+[!![111]+[]][1%1][1&1]+([]+[][111])[.1^!1]+[{},[]+{},1][111%11][11-~1+11>>1]+([]+!!1)[111>>>111]+([]+{}+[])[[]+1]+[!!1+[]][1^1][111%11]]+[])[(!1+{})[1^1<<1]+[/=/,[]+/^/[11]][1|[]][11.11>>11.11]+([]+{}+[])[~~(1.1+1.1)]+[1,!{}+/~/][1][1|1<<1]+(1/!{}+[])[~1+1e1+~1]+[!![1]+{}][111.111>>111.111][1+[]]]((11^1<<1)+((1>>1)==([]+/-/[(!!/-/+/-/)[+(111>111)]+(!![11]+[])[1-~1]+(![11]+{})[1|1<<1|1]+(!!{}+[])[11%11]])[111.111>>111.111]),11+1>>1)](~1-~1e1<<1<<1)+"."+(+[[]+([]+1)+(1-~1<<1)+(1+1<<1)+(1|1<<1)+(1<<1<<1<<1)])[[(!!1+{})[!1&.1]+[[]+{}+[]][1&[]][1+[]]]+([11/[]+{}][+(111>111)][([{}]+[{}])[1e1>>1]+[[],[]+{}][[]+1][+!!1]+(/^/[111]+/&/)[1&1]+[{},1e1,!1+[]][1<<1][1^1<<1]+(111/!{}+/1/)[~1+1e1+~1]+[!!/-/+[]][11>>11][1|1]+([][1]+/&/)[1.1>>1.1]+[{},[{}]+{},1][~~1][1+1e1+1]+([]+!!1)[1^1]+([]+{})[1&1]+[!!1+{}][!1&.1][1|[]]]+[])[([]+!1)[1|1<<1|1]+[/=/,[]+/^/[11]][111%11][11.11>>11.11]+([{}]+[{}])[~~(1.1+1.1)]+[1,[]+!/~/][1|1>>1|1][1^1<<1]+([]+11/[])[11+1>>1]+[!!/-/+{}][+(1<1)][~~1]]((1e1-1)+((+[])==([]+/-/[(!!1+[])[!1&.1]+(!!/-/+/-/)[1|1<<1|1]+(!1+{})[1<<1^1]+(!![1]+/-/)[11>>11]])[111^111]),-~11>>1)](~1-~1e1<<1<<1)

如何实现的呢?

@OKter 说是 ASCII 码拼接。到底是不是呢?

第一步

先来个简单的,就以 justjavac 为例吧。首先我们要输出 j

下面这段代码可以输出 j

(1+{})[4]

解释:代码 1+{} 的结果是 "1[object Object]", 显然,我们得到了一个包含 j 的字符串。但为什么会如此奇怪呢?毕竟我们都期望 1+{} 的结果应该是 1。

对象加法

有下面这样的一个加法操作。

value1 + value2

在计算这个表达式时,内部的操作步骤是这样的 (§11.6.1):

  1. 将两个操作数转换为原始值 (以下是数学表示法的伪代码,不是可以运行的 JavaScript 代码):

     prim1 := ToPrimitive(value1)
     prim2 := ToPrimitive(value2)
    

    PreferredType 被省略,因此 Date 类型的值采用 String,其他类型的值采用 Number

  2. 如果 prim1 或者 prim2 中的任意一个为字符串,则将另外一个也转换成字符串,然后返回两个字符串连接操作后的结果。

  3. 否则,将 prim1 和 prim2 都转换为数字类型,返回他们的和。

更多详细内容参考

 

由于字符串可以当作数组一样取里面的元素,于是 (1+{})[4] 就得到了 j。

第二步

既然我们得到了 j,那下一步就是 u 了。我们还是按照这个思路,哪个字符串里面还有 u 呢? 在 javascript 中确实有这么一个特殊的值,含有 u: "undefined",思来想去,可以使用这段代码:

/1/[1]+[]

分开解释:

  1. /1/ 是一个正在表达式

  2. 当他后面跟上 [] 时,被强制转换成了数组,然后去取里面的元素(第二个元素),得到的结果是 undefined(注意:是 undefined 值,不是字符串)

  3. 把 undefined 转换成字符串,在这里我们把它和数组相加。

呵呵,上面使用正在表达式 /1/ 有点儿卖弄的嫌疑,其实用 1[1] 就够了。 为了更有 geek 感,可以多出现 0 和 1。通过 /1+/[+0]+[+1] 我们可以得到字符串 "undefined1"。

使用数组操作符把我们想要的 u 提取出来, (/1+/[+0]+[+1])[0]

现在我们已经得到了字符串 "ju" 了。按照这种方法,我们可以得到其他的字符串。没有做不到的,只有想不到的。

问题来了

用这种方法能拼出所有的字符吗? @长夜 则提出了更深的问题: “可以拼中文吗?”

@TODO 待续……

大功告成

当我们得到了所有的字符串,就可以使用 + 号把他们连接起来。 你以为这就完了吗?当然远远没有,我们应该让我们的代码更 Cool,更有 geek 范。

相关阅读:

JavaScript实现中值滤波(附完整源码) 阅读详情

相关推荐

66.电视噪音动画特效

效果 (源码网盘地址在最后) 视频演示 「前端编程实战 66」电视噪音动画特效 视频地址一:https://www.ixigua.com/6850386816432865806/ 视频地址二:https://www.bilibili.com/video/BV1Jv411q7oh/ 源码 index.html <!DOCTYPE html> <html lang="en

粉丝们务必加入微信粉丝群 4114

js 验证码 带噪音线的

很容易掌握的一款验证码程序。本例是用c# 2008写的

JS的100多个犀利效果(有效果图,有代码)

网页中的各种JS神奇效果,有源码,有图片,可直接拿进自己项目中用。

使用js实现基于可视布局信息的网页噪音去除的测试方法

 可视布局信息的网页噪音去除方法很早就从网上看到,但是苦于没有java中没有简单的方法能够得到网页元素位于屏幕中的实际位置,所以一直没做过,前一段时间学js,突然发现js能很容易得到每个网页元素位于屏幕中的实际位置。所以就写了这个简单函数测试了一下,好像效果还不错,不过个人认为基于可视布局信息的网页噪音去除最好和其他的方法结合使用,单独使用准确率还不是很好。function getElementT

dongle2001的专栏 1505

javascript 过滤_了解javascript过滤噪音

javascript 过滤Javascript filter() function is one of my favorite array functions and can be very useful in many cases. But it can be tricky to get the hang of at first and to get over the that bump in ...

weixin_26717681的博客 627

html5杂音,搜索优化中说的网页噪声到底是什么?怎么去噪?

理想情况下seo要做的事情很多,其中去除冗余代码是很重要的一部分。为什么要去除冗余代码?这是由于页面上线之后会多出很多无用的代码,比如空格、重复的div和js/css调用。尤其是有些网站是直接从互联网下载下来二次开发的源码,其中很大一部分代码对于新网站来讲都是无用的,完全在浪费服务资源。外联样式和内联样式的css和js也是老生常谈的问题,确切的来说是属于web前端优化的一部分,但由于绝大部分站点项...

weixin_29292535的博客 952

rot.js噪音生成技术:使用Simplex和Perlin噪音创建自然地形

rot.js是一款强大的JavaScript Roguelike游戏开发工具包,提供了丰富的地牢生成、视野计算和噪音生成等功能。其中,噪音生成技术是创建自然地形的核心,通过Simplex和Perlin噪音算法,开发者可以轻松生成逼真的游戏地形。 ## 噪音生成在游戏开发中的重要性 🎮 在Roguelike游戏中,自然地形的生成对于营造沉浸感至关重要。传统的随机地形往往显得生硬且不自然,而噪音

gitblog_00723的博客 922

JS Analyzer揭秘:智能噪音过滤技术如何提升80%漏洞检测效率?

JS Analyzer是一款强大的Burp Suite扩展,专为JavaScript静态分析设计。它能够从JavaScript文件中提取API端点、URL、密钥和电子邮件地址,并通过智能噪音过滤技术显著提升漏洞检测效率。该工具的核心目标是尽可能减少噪音,确保分析结果的准确性,帮助安全测试人员更快速地发现潜在安全问题。 ## 为什么传统JS分析工具效率低下? 在Web应用安全测试中,JavaSc

gitblog_01095的博客 695

perlin.js 噪声js

噪声就是给定一个输入变量,生成一个值在0~1范围内的伪随机变量的函数。在图形学中一般是输入一个坐标得到一个范围在0~1之间的变量,在利用各种颜色计算得到一些比较酷炫的效果,像火焰、云彩、地形等。

node-noise3d:JavaScript中的3D噪点

noise3d 安装 npm install noise3d 用法 var noise = require ( "noise3d" ) ; var perlin = noise . createPerlin ( { interpolation : noise . interpolation . linear , permutation : noise . array . shuffle ( noise . array . range ( 0 , 255 ) , Math . random ) } ) ; var brownian = noise . createBrownianMotion ( { octaves : 4 , persistence : 0.5 , noise : perlin } ) ; for ( var x = 0 ; x < 512 ; x ++ ) {

three.js在canvas画布上生成噪音图,然后创建凹凸贴图(vue中使用three.js79)

使用高光贴图创建色彩鲜明的地球1.demo效果2. 实现要点2.1 引入噪音函数库2.2在画布上绘制噪音图2.3 创建凹凸贴图材质的网格对象2.4 更新bumpScale4. demo代码 1.demo效果 2. 实现要点 2.1 引入噪音函数库 在public目录下的index.html文件中通过< script >标签引入perlin.js 文件 <script type="text/javascript" src="./libs/perlin.js"></script&

点燃火柴的博客 1015

JS Analyzer实战案例:从JavaScript文件中挖掘AWS密钥与敏感API的3个技巧

JS Analyzer是一款强大的Burp Suite扩展工具,专为JavaScript代码分析设计,能精准识别并提取AWS密钥、敏感API端点等关键信息,有效降低噪音干扰。在Web应用安全审计中,它能帮助安全人员快速定位潜在的敏感信息泄露风险。 ## 技巧一:利用内置正则模式精准捕获AWS密钥 JS Analyzer的核心功能之一是通过预设的正则表达式模式识别各类敏感凭证。在[js_anal

gitblog_00262的博客 786

STFU源码解析:仅60行代码实现的噪音反击神器,开发者必看

在日常生活中,我们常常遇到公共场所有人大声播放视频或喧哗的情况,礼貌提醒往往收效甚微。STFU(Shut The Fuck Up)作为一款仅用60行代码实现的噪音反击神器,通过巧妙的音频反馈原理,让噪音制造者主动降低音量。本文将深入解析这个充满创意的开源项目,带你了解如何用极简代码解决现实问题。 ## 项目诞生:从机场噪音到创意解决方案 STFU的诞生源于开发者在孟买机场的一次真实经历——一名

gitblog_00709的博客 837

如何用 Defuddle 高效清理网页噪音:从入门到精通完整教程

Defuddle 是一款强大的网页内容提取工具,能够智能地去除网页中的噪音元素,提取纯净的 Markdown 内容。无论你是内容创作者、研究人员还是开发者,这个工具都能帮你快速获取网页的核心信息,告别繁琐的复制粘贴和格式整理。💪 ## 什么是 Defuddle? Defuddle(发音:/diˈfʌdl/)是一个专门用于从网页中提取主要内容的 JavaScript 库。它能智能识别并移除网页

gitblog_00071的博客 314
上一篇: 程序员在 5 月 20 日这天有什么特别的表白方式?
下一篇: PHP 最佳实践(译)——PHP 容易混淆技术的实用指南
迷渡
迷渡 领域专家: 前端开发技术领域 领域专家: 前端开发技术领域
博客等级 码龄19年 2399粉丝 124原创
评论 4
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值