JS技巧之一行赋值语句能玩出多少花样

目录
  • 前言
  • 第一种变化、写入到自执行函数中：
  • 第二种变化、用eval执行：
  • 第三种变化、变形的eval执行：
  • 第四种变化、利用构造函数：
  • 第五种变化、构造函数再升级：
  • 第六种变化、构造函数变形：
  • 第七种变化、混淆加密：
  • 总结

前言

今天，来做个测试，看看一行简单的JS赋值语句，有多少种写法。

测试语句，仅三行：

var a=1;
a=2;
console.log(a);

针对第二行a=2赋值，看能变多少花样。

第一种变化、写入到自执行函数中：

var a=1;
(function(){
a=2;
})();
console.log(a);

第二种变化、用eval执行：

var a=1;
eval(a=2);
console.log(a);

这两种，都比较初级，小白等级的程序员也能轻松看懂。

接下来，提升一些难度。

第三种变化、变形的eval执行：

对eval中的赋值语句，进行一些变化。

var a=1;
var b=["a","=",2];
eval(b[0]+b[1]+b[2]);
console.log(a);

但eval，似乎也就能玩到这个水准。下面再展示些难度更高的。

第四种变化、利用构造函数：

var a=1;
[].constructor.constructor(a=2);
console.log(a);

或：

var a=1;
[].constructor.constructor(a=2)();
console.log(a);

第五种变化、构造函数再升级：

var a=1;
var b=["a","=",2];
[].constructor.constructor(b[0]+b[1]+b[2])();
console.log(a);

如同eval执行内容变化一样，对构造执行代码也用数组内容拼接的方式进行变形：

第六种变化、构造函数变形：

将构造字符也放入数组中：

var a=1;
var b=["a","=",2,"constructor"];
[][b[3]][b[3]](b[0]+b[1]+b[2])();
console.log(a);

第七种变化、混淆加密：

将上面的JS代码用JShaman进行混淆加密：

得么混淆加密的JS代码，这时数值也被加密：

/*Obfuscated by JShaman.com*/
var a=0x2c0f8^0x2c0f9;
var b=['a','=',0xe3b2c^0xe3b2e,'constructor'];
[][b[0xa8ddf^0xa8ddc]][b[0xb3a35^0xb3a36]](b[0x3333f^0x3333f]+b[0x84d18^0x84d19]+b[0x50958^0x5095a])();
console['log'](a);

玩这些花样有什么用处吗？

当然是有的，最后得到的代码，完全看不出是在执行a=2，赋值操作被隐藏了：

当需要对代码进行加密，防止被他人任意阅读时，这是很有用的方法。

你还有什么新奇的写法吗，欢迎探讨交流。

总结

到此这篇关于JS技巧之一行赋值语句能玩出多少花样的文章就介绍到这了,更多相关JS赋值语句内容请搜索我们以前的文章或继续浏览下面的相关文章希望大家以后多多支持我们！

赞 (0)

