#
20行代码封装复制到剪贴板函数:copyToClipboard

一直非常不喜欢类似clipboardjs的使用方式(至于依赖flash的ZeroClipboard.js那就更不推荐了),和DOM耦合太重,使用起来非常不方便: <button class="btn" data-clipboard-text="Just because you can doesn't mean you should — clipboard.js"> Copy t... 阅读全文

@2024-02-29 JavaScript 浏览(93)
#
esModule内联代码的导入导出实现

背景浏览器层面的esModule在设计的时候不太完美,只能import外部JS,如果某个<script type="module">是通过内联代码直接写在HTML里面的反而没法导入: <script type="module">export default 123;</script><script type="module">// 无法导入上面的模... 阅读全文

@2024-01-23 JavaScript 浏览(168)
#
JavaScript的toFixed()方法的坑总结

网上几乎所有文章都是错的网上有2类文章: 一类是toFixed科普文章,像W3CSchool直接说toFixed是按照四舍五入,这属于完全错误的,甚至MDN都完全没有提到如何舍入;还有一类是介绍toFixed的坑的文章,这类文章一般都有部分错误,网上绝大部分文章都指出,toFixed是按照银行家舍入法来执行的,实际测试并非如此。 所谓银行家舍入法:四舍六入五看情况,五后非零直接入,五后为零... 阅读全文

@2021-07-02 JavaScript 浏览(1142)
#
2行代码生成包含大小写字母和数字的随机字符串

2行代码生成指定长度字符串/** * 生成长度为len的包含a-z、A-Z、0-9的随机字符串 */function generateStr(len = 18) { // 一行代码生成0-9、A-Z、a-z、总长度为62的字符数组 var arr = [...new Array(62)].map((item, i) => String.fromCharCode(i + (i ... 阅读全文

@2020-05-11 JavaScript 浏览(4126)
#
如何一行代码生成内容为0到N的数组

本以为下面这行代码就可以实现: (new Array(5)).map((item, idx) => idx) 但是: 至于为什么会是这样,我没有仔细追究,如果有知道的朋友欢迎指出。 正确方法: // 第一种方法Array.apply(null, {length: 10}).map((item, idx) => idx)// 第二种方法[...new Array(10)].... 阅读全文

@2020-04-30 JavaScript 浏览(3417)
#
没引用的变量不能乱删!

正文源自组内一个文件上传组件,从某个版本开始,同学A觉得代码里面有太多没被引用的变量就把它全删了,但是他没发布,后来同学B基于这个代码发布了一个新包,结果,bug出现了。 原始代码: function render() { const {className, onChange, ...others} = this.props; return <Uploader classNa... 阅读全文

@2020-03-26 JavaScript 浏览(2901)
#
JavaScript关闭当前页

如题出于安全考虑,普通页面直接执行window.close()时不会生效,控制台会出现如下警告: Scripts may not close windows that were not opened by script. 只有那些通过<a target="_blank">链接</a>或者window.open()打开的页面才支持关闭,为什么这么规定呢?我猜大概可能是觉得... 阅读全文

@2020-02-21 JavaScript 浏览(9755)
#
已适配视网膜屏的通用水印实现方案

如题默认情况下,canvas在视网膜屏幕下写出的字体会有模糊问题,本方法已适配,完整代码如下: /** * 生产水印,并返回水印URL地址,已适配视网膜屏幕下字体模糊问题 * @param {*} text 水印文字 * @param {*} el 要设置水印的目标元素,默认 document.body * @param {*} config 配置项 * @returns {String} 水印... 阅读全文

@2019-03-06 JavaScript 浏览(3228)
#
如何使用JavaScript实现纯前端读取和导出excel文件

js-xlsx 介绍由SheetJS出品的js-xlsx是一款非常方便的只需要纯JS即可读取和导出excel的工具库,功能强大,支持格式众多,支持xls、xlsx、ods(一种OpenOffice专有表格文件格式)等十几种格式。本文全部都是以xlsx格式为例。 官方github:https://github.com/SheetJS/js-xlsx本文配套demo在线演示地址:http://dem... 阅读全文

@2018-07-03 JavaScript 浏览(61018)
#
几种排序算法的JavaScript实现

概述常见排序算法: 傻瓜排序这个傻瓜排序是我自己给起的名字,就是按照人的常规思维进行排序,不考虑任何时间复杂度和空间复杂度。话说如果给你一个数组让你手工排序,你的思路会是什么样的呢?我想你肯定是这样的: 整体用肉眼扫描一遍,找到最小的,插入结果里面,然后再扫描剩下的数字,找到最小的,再次插入结果里面,直至原始数组变空,是的,没错,这里说的傻瓜排序就是这个思路。 /** * 傻瓜排... 阅读全文

@2018-06-13 JavaScript 浏览(2781)
#
script标签的defer和async的区别

正文网上很多写法都有点问题或者难以理解,下面这一张图说明所有问题: 补充说明: defer 和 async 在下载这块儿是一样的,相较于HTML解析都是异步的;它俩的差别在于脚本下载完之后何时执行,async什么时候下载完什么时候执行,并且会中断HTML解析,defer则在HTML解析完成之后,DOMContentLoaded 事件触发之前执行。async只能用于对其它JS没有任何依赖... 阅读全文

@2018-05-09 JavaScript 浏览(1765)
#
WebWorker简单复习

本文demo:http://demo.haoji.me/2018/04/28-webworker/ JS是单线程语言由于JS设计的初衷就是用来进行一些简单的用户交互以及DOM操作,为了避免复杂性,从一开始JS就被设计成一门单线程语言,现在如是,以后也不会变。 然后正是由于单线程的缘故,当我们需要在前端运行一些大运算量的代码时,浏览器肯定会陷入卡顿。为了解决前端大运算量问题,HTML5引入了We... 阅读全文

@2018-04-28 JavaScript 浏览(3399)
#
Chrome浏览器控制台的一个不知道能不能算bug的bug

正文直接上代码: var obj = {a:1, b:2};console.log(obj);obj.b = 3;console.log(obj) 效果如下: 收起时显示的还是旧的值,展开时才是新的,最近就因为这个问题坑了我半天,后来才发现代码没问题,是Chrome控制台显示问题。水文一篇,记录下来! ... 阅读全文

@2018-01-17 JavaScript 浏览(3110)
#
JavaScript数字精度问题总结

常见错误console.log(0.1+0.2); // 输出 0.30000000000000004console.log(0.3-0.1); // 输出:0.19999999999999998console.log(0.07*100); // 输出 7.000000000000001console.log(0.07/0.01); // 输出 7.000000000000001 相关文章: ... 阅读全文

@2018-01-05 JavaScript 浏览(3177)
#
编辑页面离开时弹出提示

正文N年前就知道,只是没记录过,所以今天写下来。主要是借助window.onbeforeunload来实现: JS写法: window.onbeforeunload = function(){ return '修改尚未保存,确定放弃吗?';};//或者这样写:window.onbeforeunload = function(event){ event.returnValue = '... 阅读全文

@2017-08-22 JavaScript 浏览(7419)
第1页,共4页