一行代码实现这些复杂功能,JavaScript太强大了!
<p>JavaScript 以其灵活性和强大的表达能力而闻名,分享一些值得使用的 JavaScript 一行代码解决方案,这些代码简洁优雅却能实现复杂的功能。</p><h2>1. 数组操作神器</h2>
<h3>数组去重</h3>
<pre><code>const unique = arr => [...new Set(arr)];
// 示例
const numbers = ;
console.log(unique(numbers)); //
</code></pre>
<h3>数组扁平化</h3>
<pre><code>const flatten = arr => arr.flat(Infinity);
// 示例
const nested = , ]];
console.log(flatten(nested)); //
</code></pre>
<h3>快速生成数字序列</h3>
<pre><code>const range = (start, end) => [...Array(end - start + 1)].map((_, i) => start + i);
// 示例
console.log(range(1, 5)); //
</code></pre>
<h2>2. 字符串处理技巧</h2>
<h3>生成随机字符串</h3>
<pre><code>const randomString = length => Math.random().toString(36).substring(2, length + 2);
// 示例
console.log(randomString(10)); // "a1b2c3d4e5"
</code></pre>
<h3>字符串反转</h3>
<pre><code>const reverse = str => str.split('').reverse().join('');
// 示例
console.log(reverse('hello')); // "olleh"
</code></pre>
<h3>检查回文字符串</h3>
<pre><code>const isPalindrome = str => str === str.split('').reverse().join('');
// 示例
console.log(isPalindrome('radar')); // true
console.log(isPalindrome('hello')); // false
</code></pre>
<h2>3. 对象处理大师</h2>
<h3>深度克隆对象</h3>
<pre><code>const deepClone = obj => JSON.parse(JSON.stringify(obj));
// 示例
const original = { a: 1, b: { c: 2 } };
const clone = deepClone(original);
</code></pre>
<h3>合并多个对象</h3>
<p><img src="https://www.3bbs.cn/index-diy/img.php?url=https://mmbiz.qpic.cn/sz_mmbiz_png/btsCOHx9LAMsoANmu9Ob0Oqdjm8AYe0ibibSIEd81MY8T6ibHmR26eeDSA8JW7Yw4pT3DJXoKiaic78WtMeZb6t02Vw/640?wx_fmt=png&from=appmsg&tp=webp&wxfrom=5&wx_lazy=1&wx_co=1" alt="图片" /></p>
<h3>提取对象字段</h3>
<p><img src="https://www.3bbs.cn/index-diy/img.php?url=https://mmbiz.qpic.cn/sz_mmbiz_png/btsCOHx9LAMsoANmu9Ob0Oqdjm8AYe0ibsoiakDaz8ic7AuQu6tDVzqibWTcm8GDpdkjRcCdrws0X5UK6FqteAfapA/640?wx_fmt=png&from=appmsg&tp=webp&wxfrom=5&wx_lazy=1&wx_co=1" alt="图片" /></p>
<h2>4. 函数式编程技巧</h2>
<h3>函数组合</h3>
<p><img src="https://www.3bbs.cn/index-diy/img.php?url=https://mmbiz.qpic.cn/sz_mmbiz_png/btsCOHx9LAMsoANmu9Ob0Oqdjm8AYe0ibsHooCpfhCXHLeErE66jTHBl9QaFXokNSlY7qeYLketBRr7icGQRGArA/640?wx_fmt=png&from=appmsg&tp=webp&wxfrom=5&wx_lazy=1&wx_co=1" alt="图片" /></p>
<h3>函数柯里化</h3>
<p><img src="https://www.3bbs.cn/index-diy/img.php?url=https://mmbiz.qpic.cn/sz_mmbiz_png/btsCOHx9LAMsoANmu9Ob0Oqdjm8AYe0ibU90K3SwMoYxsNQHwSZ0vB7zQJEBQdmSZiaG5HzIYicEVXfCxupBFwKuQ/640?wx_fmt=png&from=appmsg&tp=webp&wxfrom=5&wx_lazy=1&wx_co=1" alt="图片" /></p>
<h2>5. 日期时间处理</h2>
<h3>格式化日期</h3>
<p><img src="https://www.3bbs.cn/index-diy/img.php?url=https://mmbiz.qpic.cn/sz_mmbiz_png/btsCOHx9LAMsoANmu9Ob0Oqdjm8AYe0ib6CkLCiaiakSicjRcva3jRzD7rawibicjGDbGdoX7f6REYByuhkFKLSVjFEA/640?wx_fmt=png&from=appmsg&tp=webp&wxfrom=5&wx_lazy=1&wx_co=1" alt="图片" /></p>
<h3>计算时间差</h3>
<p><img src="https://www.3bbs.cn/index-diy/img.php?url=https://mmbiz.qpic.cn/sz_mmbiz_png/btsCOHx9LAMsoANmu9Ob0Oqdjm8AYe0ibJJRStAa6xy6yibckq9CmEGXWzz8ucvkGEUgl1qHbLoklfp8gMAEoLKg/640?wx_fmt=png&from=appmsg&tp=webp&wxfrom=5&wx_lazy=1&wx_co=1" alt="图片" /></p>
<h2>6. DOM 操作技巧</h2>
<h3>获取所有表单数据</h3>
<p><img src="https://www.3bbs.cn/index-diy/img.php?url=https://mmbiz.qpic.cn/sz_mmbiz_png/btsCOHx9LAMsoANmu9Ob0Oqdjm8AYe0ib8MBcpd3ABHBl939Z6AVwmLCmqWNJHf6J3icev29SbCUBY281lZMniaHQ/640?wx_fmt=png&from=appmsg&tp=webp&wxfrom=5&wx_lazy=1&wx_co=1" alt="图片" /></p>
<h3>平滑滚动到顶部</h3>
<p><img src="https://www.3bbs.cn/index-diy/img.php?url=https://mmbiz.qpic.cn/sz_mmbiz_png/btsCOHx9LAMsoANmu9Ob0Oqdjm8AYe0ib2GKMico81UxPIR2icDIeR0R0FmpUGFG4b67IibHHR49h0KONGd6ia1XMMQ/640?wx_fmt=png&from=appmsg&tp=webp&wxfrom=5&wx_lazy=1&wx_co=1" alt="图片" /></p>
<h2>7. 实用工具函数</h2>
<h3>防抖函数</h3>
<p><img src="https://www.3bbs.cn/index-diy/img.php?url=https://mmbiz.qpic.cn/sz_mmbiz_png/btsCOHx9LAMsoANmu9Ob0Oqdjm8AYe0ibM6O44MOlJYj3RpC2qKVgNcEaDzVlm7DnszHGeHLv5TtB9QFgG2ibD2g/640?wx_fmt=png&from=appmsg&tp=webp&wxfrom=5&wx_lazy=1&wx_co=1" alt="图片" /></p>
<h3>节流函数</h3>
<pre><code>const throttle = (fn, delay) => {
let last = 0;
return (...args) => {
const now = Date.now();
if (now - last >= delay) {
fn(...args);
last = now;
}
};
};
// 示例
const throttledScroll = throttle(handleScroll, 100);
</code></pre>
页:
[1]