js 的 骚操作
单行的js 代码虽然简洁,但却不易维护,甚至难以理解,
但这却并不影响前端童鞋们编写简洁代码的热情,
一 , 生成随机ID
// 生成长度为10的随机字母数字字符串
Math.random().toString(36).substring(2);
解析 :
1 , Math.random() 生成一个 0 到 1 的 随机数 =》 number = 0.7147259888717723
2 , number.toString(36(可选)) 本来number是没有toString方法的, number调用toString时
number会先变成一个number类型的包装类 再调用 toString 方法 把 它 变成 字符串 ,
toString(radix ) 的 参数 可选 , 不填默认是 10 ,参数表示 先把 数字
转化成 radix 进制 的 数字 , 然后再把结果转化成字符串
number.toString(36(可选)) =》 str = "0.pqa97fnmfz"
3 , substring(start, end) 是用来 截取 字符串的 ,从 start 开始 截 到 end ,
end 可以不传 就 截取到最后一位 , 并返回截取出来的字符串 ,
不改变原字符串
str.substring(2) 从第二位开始截 =》 “pqa97fnmfz”
二 , 每秒更新当前时间
setInterval(()=>document.body.innerHTML=new Date().toLocaleString().slice(10,18))
解析
new Date().toLocaleString() 返回 =》 str = "4/29/2019, 5:07:39 PM" str.slice(10 ,18)从第10位开始截 到 18 位 =》 "5:07:39" 然后每秒更新
三 , 生成随机 16 进制 颜色 码 如 # ffffff
'#' + Math.floor(Math.random() * 0xffffff).toString(16).padEnd(6, '0');
解析 :
* 运算符 会先把 0xfffff 转换成 数字 =》 1048575
Math.floor(Math.random() * 0xffffff) => number = 15235201 number.toString(36) 转化成 36 进制 的 字符串 =》 str = '92jk1' padEnd 和 padStart 都是 用来补全字符串的 的 操作 区别是 在后面补 还是在前面补, 接受两个参数 , 第一个参数 表示 补全 后 字符串的 长度 ,
第二个是 你 要补的字符串
str.padEnd(6, '0') 表示 在 str 后 补 0 , 补后 str 的 长度为 6 = > '92jk10'
就算 str.padEnd(6, '000') 结果还是 '92jk10' 因为长度固定了。 四 , 创建 特定长度 的 数组 并且 内容为 index
[...Array(3).keys()]
解析 :
Array(3) 创建一个长度为 3 的 空数组 =》 [empty × 3]
keys() 返回 一个 迭代器 可以用 for ....of 遍历 里面的 value 就是 index
.... 操作符 扒括号
再 套上一个中括号 =》 [0, 1, 2] 五 , 返回键盘
// 用字符串返回一个键盘图形
(_=>[..."`1234567890-=~~QWERTYUIOP[]\\~ASDFGHJKL;'~~ZXCVBNM,./~"].map(x=>(o+=`/${b='_'.repeat(w=x<y?2:' 667699'[x=["BS","TAB","CAPS","ENTER"][p++]||'SHIFT',p])}\\|`,m+=y+(x+' ').slice(0,w)+y+y,n+=y+b+y+y,l+=' __'+b)[73]&&(k.push(l,m,n,o),l='',m=n=o=y),m=n=o=y='|',p=l=k=[])&&k.join`
`)()
这操作。。。。。。 嗯~ o(* ̄▽ ̄*)o 表示看不懂 !!!!!!
不过还是收藏了
摘自 掘金沸点 https://juejin.im/post/5cc55eb5e51d456e577f93f0
js 的 骚操作的更多相关文章
- JS 的骚操作
一.强制类型转换 1.1string强制转换为数字 //可以用*1来转化为数字((实际上是调用.valueOf方法) 然后使用Number.isNaN来判断是否为NaN,或者使用 a !== a 来判 ...
- js常用骚操作总结
打开网址 window.open("http://www.runoob.com"); 判断是否为url var url = $("#url").val(); i ...
- vue开发中的"骚操作"
前言 在与同事协作开发的过程中,见识到了不少"骚操作".因为之前都没用过,所以我愿称之为"高级技巧"! Vue.extend 在交互过程中,有个需求就是点击图标 ...
- 用Markdown写Html和.md也就图一乐,真骚操作还得用来做PPT
前言 和这篇文章一样,我就是用Markdown写的.相信各位平时也就用Markdown写写文档,做做笔记,转成XHtml.Html等,今天教大伙一招骚操作:用Markdown写PPT. 绝大多数朋友做 ...
- js实现动态操作table
本章案例为通过js,动态操作table,实现在单页面进行增删改查的操作. 简要案例如下: <%@ page language="java" contentType=&quo ...
- nw.js如何处理拖放操作
nw.js如何处理拖放操作 其实拖放(drag-drop)操作是Html5的功能,不是nw.js的内置API,那么我们采用Html5应用一般的处理方法就可以了. 首先我们看一下一个正常的页面,直接拖放 ...
- Numeral.js – 格式化和操作数字的 JavaScript 库
Numeral.js 是一个用于格式化和操作数字的 JavaScript 库.数字可以格式化为货币,百分比,时间,甚至是小数,千位,和缩写格式,功能十分强大.支持包括中文在内的17种语言. 您可能感兴 ...
- 【软件编程】乐易贵宾VIP教程 - JS改写+网页操作系列教程
JS改写系列教程: 1.MD5加密改写教程(爱拍网登录)2.解密如何快速找到真确的js加密算法3.多重MD5加密改写教程(5173登录)4.DZ论坛登录加密改写5.唯品会手机登录加密改写6.新浪微博密 ...
- JS实现 键盘操作
JS实现 键盘操作: 详情可以去其逛网查看其API并下载,地址:http://craig.is/killing/mice <!DOCTYPE html PUBLIC "-//W3C// ...
随机推荐
- JAVAEE——BOS物流项目13:Quartz概述、创建定时任务、使用JavaMail发送邮件、HighCharts概述、实现区域分区分布图
1 学习计划 1.Quartz概述 n Quartz介绍和下载 n 入门案例 n Quartz执行流程 n cron表达式 2.在BOS项目中使用Quartz创建定时任务 3.在BOS项目中使用Jav ...
- 一些遇到的Qt程序在Windows平台间移植问题整理
今天尝试把Qt程序移植到各种虚拟机中测试,由于Qt的依赖库报告往往不能显示出全部依赖库.结果频频出现问题,好不容易全部解决了,这里给出一些套路. 首先对于Qt版本,我用过很多,最终表示现阶段推荐Min ...
- ASP.NET(C#) Repeater分页的实现
ASP.NET(C#) Repeater分页的实现 第一种方式: 数据库连接代码: using System; using System.Data; using System.Configuratio ...
- nginx常用配置系列-静态资源处理
接上篇,nginx处理静态资源的能力很强,后端服务器其实也可以处理静态资源,比如tomcat,但把非业务类的单一数据交给后端处理显然效率比较低,还有一种场景是多个站点公用一套资源集时,通过nginx可 ...
- 什么是web service ?
一.序言 大家或多或少都听过WebService(Web服务),有一段时间很多计算机期刊.书籍和网站都大肆的提及和宣传WebService技术,其中不乏很多吹嘘和做广告的成分.但是不得不承认的是Web ...
- java 保留字段volatile、transient、native、synchronized
1.volatile Java语言提供了一种稍弱的同步机制,即volatile变量,用来确保将变量的更新操作通知到其他线程.当把变量声明为volatile类型后,编译器与运行时都会注意到这个变量是共享 ...
- 阿里云被挖矿进程wnTKYg入侵的解决方法
杀wnTKYg病毒分两步,第一是找到它的来源,切断入口,第二步,找到它的守护进程并杀死,然后再去杀死病毒进程,有的守护进程很隐蔽,唤醒病毒之后,自动消亡,这时候top就看不到了,要留心. 最近项目在做 ...
- vi/vim的常用快捷键
vi/vim分为 命令模式,插入模式(编辑模式),末行模式(最后一行) 模式的转换 ① 其它模式==>正常模式 按 Esc键 ②正常模式==>插入模式 按 i 在光标前插入 按 I 在行首 ...
- 十八、Hadoop学记笔记————Hbase架构
Hbase结构图: Client,Zookeeper,Hmaster和HRegionServer相互交互协调,各个组件作用如下: 这几个组件在实际使用过程中操作如下所示: Region定位,先读取zo ...
- datePicker.js 应用
var calendar2 = new datePicker();calendar.init({ 'trigger': '#datetime-picker-start', /*选择器,触发弹出插件*/ ...