相关推荐

  • js 连续赋值的简单实现

    js 连续赋值的简单实现

    无意中网上发现的这个问题,预想的结果和真实的结果大相径庭. var a={n:1} var b=a; a.x=a={n:2} console.log(a.x); console.log(b.x); undefined Object{n:2} 要是拆开来看,结果就是我所想的那样 var a={n:1} var b=a; a={n:2}: a.x={n:2} console.log(a.x);//Object{n:2}console.log(b.x);//undefined 分析: a.x=a={n

  • javascript实现连续赋值

    javascript实现连续赋值

    最近项目接触,时间比较充足,到网上逛逛了逛无意中在网上发现了这个问题,预知的结果和真实结果相差太大. 请看下面代码 var a={n:1} var b=a; a.x=a={n:2} console.log(a.x); console.log(b.x); undefined Object{n:2} 如果把代码拆开来看,结果就是我们所想的那样 var a={n:1} var b=a; a={n:2}: a.x={n:2} console.log(a.x);//Object{n:2} console.

  • js中变量的连续赋值(实例讲解)

    今天遇到了一个连续赋值的经典案例,网友们给出的答案也是五花八门,看起来有些繁琐,我也来说说自己的看法. 下面就是这个经典案例: var a = {n: 1}: var b = a; a.x = a = {n: 2}: console.log(a); console.log(b); console.log(a.x); console.log(b.x): 我们先来看一下普通连续赋值,即:变量赋值的类型是数据类型值 var a=3; var b=a=5; console.log(a); console

  • JS数组的赋值介绍

    复制代码 代码如下: var test=[1,2,3,4,5,6,7]; var arr=test;arr.splice(2,1);alert(test);//1,2,4,5,6,7 JS数组实质上是对象.因此,上面的源代码最后打印出的是1,2,3,4,5,6.这是因为将test赋值给arr实际上是将数组的引用赋值给arr,所以操作arr也同时会 改变源数组. 要实现数组克隆,可用以下方法: 复制代码 代码如下: Array.prototype.clone=function(){   retur

  • JS技巧之一行赋值语句能玩出多少花样

    目录 前言 第一种变化.写入到自执行函数中: 第二种变化.用eval执行: 第三种变化.变形的eval执行: 第四种变化.利用构造函数: 第五种变化.构造函数再升级: 第六种变化.构造函数变形: 第七种变化.混淆加密: 总结 前言 今天,来做个测试,看看一行简单的JS赋值语句,有多少种写法. 测试语句,仅三行: var a=1; a=2; console.log(a); 针对第二行a=2赋值,看能变多少花样. 第一种变化.写入到自执行函数中: var a=1; (function(){ a=2;

  • 分享一些不常见却很实用的JS技巧

    分享一些不常见却很实用的JS技巧

    前言 编程语言通常暗藏着各种技巧,熟练使用这些技巧可以提高开发效率.JavaScript 就是一门技巧性很强的语言,掌握常见的语法技巧不但可以加深对语言特性的理解,还可以简化代码,提高编码效率. 下面是列出一些 JavaScript 有用的技巧,相信总有一天会对你有所帮助. 1.数组去重 const numbers = [1, 2, 3, 4, 4, 1] console.log([...new Set(numbers)]) // [1, 2, 3, 4] 2.从数组中过滤所有虚值 const 

  • 今天分享几个少见却很有用的 JS 技巧

    今天分享几个少见却很有用的 JS 技巧

    1. "返回"按钮 使用 history.back() 可以创建一个浏览器"返回"按钮. <button onclick="history.back()"> 返回 </button> 2. 数字分隔符 为了提高数字的可读性,您可以使用下划线作为分隔符: const largeNumber = 1_000_000_000; console.log(largeNumber); // 1000000000 3. 事件监听器只运行

  • JS技巧多状态页面中的mock方案详解

    目录 引言 技术选型 业务逻辑改造 Eruda 插件 Mock 数据整理 引言 我们有时候会遇到一个业务页面存在很多个状态,甚至子状态,比如订单详情就是其中的典型,涉及从订单创建到订单结束,以及售后等流程.维护起来每个状态对应一份数据,虽然我们 QA 提供了数据构造平台,但构造一份对应状态的数据还是需要花费不少时间,而且串行流程一旦出错的话只能重新来一遍. 后期维护阶段也不容易构造对应状态的数据,导致排查页面问题比较耗时. 另外一个问题就是从头熟悉业务的话成本比较高,如果有一个直观的页面能够看到

  • JS技巧动手实现红包兔子雨效果示例详解

    目录 前言 展示效果 技术栈 思考与实现 红包下落效果 生成红包雨 打开红包效果 兔子雨效果 拓展 设置中奖概率 后记 前言 人生天地之间,若白驹过隙,忽然而已.不知不觉中,2022年已然逝去,2023年也过去了半个月了.看到「兔了个兔」这个活动几天了,不过这周比较忙,没时间参与. 心血来潮,捣鼓了一晚上,实现一个兔年的红包雨(兔子雨)效果~ 展示效果 技术栈 Vue2 SCSS:实现红包雨(兔子雨)效果.按钮交互效果等. 思考与实现 首先,思考一下最终的展示效果:在屏幕上会有很多随机下落的兔子

  • JS技巧Canvas 性能优化脏矩形渲染实例详解

    目录 正文 画布该如何更新? 脏矩形渲染原理 脏矩形渲染实现 性能测试 结尾 正文 使用 Canvas 做图形编辑器时,我们需要自己维护自己的图形树,来保存图形的信息,并定义元素之间的关系. 我们改变画布中的某个图形,去更新画布,最简单的是清空画布,然后根据图形树将所有图形再绘制一遍,这在图形较少的情况下是没什么问题的.但如果图形数量很多,那绘制起来可能就出现卡顿了. 那么,有没有什么办法来优化一下?有,脏矩形渲染. 画布该如何更新? 这里我们假设这么一个场景,画布上绘制了随机位置大量的绿球,然

  • AngularJS压缩JS技巧分析

    本文实例讲述了AngularJS压缩JS的操作技巧.分享给大家供大家参考,具体如下: 大多数web项目在发布时候都会对js代码进行压缩,目的是为了减少js文件的大小,节省一点流量. 它的原理很简单,就是对参数及部分变量名和函数进行重命名. 但是这种工作方式在AngularJS的应用中会有例外. 由于AngularJS的依赖注入是根据参数名进行注入的,显然,对参数进行重命名会破坏这个机制. 如果不进行特殊处理,进行压缩(minify)之后,在执行时将会出现这样的错误 Unknow provider

  • 大家未必知道的Js技巧收藏

    1.document.GetElementsByTagName可以获得某一个标签的所有元素,可以通过  document.getElementsByTagName('*') 获得页面上的所有元素,这里星号代表任何标签,而注释标签的tagName是"!" 2.String 的方法substr与substring的区别  substr(start[,length]);//表示从start位置开始取length个字符串 substring(start,end);//表示从start,到end

  • js技巧收集(200多个) 超强推荐第1/2页

    1.文本框焦点问题 onBlur:当失去输入焦点后产生该事件 onFocus:当输入获得焦点后,产生该文件 Onchange:当文字值改变时,产生该事件 Onselect:当文字加亮后,产生该文件 <input type="text" value="郭强" onfocus="if(value=='郭强') {value=''}" onblur="if  (value=='') {value='郭强'}">点击时文字

  • js技巧--转义符"\"的妙用

    // blueDestiny, never-online // blueDestiny [at] 126.com 通常,我们在动态给定一个container的innerHTML时,通常是样做的: <div id="divc" /> <SCRIPT LANGUAGE="JavaScript"> var div = document.getElementById("divc"); var html = ""

随机推荐