- 博客(1202)
- 收藏
- 关注
RSS订阅转载 分享一些 JS 代码整洁相关的技巧，让你的项目更出众
前言为什么代码要整洁？代码质量与整洁度成正比。有的团队在赶工期的时候，不注重代码的整洁，代码写的越来越糟糕，项目越来越混乱，生产力也跟着下降，那就必须找更多人来提高生产力，开发成本越来越高。整洁的代码是怎样的？清晰表达意图、消除重复、简单抽象、能通过测试。 换句话说：具有可读性、可重用性和可重构性。命名名副其实：不使用缩写、不使用让人误解的名称，不要让人推测。//bad:啥？constyyy...
2023-06-02 10:20:05
4
转载 Vue3.3发布了，有啥新特性？简单的了解下
前言虽然3.3当前还处于beta阶段但是其带来的一些特性十分激动人心，就在这里简单的给大家带来新特性的前瞻，为以后的升级做做准备????泛型组件支持Vue一直以来[1]都是没办法很好的实现泛型组件，终于在3.3版本增加了这一功能首先是面向TSX用户为defineComponent工具函数增加了泛型支持，当参数传入一个泛型函数时类型会提示正常，比如我们可以基于这个特性使用tsx简单构造一个表格组件imp...
2023-06-01 08:00:05
14
转载 分享30个你必须知道的JS基础知识
今天这篇文章整理了30个你必须知道的关于JavaScript的常识点，无论你是面试还是日常开发，都会给你很大的帮助。1. ‘&&’运算符能做什么？&& 运算符，也称为逻辑与，计算操作数并返回它遇到的第一个假表达式。 如果没有找到错误的表达式，它会返回最后一个真实的表达式。 它采用短路来防止不必要的工作。console.log(false && 1 &...
2023-06-01 08:00:05
10
转载 如何设计一个支持并发的前端缓存接口？
缓存池缓存池不过就是一个map，存储接口数据的地方，将接口的路径和参数拼到一块作为key，数据作为value存起来罢了，这个咱谁都会。constcacheMap=newMap();封装一下调用接口的方法，调用时先走咱们缓存数据。importaxios,{AxiosRequestConfig}from'axios'//先来一个简简单单的发送exportfunctionsen...
2023-05-26 08:01:44
21
转载 分享一个 vue3+three.js 可视化大屏案例
前言Three.js是一款基于原生WebGL封装通用Web 3D引擎，在小游戏、产品展示、物联网、数字孪生、智慧城市园区、机械、建筑、全景看房、GIS等各个领域基本上都有three.js的身影。本文需要对 threejs 的一些基本概念和 api 有一定了解。如果对 threejs 这部分还不了解的可以看下官方文档和一些中文文档进行学习。官方文档地址：threejs.org/中文文档地址：www....
2023-05-26 08:01:44
48
转载 分享 7 个糟糕的 JavaScript 代码实践，看看你是不是也这样？
英文 |https://javascript.plainenglish.io/say-goodbye-to-7-bad-javascript-practices-1de41ca57f0a在我这几年的工作生涯中，我写过很多烂代码，对此我深有体会。我的同事们一直认为我的代码是臭代码，但我认为他们不欣赏我的艺术，所以，今天我把自己之前踩过的坑，总结了一下，也希望可以帮助你避免这些糟糕的操作。1.代码尽...
2023-05-24 08:02:33
17
原创 详解Node.js开发中不可或缺的7个库
在Node.js开发中，选择合适的库对于提高开发效率和优化应用程序性能至关重要。本文将介绍七个备受关注的Node.js库，它们在各自的领域中展现了出色的功能和性能。这些库分别是：Config、Fetch、Ioredis、Multer、Cache、Fast-xml-parser和Cron。我们将深入了解它们的特点、用法和优势，帮助你更好地利用它们来开发出高质量的Node.js应用程序。1、 Conf...
2023-05-24 08:02:33
582
转载 简单的聊一聊 async/await 到底要不要加 try catch？
写异步函数的时候，promise 和 async 两种方案都非常常见，甚至同一个项目里，不同的开发人员都使用不同的习惯, 不过关于两者的比较不是本文关注的重点，只总结为一句话：“async 是异步编程的终极解决方案”。当使用 async 函数的时候，很多文章都说建议用try catch来捕获异常, 可是实际上我看了很多项目的代码，遵循的并不是严谨，很多都没有用，甚至 catch 函数都没写，这...
2023-05-22 08:02:20
18
转载 分享 21 个简单实用的 JS 代码技巧
1.滚动到页面顶部我们可以使用 window.scrollTo() 平滑滚动到页面顶部。const scrollToTop = () => { window.scrollTo({ top: 0, left: 0, behavior: "smooth" });};2.滚动到页面底部当然，如果知道文档的高度，也可以平滑滚动到页面底部。const scrollToBottom = () =&...
2023-05-22 08:02:20
22
转载 今年这情况。。。多一个选择吧
本文推荐最近在考虑新机会的小伙伴阅读！前言上周和部门BP聊天，她说最近在boss上放出一个初级前端岗位，平均每天都能收到500多份简历。前端市场越来越卷，跳槽前做好技术进阶突击，才能稳拿offer。这里有一份我爆肝两个月整理出的《2023前端开发进阶秘籍》，内含最新版本的八股文、高频算法题和大佬面经，全是今年的新知识点。全部整理成了高清pdf版，共计 266 页，大家可以扫码领取。资料内容展示三个...
2023-05-17 10:20:40
42
2
转载 到底该不该用 forEach 这个函数呢？
前言老实说我不喜欢用forEach，因为它导致的一些bug总是这么不经意，盘点我不喜欢的原因原因一：不支持处理异步函数先看一个例子：asyncfunctiontest(){letarr=[3,2,1]arr.forEach(asyncitem=>{constres=awaitmockSync(item)co...
2023-05-17 10:20:40
30
转载 分享 10 种常见的 JavaScript 设计模式
英文 | https://blog.bitsrc.io/10-javascript-design-patterns-3087d1dda5b4介绍设计模式是针对常见软件问题的高级面向对象解决方案。模式是关于对象的可重用设计和交互。在讨论复杂的设计解决方案时，每个模式都有一个名称并成为词汇表的一部分。在本教程中，我为每个 GoF 模式提供了 JavaScript 示例。大多数情况下，它们遵循原始图案设...
2023-05-16 08:00:15
20
原创 只需6步，就能让你的 React +Tailwind.css站点实现暗黑功能
欢迎回来，开始一次新的编码之旅吧！今天，我们将进入神秘的世界，探索如何在你的React.js网站中使用Tailwind.css实现暗黑模式。Tailwind.css 是你编码工具中的强大助手，结合React.js使用，你可以创造出令人惊叹的效果。本教程非常适合那些想要扩展技能并为他们的网站添加一项备受追捧的新功能的人。准备好尝试暗黑模式了吗？让我们开始吧！第一步：设置你的项目在我们开始之前，请确保...
2023-05-16 08:00:15
190
转载 分享 10 个超级实用的 reduce 使用技巧
reduce 函数可以根据需要进行累加、过滤、分组、映射等操作，是一个非常强大的数组方法。在数据处理时使用的非常频繁，很多复杂的逻辑如果用reduce去处理，都非常的简洁，在实际的开发工作过程中，积累了一些常见又超级好用的 reduce 技巧的代码片段，筛选了如下 10 个，以供大家参考reduce 介绍reduce 是数组的方法，可以对数组中的每个元素依次执行一个回调函数，从左到右依次累积计算出...
2023-05-13 09:00:30
21
原创 超实用！50+个ChatGPT提示词助你成为高效Web开发者（上）
如果你已经感到编写代码的重复和繁琐让你疲惫不堪，想要提高自己的效率，那么你来对地方了。ChatGPT是一款能够帮助你优化工作流程、减少错误并获得提高代码的见解的强大工具。在这篇博客文章中，我们将向你提供超过50个提示和策略，以帮助你通过使用ChatGPT来加速你的Web开发工作流程。从初学者学习概念到准备面试，你将找到一切你需要的东西，使得AI成为你作为Web开发人员的不二之选。然而，在探索这个令...
2023-05-13 09:00:30
884
转载 在Vue3中，除了用keep-alive，还有哪些页面缓存的实现方案
引言有这么一个需求：列表页进入详情页后，切换回列表页，需要对列表页进行缓存，如果从首页进入列表页，就要重新加载列表页。对于这个需求，我的第一个想法就是使用keep-alive来缓存列表页，列表和详情页切换时，列表页会被缓存；从首页进入列表页时，就重置列表页数据并重新获取新数据来达到列表页重新加载的效果。但是，这个方案有个很不好的地方就是：如果列表页足够复杂，有下拉刷新、下拉加载、有弹窗、有轮播等，...
2023-05-11 08:01:05
48
转载 分享 20 个 JS 工具函数，提升开发效率
前言日常开发中，面对各种不同的需求，我们经常会用到以前开发过的一些工具函数，把这些工具函数收集起来，将大大提高我们的开发效率。1、校验数据类型exportconsttypeOf=function(obj){returnObject.prototype.toString.call(obj).slice(8,-1).toLowerCase()}复制代码示例：typeOf('树哥...
2023-05-11 08:01:05
24
转载 分享 15 个关于 REST API 设计的基本技巧
英文 | https://medium.com/@liams_o/15-fundamental-tips-on-rest-api-design-9a05bcd42920翻译 | 杨小爱REST API 是最常见的 Web 服务类型之一，但它们也很难设计。它们允许各种客户端（包括浏览器、桌面应用程序、移动应用程序以及基本上任何具有互联网连接的设备）与服务器进行通信。因此，正确设计 REST API ...
2023-04-27 07:31:13
30
原创 开发者如何成为更好的自己，耐心和观察是关键
个人成长需要有耐心和观察力，这是一个“等待并观察”的视角。个人成长是一个自我提升的过程，需要结合耐心和观察力。这个过程可能会面临挑战，需要花费很多时间和精力，但最终的结果是值得的。耐心和观察是个人成长过程中的两个重要元素。在本文中，我们将讨论耐心和观察在个人成长中的重要性。什么是耐心？耐心是指能够在等待过程中保持冷静，不焦虑、不沮丧的能力。耐心是一种美德，在个人成长过程中非常重要。个人成长的过程可...
2023-04-27 07:31:13
366
原创 使用Tailwind CSS创建自定义动画，进阶您的前端开发技能
从零开始，探索如何使用 TailwindCSS 自定义动画Tailwind CSS是一种颠覆性的CSS框架，改变了开发者处理前端开发的方式。它的低级性和移动优先的方法使得它成为设计独特、响应式和可扩展的网页设计的热门选择。此外，它还具有强大的动画支持，使开发者能够构建引人入胜的用户体验，吸引访问者。本文将详细介绍如何使用TailwindCSS进行动画设计。我们将逐步介绍框架提供的不同种类的动画，并...
2023-04-26 10:10:44
464
转载 Web前端已成气候！
来自上岸投稿：“二本社招，逆袭腾讯AlloyTeam，总包50W”经历了6轮面试，太炸裂了！前端面试三个重要部分：简历与项目、前端基础、算法和手写代码。一般情况下，只要三部分中的其中两个很好的话，基本就能通过面试。下面给大家分享下这位腾讯大佬整理的“前端面试题库”，里面参考了很多GitHub上的优质博文和项目，还汇总了近两年大厂高频考题，共有500页，题库涵盖知识点如下：不少朋友靠着这些内容进行...
2023-04-26 10:10:44
43
原创 智能AI文档管理新方式，手把手教你打造自己的文档聊天机器人
一个快速指南，为您构建一个聊天机器人网站，可以接受外部文档作为上下文。随着每天涌现的信息和知识在我的屏幕上呈现，我们面临着人类阅读和记忆自然限制的挑战，这使得跟上信息更新变得越来越困难。现在，像ChatGPT和Llama这样的大型语言模型（LLMs）提供了一种存储和处理大量信息的潜在解决方案，只需要简单的提示就可以快速直接地获得响应。然而，LLMs的表现取决于它们所训练的数据质量，尽管它们的大部分...
2023-04-25 08:00:07
506
转载 分享12段个关于字节前端写的代码片段，到底有什么不同？
cpu：你和他们到底差在哪里？如何使用交互式的命令行工具下载项目模板这部分代码实现了一个用户交互的 GitHub 模板下载工具。首先你需要在github上创建一个项目，然后使用下面介绍的代码就可以用命令行拉取到本地，并解压了。它使用enquirer库提示用户输入仓库的创建者、名称、分支、和目标目录，然后使用downloadTemplate函数下载模板，最后使用fs-extra库存储下载...
2023-04-25 08:00:07
29
转载 分享关于 Vue 响应式原理的 10 个细节！
在讲解之前，我们先了解一下数据响应式是什么？所谓数据响应式就是建立响应式数据与依赖（调用了响应式数据的操作）之间的关系，当响应式数据发生变化时，可以通知那些使用了这些响应式数据的依赖操作进行相关更新操作，可以是DOM更新，也可以是执行一些回调函数。从Vue2到Vue3都使用了响应式，那么它们之间有什么区别？Vue2响应式：基于Object.defineProperty()实现的。Vue3响应式：基...
2023-04-21 08:00:08
24
转载 分享24个强大的HTML属性，建议每位前端工程师都应该掌握！
HTML属性非常多，除了一些基础属性外，还有许多有用的特别强大的属性本文将介绍24个强大的HTML属性，可以使您的网站更具有动态性和交互性，让用户感到更加舒适和愉悦。让我们一起来探索这24个强大的HTML属性吧！1、AcceptAccept属性用于指定浏览器可以处理的MIME类型列表。提示：MIME类型是用于识别文档类型的标准，例如，text/html表示HTML文档，image/jpeg表示JP...
2023-04-21 08:00:08
31
转载 分享 6 个关于ES13 中非常实用的新特性
英文 | https://javascript.plainenglish.io/6-amazing-and-useful-new-javascript-features-in-es13-b0719dfa05411.at当我们想要获取数组的第 N 个元素时，我们通常使用 [] 来获取。const array = [ 'fatfish', 'medium', 'blog', 'fat', 'fish...
2023-04-20 08:04:55
52
原创 分享10个值得推荐的技巧，提升JavaScript 的性能
JavaScript 在网页开发中非常重要，它控制了大部分网页上的活动和动画效果。但是，如果代码编写不当，JavaScript 可能会导致网站速度变慢。代码的不足可能导致网页加载缓慢，渲染速度也会变慢。按照以下策略来提高您网站的速度和性能：理解变量的作用域异步加载JavaScript避免不必要的循环最小化JavaScript代码使用Gzip压缩大文件减少DOM操作延迟不必要的JavaScript加...
2023-04-20 08:04:55
295
原创 超越ChatGPT：AgentGPT正在将自主AI带到浏览器中
你好，欢迎来到人工智能领域的新时代！今天我们介绍AgentGPT，这是一款最前沿的基于浏览器的平台，旨在革新人工智能的自主性。这项开创性的技术让你能够在舒适的网络浏览器中创建、配置和部署定制化的人工智能代理，以实现任何想象得到的目标。随着世界变得越来越互联，对先进的人工智能解决方案的需求前所未有地高涨。AgentGPT团队一直在推动人工智能自主性领域的可能性边界。这款强大的工具让你可以轻松设计符合...
2023-04-18 08:00:04
2156
转载 聊一聊vue中动态引入图片为什么是 require
相信用过vue的小伙伴，肯定被面试官问过这样一个问题：在vue中动态的引入图片为什么要使用require？有些小伙伴，可能会轻蔑一笑：呵，就这，因为动态添加src被当做静态资源处理了，没有进行编译，所以要加上require，我倒着都能背出来......emmm... 乍一看好像说的很有道理啊，但是仔细一看，这句话说的到底是个啥？针对上面的回答，我不禁有如下几个疑问：什么是静态资源？为什么动态...
2023-04-18 08:00:04
87
原创 2023年超实用的27个VSCode插件推荐
Visual Studio Code，或者称作VS Code，是一个广为人知且评价很高的代码编辑器，它有许多特性和扩展功能，以增强开发体验。使用VS Code的主要好处之一是它的灵活性，允许开发人员根据自己的特定需求进行自定义。此外，VS Code还非常轻便快速，适合处理大型项目或者资源有限的情况，它包含了调试工具、终端和Git集成等功能，使其成为开发人员的全能选择。不仅如此，在Visual St...
2023-04-16 11:51:08
604
原创 如何制作每日工作清单，让你高效完成开发工作
作为开发者，每天都有大量的任务需要完成。有时候，我们可能会感到无所适从，甚至失去动力。那么，如何有效地管理自己的任务和时间呢？在这篇文章中，我们将分享一位国外程序员大佬的亲身经验，介绍他所使用的简单的任务清单系统，以帮助开发者更好地管理自己的任务和时间。开篇一份任务清单看起来总是越来越长，让人感觉自己就像在跑步机上不断奔跑。对于大多数开发者来说，我们几乎永远也不可能完成所有的任务。在这种意义下，任...
2023-04-16 11:51:08
399
转载 AutoGPT太火了，AI自动化时代来临，无需人类插手自主完成任务
机器之心报道编辑：杜伟、陈萍原文链接：https://news.sina.cn/2023-04-11/detail-imypzekh7527744.d.html?from=wapOpenAI 的 Andrej Karpathy 都大力宣传，认为 AutoGPT 是 prompt 工程的下一个前沿。近日，AI 界貌似出现了一种新的趋势：自主人工智能。这不是空穴来风，最近一个名为 AutoGPT 的研...
2023-04-14 08:02:24
136
原创 简单的了解下 Fetch API 的工作原理
简介Fetch API是一种现代的Web API，提供了一种异步获取网络资源的方法。由于其简单性、灵活性和一致性，它已经成为Web应用程序中获取数据和资源的流行选择。在本文中，我们将深入探讨Fetch API的核心特性，并了解其工作原理。Fetch API的工作原理是什么？Fetch API基于Promise API，该API提供了一种一致而优雅的方式来处理JavaScript中的异步操作。当您调...
2023-04-14 08:02:24
188
转载 分享 45 个 Git 经典操作场景，专治不会合代码
git对于大家应该都不太陌生，熟练使用git已经成为程序员的一项基本技能，尽管在工作中有诸如 Sourcetree这样牛X的客户端工具，使得合并代码变的很方便。但找工作面试和一些需彰显个人实力的场景，仍然需要我们掌握足够多的git命令。下边我们整理了45个日常用git合代码的经典操作场景，基本覆盖了工作中的需求。我刚才提交了什么?如果你用git commit -a提交了一次变化(changes...
2023-04-13 08:02:27
33
原创 Tailwind CSS 小案例，创建漂亮的收藏卡片列表
作为人类，我们有一种天生的倾向，喜欢收集不同的物品，并根据兴趣将它们分组。从邮票到书籍，人们收集和分组的物品种类繁多。定义上，收藏是一组事物，通常是由某个人创建的。例如，很多孩子会收集漫画书，还有些人会收集奖杯等等，我相信你可以理解。在本教程中，我们将制作一组图像，并将它们分成不同的类别。这就是它的样子。（当然，你可以根据自己的喜好进行自定义 ）理解任务：将你的工作或设计划分为不同的部分非常重要，...
2023-04-13 08:02:27
205
原创 分享10个前端开发者需要掌握的DOM技巧
Web开发不断发展，掌握最新的趋势和最佳实践对每位开发者来说都至关重要。Web开发的最重要方面之一就是使用文档对象模型（DOM）。在本文中，我们将探讨10个必须掌握的DOM技巧和技巧，配有代码示例，这将帮助您成为更高效、更有效的开发者。1、掌握DOM操作的基础知识在深入学习高级DOM技巧之前，了解基础知识是至关重要的。熟悉核心DOM概念，如选择元素、修改属性和遍历DOM树。这将使您更容易理解和实现...
2023-04-12 08:03:22
547
转载 分享一些你不知道却非常实用的JavaScript APIs
在本文中，将介绍一些鲜为人知但却非常有用的API，如：Page Visibility APIWeb Share APIBroadcast Channel APIInternationalization API我们将一起看看它们是什么，我们应该在哪里使用它们，以及如何使用它们。Page Visibility API这是一个鲜为人知的 web API，在JS现状调查[1]中，它的认知度排名倒数第四。它...
2023-04-12 08:03:22
28
转载 分享 20 道关于 React 开发相关的面试题及答案
React 面试可能你会觉得有点吓人，为了帮助您自信并准备好迎接下一次面试，我们列出了 20 个常见的 React 问题和参考答案。希望通过本篇文章的内容，能够帮助你重新温习你的 React 知识，复习重要概念，并为你的下一次面试做好更充分的准备，展示你的自信。那么，让我们开始吧！React JS 面试问题和答案——练习测试1. 你能解释一下什么是 React 以及它与其他 JavaScript ...
2023-04-11 11:30:02
62
原创 使用 ChatGPT 和 React 创建一个惊艳的3D卡片（二）
在上一篇文章中，我们一起使用 ChatGPT 和 React 构建了一个基本的卡片布局，效果如下图所示。如果您还没有看过上一篇文章，可以通过这个链接快速查看《使用 ChatGPT 和 React 创建一个惊艳的3D卡片（一）》。在此基础上，我利用 Figma 软件对卡片进行了优化和设计。下图展示了我们设计的效果图。在本篇文章中，我们将基于这个设计完善上述案例，让这个卡片更加炫酷。废话不多说，让我们...
2023-04-11 11:30:02
142
原创 分享4个不可或缺的 VSCode 插件，让 Tailwind CSS开发更简单
本文将为大家分享我在使用 Tailwind 进行开发时常用的四个 VSCode 扩展程序，这些扩展程序都包含在 VSCode 的 TailwindCSS Kit 扩展程序包中。1.Tailwind CSS IntelliSenseTailwind CSS IntelliSense 是一款功能强大的工具，可以帮助开发者更快、更高效地编写代码。该工具可以实时提供 Tailwind CSS 类的建议，减...
2023-04-10 08:00:27
463
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人