发现了一些有用的 Javascript 单行代码，能快速处理一些问题

原创已于 2022-08-09 15:55:46 修改 · 235 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #前端

于 2022-07-30 10:05:04 首次发布

javascript 专栏收录该内容

44 篇文章

订阅专栏

本文分享了一些实用的JavaScript单行代码，包括获取选中文本、页面滚动、数据传输量检测、URL重定向、清除cookies、字符串操作、生成随机颜色、字符串大写转换、复制到剪贴板以及删除数组重复值等常见任务的处理方法。这些技巧可以帮助开发者提高工作效率。

⭐️ 本文首发自前端修罗场(点击加入)，是一个由资深开发者独立运行的专业技术社区，我专注 Web 技术、Web3、区块链、答疑解惑、面试辅导以及职业发展。现在加入，私聊我即可获取一次免费的模拟面试机会，帮你评估知识点的掌握程度，获得更全面的学习指导意见，交个朋友，少走弯路，少吃亏！

在本文中，我将介绍一些有用的 JavaScript 单行代码，它们可以用于快速处理一些事情。

获取用户在网页上选择或突出显示的文本：

const getSelectedText = () => window.getSelection().toString();
console.log(getSelectedText);

scrollTo(x,y)，允许你滚动到一组特定的坐标:

const scrollToTop = () => window.scrollTo(0,0);

如果你想要一个平滑的滚动动画，只需执行以下操作：

const Top = () => window.scrollTo({top:0, behavior: 'smooth'});

获取指定时间段内通过互联网连接传输的数据量：

navigator.connection.downlink;

将用户重定向到指定位置，可以执行以下操作：

const urlRedirect = url => location.href = url;
urlRedirect('https://xxx.xxx/');

清除所有 cookies

const clearCookies = document.cookie.split(';').forEach((cookie) => (document.cookie = cookie.replace(/^ +/, '').replace(/=.*/, `=;expires=${new Date(0).toUTCString()};path=/`)));

反转字符串

可以使用 ·split、join 和 reverse· 方法反转字符串。

const strReverse = str => [...str].reverse().join('');
strReverse('abc'); // cba

生成随机十六进制：使用 Math.random() 和 padEnd() 生成随机十六进制代码

const hexClr = () => '#' + Math.floor(Math.random() * 0xffffff).toString(16).padEnd(6, '0');
console.log(hexClr());

将一个字符串大写：Javascript 没有内置的 capitalize 函数，所以我们可以使用以下代码进行处理：

let str = 'follow me for amazing posts';
let capStr = str.replace(/\w\S*/g, (w) => (w.replace(/^\w/, (c) => c.toUpperCase())));
console.log(capStr);

复制到剪贴板：使用 navigator.clipboard.writeText 轻松将任何文本复制到剪贴板。

const copy = (text) => navigator.clipboard.writeText(text);
copy('前端修罗场');

删除重复值:

const uniqueValues= (arr) => [...new Set(arr)];