1.早上不要开会📅 每个人一天是24小时，时间是均等的，但是时间的价值却不是均等的，早上1小时的价值是晚上的4倍。为什么这么说？ 因为早晨是大脑的黄金时间，经过一晚上的睡眠，大脑经过整理、记录、休息，此时的状态是最饱满的，适合专注度高的工作，比如编程、学习外语等，如果把时间浪费在开会、刷手机等低专注度的事情上，那么就会白白浪费早上的价值。 2.不要使用番茄钟🍅 有时候在专心编程的时候，会产生“心流”，心流是一种高度专注的状态，当我们专注的状态被打破的时候，需要15分钟的时候才能重新进入状态。 有很多人推荐番茄钟工作法，设定25分钟倒计时，强制休息5分钟，之后再进入下一个番茄钟。本人在使用...

//获取当前的前几天时间type1前一天 //add为1时是未来几天，0时是前几天 //nowdate传人时间 functiongetdatetime(nowdate,type,add){ //console.log('date',type) vardate=newDate() if(nowdate){ if(add1){ date=newDate(newDate(nowdate).getTime()1+type2436001000); }else{ date=newDate(newDate(nowdate).getTime()-type2436001000); ...

方法一：提前return 假如有如下代码： if(condition){ doSomething; }else{ return; } 这种代码我们一般采用提前return的方式，去掉不必要的else。 if(!condition){ return } doSomething;   这种方法一般只适合分支结构很简单的if...else，我们可以提前return，把一些不必要的if...else去掉。 方法二：枚举 枚举其实也是可以去掉if...else的，如下： StringorderStatusDes; if("1".equals(orderStatus)){ orde...

这篇文章来分享下如何调试线上的代码 什么时候需要调试线上的代码呢，当线上代码出现bug的时候，需要定位问题，就需要一步一步调试代码来确认问题，但是线上代码都是构建之后的代码，很难看懂，有什么好的解决办法么？ 实际例子 在本地创建一个demo项目 mkdirdebugger-demo cddebugger-demo npminit-y npmiwebpackwebpack-cli 这个项目用webpack构建打包 这是webpack配置文件webpack.config.js： constpath=require("path"); /@type{import('webpack').Con...

引言 ES6（ECMAScript2015）引入了许多新的功能和语法，其中一些功能可能相对较冷门，但非常实用。本文将介绍一些这样的高级技巧，包括 Object.entries() Object.fromEntries() Symbol类型和Symbol属性 WeakMap和WeakSet Promise.allSettled() BigInt Array.of Array.from .at和flat 1.Object.entries()和Object.fromEntries() Object.entries()方法返回一个给定对象自身可枚举属性的键值对数组。 Object.fromEn...

节流和防抖 节流 节流是一种常用的性能优化技术，它可以限制函数的执行频率，避免过多的重复操作，提升页面的响应速度。 函数在n秒内只执行一次，如果多次触发，则忽略执行。 应用场景： 拖拽场景 scroll场景 窗口大小调整 functionthrottle(fn,wait){ letstartTime=Date.now() returnfunction(){ constnowTime=Date.now() //计算两次执行的间隔时间是否大于wait时间 if(nowTimestartTime>=wait){ startTime=nowTime returnfn.apply(th...

本文是前端面试必须掌握的手写题系列的最后一篇，这个系列几乎将我整理和遇到的题目都包含到了，这里还是想强调一下，对于特别常见的题目最好能“背”下来，不要眼高手低，在面试的时候不需要再进行推导分析直接一把梭，后续会整理分享一些其他的信息，希望对你能有所帮助 🔥请求并发控制 多次遇到的题目，而且有很多变种，主要就是同步改异步 functiongetUrlByFetch(){ letidx=maxLoad; functiongetContention(index){ fetch(pics[index]).then(()=>{ idx; if(idx<pics.length){ ...

技巧1：使用解构赋值交换变量值 leta=1; letb=2; [a,b]=[b,a]; console.log(a);//输出2 console.log(b);//输出1 这种方式可以很方便地交换两个变量的值而不需要引入第三个变量。 技巧2：使用数组解构获取函数返回值 functiongetNumbers(){ return[1,2,3]; } const[a,b,c]=getNumbers(); console.log(a);//输出1 console.log(b);//输出2 console.log(c);//输出3 这种方式可以很方便地从函数获取多个返回值。 技巧3：...

出行实时公交是一款公交查询小程序，使用小程序可以直接查询全国各地的公交信息，小程序会自动根据实际的定位确定城市，用户只需要在上面输入公交车的路线，就可以直接看到该路线公交的具体位置。需要的朋友快来下载吧！ 出行实时公交软件介绍 打开出行实时公交 高德实时公交，让您一手掌握公交出行信息。 出行实时公交手机版功能  打开出行实时公交 1、坐什么车（支持搜索，地点\车站\公交路线）。 2、车什么时候来（实时公交，覆盖城市位列同类产品第一）。 3、常坐路线（支持关注常坐路线，通勤查阅方便快捷）。 4、在哪里坐车（精准gps定位，并确保公交站及公...

除了for循环♻️，for-of,for-each循环♻️也是一个不错的选择 先说for-of循环♻️ 认识for-of循环♻️ for(const/循环对象集合中的每个元素/of/循环对象集合/){ /循环体/ /你可以在循环体中取出循环对象集合中的每一个元素/ } 通过for-of循环♻️，可以对数组Array、对象Object等可迭代变量进行像键值对一样的循环遍历操作。换句话说，你不需要亲自创建索引来依次遍历并取出集合中的每一个元素；此循环会将集合中的每一个元素创建对应的索引，通过索引来遍历整个数组中的元素。 另外，如果你觉得这样不好记忆，你可以换一种方式：在英文中，Thecol...

循环是编程中常用的一种结构，用于重复执行一段代码。JavaScript中提供了多种循环方式，包括for循环、for-in循环、forEach方法和map方法。本文将对这些循环方式进行比较，并从前言、原理分析、具体代码实现例子、注意事项和总结等方面进行讨论。 前言： 在开始比较之前，让我们先了解一下这些循环方式的介绍。 for循环：for循环是一种最基本的循环结构，通过设置初始条件、循环条件和每次循环后的操作，可以重复执行一段代码。 for-in循环：for-in循环用于遍历对象的可枚举属性，将每个属性的键名赋值给指定的变量，并执行相应的代码块。 forEach方法：forEach方法是数...

一、前言 前端优化是一个永恒的话题，每个前端开发者都希望自己的页面能够快速加载，给用户良好的体验，但是在实际开发中，我们经常会遇到一个棘手的问题，那就是首页白屏问题。 首页白屏问题是指用户打开页面后，需要等待很长时间才能看到页面内容，这会让用户感到不耐烦，甚至流失，造成白屏的原因有很多，比如网络延迟、JS加载过多、渲染性能不佳等等，针对不同的原因，我们需要采取不同的优化策略。 今天和大家讨论一种常见的场景，以及其中的一种优化手段，这种优化手段可能很多人都不知道，但是它非常有效，可以大幅度提升用户的感知效率。 二、场景回顾 <template> <divclass="con...

前言 为什么要做性能优化？性能优化到底有多重要？   性能优化是为了提供更好的用户体验、加快网站加载速度、提高搜索引擎排名、节省服务器资源、适应多种设备和网络环境等方面的需求。通过不断优化性能，可以提高用户满意度、增加网站流量提高业务效果。 同时性能优化是把双刃剑，有好的一面也有坏的一面。好的一面就是可以能提升网站性能，坏的一面就是配置多，代码复杂，或者要遵守的规则太多。并且某些性能优化规则并不适用所有场景，所以也并不是一味的追求性能优化，而是需要谨慎使用。 防抖和节流是JavaScript 中常用的两种性能优化方式。面试中我们也会经常碰到。它们的作...

JavaScript是一门强大而灵活的编程语言，提供了多种迭代对象的方式。两个常见的迭代方式是 for...in 和 for...of 循环。这两种循环用于遍历对象和数组中的元素，但它们有许多重要的区别和适用场景。在本文中，我们将深入探讨 for...in 和 for...of 循环的区别，以及何时使用它们。 1. for...in 循环 for...in 循环是一种用于遍历对象的属性的迭代方式。它的语法结构如下： for(constkeyinobject){ //执行代码 } ...

引言 在上一篇文章中我们了解了一下图片懒加载以及它的实现原理，图片懒加载是一种优化网页性能的技术，它可以在网页加载时只加载当前屏幕可视区域内的图片，而不会一次性加载所有图片，从而提高网页的加载速度、减少后台服务器压力，并提升用户体验。在这篇文章里我们再来一起了解一些可以进一步提高图片懒加载的效率和性能的优化方法。 一、使用IntersectionObserverAPI IntersectionObserverAPI是浏览器提供的一种监听元素可见性的方法，它可以在元素进入或离开可视区域时触发回调函数。使用IntersectionObserverAPI可以省去计算元素位置的步骤，并且可以提高性...

前言 本篇文章略微介绍一下前端中常见的加密算法。前端中常见的加密算法主要形式包括——哈希函数，对称加密和非对称加密算法。 一、哈希函数 定义：哈希也叫散列，是指将任意长度的消息映射为固定长度的输出的算法，该输出一般叫做散列值或者哈希值，也叫做摘要（Digest)。简单来说，这种映射就是一种数据压缩，而且散列是不可逆的，也就是无法通过输出还原输入。 特点：不可逆性（单向性）、抗碰撞性（消息不同其散列值也不同）、长度固定 常见应用场景：由于不可逆性，常用于密码存储、数字签名、电子邮件验证、验证下载等方面，更多的是用用在验证数据的完整性方面。 密码存储：明文保存密码是危险的。通常我们把密...

老实说我不喜欢用forEach，因为它导致的一些bug总是这么不经意，盘点我不喜欢的原因 原因一：不支持处理异步函数 先看一个例子： asyncfunctiontest(){ letarr=[3,2,1] arr.forEach(asyncitem=>{ constres=awaitmockSync(item) console.log(res) }) console.log('end') } functionmockSync(x){ returnnewPromise((resolve,reject)=>{ setTimeout(()=>{ resolve(x) },10...

金九银十过了大半，笔者最近也面了一些公司，现将一些自己遇到的和收集的基础题目整理出来，后续会整理分享一些其他的信息，希望对你能有所帮助 闲言少叙，看正文 实现Object.create 创建一个新对象，使用现有的对象来提供新创建的对象的__proto__。--MDN functioncreate(obj){ functionFun(){ } Func.prototype=obj; Func.prototype.constructor=Func; returnnewFun(); } 实现instanceof方法 instanceof运算符用于判断构造函数的prototype属性是否出现在...

BFC 块级格式上下文(blockformatcontext)是页面一块独立的渲染区域，具有一套独立的渲染规则 内部的盒子会在垂直的方向上一个接一个地放置 同一个bfc内部相邻的盒子margin会发生重叠，与方向无关 每个元素的左外边距和包含块的左边界相接触（从左到右），即使浮动元素也是如此（bfc的子元素不会超出包含块，但绝对定位可以） 清除浮动只能清除同一BFC在它前面的元素的浮动 BFC就是页面上的一个隔离的独立容器，里面的元素和外部的元素互不影响 计算BFC的高度时，考虑BFC所包含的所有元素，连浮动元素也参与计算； bfc的区域不会与float的元素区域重叠目的是为了形成一个相对...

这个问题非常有意思，我一看到就想了很多可以回复的答案，但是评论区太窄，就直接开一篇文章来写了。 审题 JS发起的请求可以暂停吗？这一句话当中有两个概念需要明确，一是什么样的状态才能称之为 暂停？二是 JS发起的请求 是什么？ 怎么样才算暂停？ 暂停 全称暂时停止，在已开始未结束的过程中临时停止可以称之为暂停，意味着这个过程可以在某个时间点截断然后在另一个时间点重新续上。 请求应该是什么？ 这里得先介绍一下 TCP/IP网络模型，网络模型自上而下分为应用层、传输层、网络层和网络接口层。 上图表示的意思是，每次网络传输，应用数据在发送至目标前都...