日历

  • 创建过去七天的数组，如果将代码中的减号换成加号，你将得到未来7天的数组集合
// 创建过去七天的数组

[...Array(7).keys()].map(days => new Date(Date.now() - 86400000 * days));

生成随机ID

  • 在原型设计时经常使用的创建ID功能。但是我在实际项目中看到有人使用它。其实这并不安全
// 生成长度为11的随机字母数字字符串

Math.random().toString(36).substring(2);

// hg7znok52x

获取url 查询参数

  • 这个获取URL的查询参数代码，是我见过最精简的QAQ
?foo=bar&baz=bing => {foo: bar, baz: bing}

// 获取URL的查询参数

let q = {};

location.search.replace(/([^?&=]+)=([^&]+)/g, (_, k, v) => q[k] = v);

console.log(q);

本地时间

  • 通过一堆HTML，您可以创建一个本地时间，其中包含您可以一口气读出的源代码，它每秒都会用当前时间更新页面
<body onload="setInterval(()=>document.body.innerHTML=new Date().toLocaleString().slice(10,19))"></body>

数组混淆

  • 随机更改数组元素顺序，混淆数组
// 随机更改数组元素顺序，混淆数组

(arr) => arr.slice().sort(() => Math.random() - 0.5)

/*

let a = (arr) => arr.slice().sort(() => Math.random() - 0.5)

let b = a([1,2,3,4,5])

console.log(b)

*/

数组去重

[...new Set(arr)]

创建特定大小的数组

[...Array(3).keys()]

// [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`

`)()

正则去空格

function myTrim(str) {

  let reg = /^\s+|\s+$/g;

  return str.replace(reg, "");

}

console.log(myTrim('    asdf    '));

javaScript 一些小技巧的更多相关文章

  1. 你想的到想不到的 javascript 应用小技巧方法

    javascript 在前端应用体验小技巧继续积累. 事件源对象 event.srcElement.tagName event.srcElement.type 捕获释放 event.srcElemen ...

  2. JavaScript 编码小技巧

    三元操作符 如果使用if...else语句,那么这是一个很好节省代码的方式. Longhand: const x = 20; let answer; if (x > 10) { answer = ...

  3. 19 个 JavaScript 编码小技巧

    这篇文章适合任何一位基于JavaScript开发的开发者.我写这篇文章主要涉及JavaScript中一些简写的代码,帮助大家更好理解一些JavaScript的基础.希望这些代码能从不同的角度帮助你更好 ...

  4. JavaScript 转换小技巧

    1.变量转换 看起来很简单,但据我所看到的,使用构造函数,像Array()或者Number()来进行变量转换是常用的做法.始终使用原始数据类型(有时也称为字面量)来转换变量,这种没有任何额外的影响的做 ...

  5. Javascript 编程小技巧总结（部分内容借鉴他人）

    1 – 使用===,而不是＝＝ ==(或!=)操作符在需要的时候会自动执行类型转换.===(或!==)操作不会执行任何转换.它将比较值和类型,而且在速度上也被认为优于==. 2 – 使用闭包实现私有变 ...

  6. JavaScript 调试小技巧

    'debugger;' 除了console.log,debugger就是另一个我很喜欢的快速调试的工具,将debugger加入代码之后,Chrome会自动在插入它的地方停止,很像C或者Java里面打断 ...

  7. 22条常用JavaScript开发小技巧

    1.使用var声明变量 如果给一个没有声明的变量赋值,默认会作为一个全局变量(即使在函数内赋值).要尽量避免不必要的全局变量. 2.行尾使用分号 虽然JavaScript允许省略行尾的分号,但是有时不 ...

  8. JavaScript调试小技巧

    1.‘debugger;’ 除了console.log,debugger就是另一个我很喜欢的快速调试的工具,将debugger加入代码之后,Chrome会自动在插入它的地方停止,很像C或者Java里面 ...

  9. JavaScript使用小技巧

    原文:45 Useful JavaScript Tips, Tricks and Best Practices作者:Saad Mousliki 在这篇文章里,我将分享一些JavaScript的技巧.秘 ...

  10. 实用的 JavaScript 调试小技巧

    ‘debugger;’ 除了console.log,debugger就是另一个我很喜欢的快速调试的工具,将debugger加入代码之后,Chrome会自动在插入它的地方停止,很像C或者Java里面打断 ...

随机推荐

  1. Spring-Data-Redis 入门学习

    Spring-Data-Redis 入门学习 参考文章: https://www.jianshu.com/p/4a9c2fec1079 导入 redis 相关依赖 <dependency> ...

  2. mysql之drop、truncate和delete的区别

    今天在整理mysql数据库笔记的时候突然想到一个问题,就是drop.truncate和delete的区别,乍一看三者都是有删除的功能,但是具体来看还是有很多区别的.我先把这三个的作用简单说一下,有前辈 ...

  3. face-api.js：一个在浏览器中进行人脸识别的 JavaScript 接口

    Mark! 本文将为大家介绍一个建立在「tensorflow.js」内核上的 javascript API——「face-api.js」,它实现了三种卷积神经网络架构,用于完成人脸检测.识别和特征点检 ...

  4. Ant Design的Form

    Ant Design的Form 使用onFieldsChange时不要与 mapPropsToFields一起使用,将导致表单校验等失效

  5. 付哇刷脸支付系统源码V1.03完整安装包.zip

    付哇刷脸支付系统源码是什么? 1.是一款专业的刷脸+聚合支付平台源码系统: 2.支持对接自己的支付宝和微信官方服务商: 3.基于目前流行的WEB2.0的架构(php+mysql),采用自研DOXCX框 ...

  6. Linux中一些命令的区别

    1. yum provides 和 yum search provides是在文件中查找软件,类似于rpm -qf: search是查找软件包或其描述的关键字. 2. gzip  和  bzip2 对 ...

  7. 请用js写一个函数，实现获取浏览器url中查询字符串中的参数并返回一个数组

    <script> console.log(getUrlArr()); function getUrlArr() { var arr = []; var url = "http:/ ...

  8. PATA1028 List Sorting

    Excel can sort records according to any column. Now you are supposed to imitate this function. Input ...

  9. Docker整合dockerfly实现UI界面管理(单机版)

    一.搜索镜像 docker search dockerfly 二.根据镜像使用排名(一般情况下拉取使用率最高的镜像名),我这里使用的是阿里云镜像地址 docker pull registry.cn-h ...

  10. jquery设置bootstrap-table的当前选中页码的获取与设置

    一.获取当前table分页的页码 有两种方式可以获得当前选中的页码: 1.通过table的onPageChange方法 $('#agentTable').bootstrapTable({ data: ...