常用的JS代码片段有哪些

简介: 常用的JS代码片段有哪些

工具
生成 UUID
const UUIDGeneratorBrowser = () =>
([1e7] + -1e3 + -4e3 + -8e3 + -1e11).replace(/[018]/g, (c) =>
(
c ^
(crypto.getRandomValues(new Uint8Array(1))[0] & (15 >> (c / 4)))
).toString(16)
);

// Examples
//代码效果参考:http://www.cmjzs.com/sitemap/post1.html
UUIDGeneratorBrowser(); // '7982fcfe-5721-4632-bede-6000885be57d'
解析 cookie
const parseCookie = (str) =>
str
.split(";")
.map((v) => v.split("="))
.reduce((acc, v) => {
acc[decodeURIComponent(v[0].trim())] = decodeURIComponent(v[1].trim());
return acc;
}, {});
parseCookie("foo=bar; equation=E%3Dmc%5E2");
// { foo: 'bar', equation: 'E=mc^2' }
获取网址参数
const getURLParameters = (url) =>
(url.match(/([^?=&]+)(=([^&]))/g) || []).reduce(
(a, v) => (
(a[v.slice(0, v.indexOf("="))] = v.slice(v.indexOf("=") + 1)), a
),
{}
getURLParameters("google.com"); // {}
getURLParameters("http://www.cmjzs.com/sitemap/post1.html");
// {name: 'Adam', surname: 'Smith'}
复制到剪切板
以下方式仅在用户执行操作时有效,如:click 事件
const copyToClipboard = (str) => {
const el = document.createElement("textarea");
el.value = str;
el.setAttribute("readonly", "");
el.style.position = "absolute";
el.style.left = "-9999px";
document.body.appendChild(el);
const selected =
document.getSelection().rangeCount > 0
? document.getSelection().getRangeAt(0)
: false;
el.select();
document.execCommand("copy");
document.body.removeChild(el);
if (selected) {
document.getSelection().removeAllRanges();
document.getSelection().addRange(selected);
}
};
copyToClipboard("Lorem ipsum"); // 'Lorem ipsum' copied to clipboard.
简版 jquery 选择器
// 仅选中第一个元素
const $ = document.querySelector.bind(document);
// 选中所有
const $$ = document.querySelectorAll.bind(document); const mainContent = $(".main-content"); const externalLinks = $$('a[target="_blank"]');
多线程执行函数
const runAsync = (fn) => {
const worker = new Worker(
URL.createObjectURL(new Blob([postMessage((${fn})());]), {
type: "application/javascript; charset=utf-8",
})
return new Promise((res, rej) => {
worker.onmessage = ({ data }) => {
res(data), worker.terminate();
};
worker.onerror = (err) => {
rej(err), worker.terminate();
});
const longRunningFunction = () => {
let result = 0;
for (let i = 0; i < 1000; i++)
for (let j = 0; j < 700; j++)
for (let k = 0; k < 300; k++) result = result + i + j + k;
return result;
/

NOTE: Since the function is running in a different context, closures are not supported.
The function supplied to runAsync gets stringified, so everything becomes literal.
All variables and functions must be defined inside.
/
runAsync(longRunningFunction).then(console.log); // 209685000000
runAsync(() => 10 *
3).then(console.log); // 1000
let outsideVariable = 50;
runAsync(() => typeof outsideVariable).then(console.log); // 'undefined'

相关文章
|
6月前
|
JavaScript 前端开发
【快捷键配置】常用HTML类名、CSS样式名称、JS方法变量名、vue代码片段
【快捷键配置】常用HTML类名、CSS样式名称、JS方法变量名、vue代码片段
|
6月前
|
前端开发 JavaScript
【汇总】前端开发中高频次使用的JS、CSS、HTML代码片段合集
【汇总】前端开发中高频次使用的JS、CSS、HTML代码片段合集
|
6月前
|
JavaScript 前端开发 程序员
分享18个用于处理 null、NaN 和undefined 的 JS 代码片段
Null、NaN 和 undefined 是程序员在使用 JavaScript 时遇到的常见值。 有效处理这些值对于确保代码的稳定性和可靠性至关重要。
|
3月前
|
JavaScript Java 虚拟化
JS代码片段
本文档详细规定了Java编程中的排版、命名及注释规范。排版方面,强调变量初始化时对齐赋值符号,操作符与关键词或变量间加空格,独立代码块间加空行,长语句换行书写,并将`main`方法置于类底部。命名规范包括全小写包名、驼峰命名法的类与变量名,以及大写的静态最终变量名。注释部分提倡使用Eclipse自动生成模板,并及时补充描述。文档还提供了多个格式示例,以JDK源码和Hyperic HQ为参考,展示了不同语句的具体应用。
21 2
|
5月前
|
SQL Web App开发 JavaScript
业务功能常用的JS代码片段
业务功能常用的JS代码片段
29 3
|
5月前
|
缓存 JavaScript 前端开发
js开发代码片段与小技巧
js开发代码片段与小技巧
30 2
|
5月前
|
JavaScript 前端开发 Java
JS代码片段赏析 经典又常用的代码分享
JS代码片段赏析 经典又常用的代码分享
30 2
|
6月前
|
前端开发 JavaScript 开发者
前端面试题 10 个「有用」JavaScript 代码片段
前端面试题 10 个「有用」JavaScript 代码片段
|
JavaScript 前端开发
码上掘金,5 个 NICE 的 JavaScript 代码片段分享
码上掘金,5 个 NICE 的 JavaScript 代码片段分享
|
JavaScript 前端开发
10 个「有用」JavaScript 代码片段
10 个「有用」JavaScript 代码片段