Javascript/jQuery 改进我的 javascript 代码的缩小
Javascript/jQuery improve minification of my javascript code
我有这段 Javascript 代码(使用 jQuery),它是 146 字节:
$("#b").click(s=>{t=$("#a").val();o=[...t];for(p=0;p<t.length;p++){r=Math.random();if(.1>r)if(.03>r)o[p]=t[p--];else r>.07?o[p]="":o[p]+=t[p]}$("p").html(o)})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="a" placeholder="Insert here some text"/>
<button id="b">Generate typos</button>
<p></p>
基本上,当您点击按钮时,插入文本的每个字母都有 10% 的几率出现拼写错误,用前一个字母替换该字母,或者干脆消失。
这段代码是基于this codegolf question,但是我已经根据个人喜好修改了问题。
有什么方法可以减少 Javascript 代码使用的字节数吗?
注意:我不需要任何安全改进或性能改进。
这里是 Javascript 代码的整理版本,用于理解写下的内容:
$("#b").click(s => { //onclick
t = $("#a").val(); //get value of input
o = [...t]; //create array with each char in t as an index
for (p in o) { //loop through o
r = Math.random(); //generate random number
if (.1 > r) //if the random number is lower than 0.1 (~10% chance)
if (.03 > r) o[p] = t[p--]; //if the random number is lower than 0.03
else r > .07 ? o[p] = "" : o[p] += t[p] //else check if the random number is higher than 0.07
} //closing for loop
$("p").html(o) //replace content in p tags
})
更新:我已尽我所能改进它(137 字节):
$("#b").click(a=>{t=$("#a").val(),o=[...t];for(p in o)r=Math.random(),.1>r&&(.03>r?o[p]=t[p--]:r>.07?o[p]="":o[p]+=t[p]);$("p").html(o)})
整理后的样子:
$("#b").click( //onclick
a => { //arrow function
t = $("#a").val(), //get value of #a
o = [...t]; //make t an array
for (p in o) //loop through the array
r = Math.random(), //generate random number
.1 > r //if the number is smaller than 0.1
&& //and
(.03 > r ? o[p] = t[p--] : r > .07 ? o[p] = "" : o[p] += t[p]);//check if the number is smaller than 0.03 else check if number is smaller than 0.7
$("p").html(o)//write to p tag
})
DOM 具有 id
属性的元素是全局变量,因此例如您可以将 $("#b")
替换为 $(b)
.
$(b).click(s=>{t=$(a).val(),o=[...t];for(q in o)r=Math.random(),.1>r&&(.03>r?o[q]=t[q--]:r>.07?o[q]="":o[q]+=t[q]);$(p).html(o)});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="a" placeholder="Insert here some text"/>
<button id="b">Generate typos</button>
<p id="p"></p>
我有这段 Javascript 代码(使用 jQuery),它是 146 字节:
$("#b").click(s=>{t=$("#a").val();o=[...t];for(p=0;p<t.length;p++){r=Math.random();if(.1>r)if(.03>r)o[p]=t[p--];else r>.07?o[p]="":o[p]+=t[p]}$("p").html(o)})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="a" placeholder="Insert here some text"/>
<button id="b">Generate typos</button>
<p></p>
基本上,当您点击按钮时,插入文本的每个字母都有 10% 的几率出现拼写错误,用前一个字母替换该字母,或者干脆消失。
这段代码是基于this codegolf question,但是我已经根据个人喜好修改了问题。
有什么方法可以减少 Javascript 代码使用的字节数吗? 注意:我不需要任何安全改进或性能改进。
这里是 Javascript 代码的整理版本,用于理解写下的内容:
$("#b").click(s => { //onclick
t = $("#a").val(); //get value of input
o = [...t]; //create array with each char in t as an index
for (p in o) { //loop through o
r = Math.random(); //generate random number
if (.1 > r) //if the random number is lower than 0.1 (~10% chance)
if (.03 > r) o[p] = t[p--]; //if the random number is lower than 0.03
else r > .07 ? o[p] = "" : o[p] += t[p] //else check if the random number is higher than 0.07
} //closing for loop
$("p").html(o) //replace content in p tags
})
更新:我已尽我所能改进它(137 字节):
$("#b").click(a=>{t=$("#a").val(),o=[...t];for(p in o)r=Math.random(),.1>r&&(.03>r?o[p]=t[p--]:r>.07?o[p]="":o[p]+=t[p]);$("p").html(o)})
整理后的样子:
$("#b").click( //onclick
a => { //arrow function
t = $("#a").val(), //get value of #a
o = [...t]; //make t an array
for (p in o) //loop through the array
r = Math.random(), //generate random number
.1 > r //if the number is smaller than 0.1
&& //and
(.03 > r ? o[p] = t[p--] : r > .07 ? o[p] = "" : o[p] += t[p]);//check if the number is smaller than 0.03 else check if number is smaller than 0.7
$("p").html(o)//write to p tag
})
DOM 具有 id
属性的元素是全局变量,因此例如您可以将 $("#b")
替换为 $(b)
.
$(b).click(s=>{t=$(a).val(),o=[...t];for(q in o)r=Math.random(),.1>r&&(.03>r?o[q]=t[q--]:r>.07?o[q]="":o[q]+=t[q]);$(p).html(o)});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="a" placeholder="Insert here some text"/>
<button id="b">Generate typos</button>
<p id="p"></p>