面试中曾经有这么一道题目，考察的是开发者对于 equals()和 hashCode()的理解， 题目是这样的， 有对象A和B， A.equals(B) == true, A和B的 hashCode可以不同...Set是不允许重复对象存在的， 那么当这一千个对象都不重复的情况下， 第1000个对象的存储需要调用1000次 equals去进行比较，这是非常低效的。...，如果重复了则用 equals()校验是否相等， 如果不相等的话，以 HashMap作为例子，默认是在同一个地址上用链表存储起来新的对象， 这在之前介绍哈希冲突的解决办法那篇文章里提到过。...equals和 hashCode的总结 在理解了上面 equals的原则和 hashCode的原则之后我们可以推导出这么个结论， · 如果两个对象 equals，那么他们的 hashCode一定要相同(...否则在Set中就会出现重复元素) · 如果两个对象 hashCode相同，他们可以不 equals 所以如果不好记住这俩的关系的话，可以试着从数据集合的存储这个角度出发来理解eqauls和 hashCode
根据 Java 的约定，虽然两个不相等的对象可以具有相同的哈希码，但这并不是错误，而是合法现象，称为哈希冲突。 什么是哈希冲突？ 哈希冲突是指两个不同的对象返回相同的哈希值。...由于哈希值是通过算法计算得出的，并且哈希值的范围有限，因此不同的对象可能会映射到同一个哈希值。这在处理大数据集或对象种类繁多的情况下尤其常见，几乎不可能为每个对象生成唯一的哈希值。...相等性：如果两个对象使用 equals() 方法判断相等，则这两个对象的 hashCode() 方法必须返回相同的值。...不相等的对象：如果两个对象不相等，它们的 hashCode() 方法可以返回相同的值，也可以返回不同的值，这意味着哈希冲突是合法的。...当首次计算的哈希值发生冲突时，就尝试第二个、第三个等哈希函数，直到找到没有冲突的地址。 因此，答案是肯定的：在 Java 中，两个不相等的对象完全有可能具有相同的哈希值。
div也就是division，是一种常用的HTML 网页当中的重要元素。主要作用是分割网页当中的文档。那么网站建设设置两个div 如何操作呢？...网站建设设置两个div 网站建设设置两个div 的方式和步骤可以参照以下内容。首先插入两个div 的标签，插入之后，创建一个长宽都是200px的标签，给它命名。...这时候看到了两个标签的位置是上下的，下一步就双击CSS 样式的其中一个标签，在CSS 的分类选项里面，将Float设置成为left，也就是向左边移动。这样就可以完成div 并排了。...div常见的布局方式 网站建设设置两个div 的步骤是非常简洁的，除此之外，div 还有其它几种常见的布局方式。第一种就是垂直排列，也就是标签是垂直平铺排列的，这也是一种最常见的网页布局格式。...以上就是网站建设设置两个div的相关内容，每一种div 布局方式的展现效果都是不同的，根据不同的网络效果来选择布局方式就可以。
事件规定在何处放置被拖动的数据。...如果需要设置允许放置，我们必须阻止对元素的默认处理方式。 这要通过调用 ondragover 事件的 event.preventDefault() 方法： 当放置被拖数据时，会发生 drop 事件。...调用 preventDefault() 来避免浏览器对数据的默认处理（drop 事件的默认行为是以链接形式打开） 通过 dataTransfer.getData("Text") 方法获得被拖的数据。...该方法将返回在 setData() 方法中设置为相同类型的任何数据。 被拖数据是被拖元素的 id ("drag1") 把被拖元素追加到放置元素（目标元素）中 结果----》 拖动前 ? 拖动后 ?...在两个 div> 元素之间拖放图像--- 代码清单： <!
问题提出 现在有两个div左右排列，但是两个div的内容不相同，如何设置两个div的css做到在两个div等高排列呢？ 下面是网上找的3种实现方法，觉得很有代表性，所以索性收藏起来。...方法一 通过父元素设置 overflow:hidden, div自己设置padding-bottom 和 margin-bottom来实现。...div id="#warp"> div class="left"> left div...> div class="right">rightdiv> div> #wrap { overflow: hidden; width: 1000px; margin
---- 设想这样一个情况：一个父元素有两个子元素，父元素的高度不确定，用子元素撑起来。 但是这会导致一个问题：各个子元素的高度不一致，为子元素添加height:100%是无效的。...这种方式需要父元素高度确定，然而父元素的高度由子元素确定。 猜想渲染时由于父元素高度不确定，会计算出各个子元素的高度再确定父元素高度，但计算子元素高度时并没有父元素高度可以参考，因此上述方法行不通。...你可以 为父元素设置固定高度 配合height:100%，两个子元素都能撑满父元素 利用span元素与布局 如果span的定位是absolute类型，那么它的高度可以等于父元素的高度。...父元素只根据相对定位的子元素决定高度，也就是说，absolute定位的span设置height:100%是有效的，父元素的高度对它来说是已知的。...这种方法下，父元素的高度仍然由最高的相对定位的子元素确定，其它元素放到span中，所以需要知道最高的子元素。 使用同色背景 虽然很简单，却很实用的方法。子元素的高度虽然不都是100%，但效果一样。
代码存放在VirtualScroll/zoneRender 虚拟滚动列表形式 长列表的渲染主要存在两个问题 白屏时间过长 页面节点过多 分片实现解决了第一个问题，但页面节点仍然是全量的。..."> {{ scope.item.value }} div> 组件内部的结构则如下 div class="lan-viewport"...div> 每项高度已知 methods: { handleViewportScroll() { let scrollTop = this....$refs.viewport.scrollTop if (this.variable) { this.start = this.getStartIndex(scrollTop) // 算出开始的位置...scrollTop值大概率和列表中的top/bottom不相等，所以我们期望去找到一个区间且最接近的值。
当组件在 内被切换，它的 activated 和 deactivated 这两个生命周期钩子函数将会被对应执行。...二、获取并存储当前 scrollTop 页面布局如下： 整个页面是一个 ，下面又分了两个 tab，我们列表页是一个组件，位于 title 和 导航栏之间的区域。...为什么给出这么多呢？因为这里有个大坑，也是我一直卡住的地方。 我们知道获取滚动位置是用 scrollTop 这个属性，下面我们就依次打印出这几个元素的 scrollTop 。...我也不知道为啥，之前一直是获取后三者的 scrollTop ，一直获取不到，纠结了好久。为什么其他三个获取不到我现在还没整明白，知道原因的大佬可以指点一下。...$refs.wrapper.scrollTop = this.scroll } 完整的代码如下： div class="wrapper" ref="wrapper">
两个Excel表格核对 excel表格中# DIV/0 核对两个表格的差异，合并运算VS高级筛选 1.两列顺序一样的数据核对 方法1：加一个辅助列，=B2=C2 结果为FALSE的就是不相同的...方法2：两列数据，按CTRL+\ 然后直接标记颜色就把不一样的找出来 2.两列顺序不一致的情况 方法1：用VLOOKUP来查找匹配的 方法2：两列数据全选中了，然后在开始选项卡下，点击条件格式，选择突出重复值...excel表格中# DIV/0 含义： 当公式被 0（零）除，即分母为0时，将会产生错误值#DIV/O 2种方法快速核对两个表格的差异，合并运算VS高级筛选 (测试发现：对数字列有效果，对文本的没有效果...点击确定，在新的工作表里生成了一张新的表格，在这个表格里，数字为0表示无差异，大于0的，则表示差异，而显示成“#DIV/O!”则表示这个编号只在其中一个表格里。...对比的两个表格，表头，在使用标准偏差功能时候，字段名称需要一致。否则会出现：多出来一列：全部是#DIV/0! Excel是根据表头名称一致来匹配的。
背景：昨天一个同事有种需求，有一个展示数据区域的div，带滚动条，当滚动条滚动时，需要向后台发请求，计算数据，再拿到前台展示。 ...后来想到的思路是当滚动条滚动的时候，发起一个定期执行的方法，并记录一次当前滚动条到顶部的距离，这个方法中判断此时滚动条到顶部的距离是否和上次记录的相等，如果相等，那么说明停止滚动了，不相等，还在滚动。.../ 未发起时，启动定时器，1秒1执行 interval = setInterval("test()", 1000); topValue = document.documentElement.scrollTop...; } function test() { // 判断此刻到顶部的距离是否和1秒前的距离相等 if(document.documentElement.scrollTop == topValue...，时间越短，响应的越及时，浏览器压力越大；时间越长，响应的越慢，浏览器压力越小。
滚动的几种场景 只有window窗体滚动 内滚动布局 窗体滚动+DIV内滚动 这时候，台下观众会问，什么是内滚动布局，什么是window滚动呢？...（具体为什么ios上和android上会使用不同的滚动方式，可以去了解下=。=） 内滚动布局什么时候会使用了？...滚动计算基础知识 由于不同浏览器其窗体滚动条的属性获取方式有所差异，故考虑兼容性，我们假设使用了场景是移动到，并且使用了zepto的库 首先，我们想要更好的操作控制条，需了解两个地方 滚动条属性 滚动条调用方法...//浏览器滚动条偏移值: $(document.body).scrollTop(); //节点offset值 $("#div").offset().top; $("#div").offset().left...; //节点的宽高 $("#div").height(); $("#div").width(); //节点的滚动条偏移值 $("#div").scrollTop(); ---- 现在我们知道如何调用滚动条到指定的位置和获取滚动条偏移值
Object.is 实现题目描述:Object.is不会转换被比较的两个值的类型，这点和===更为相似，他们之间也存在一些区别。 1....NaN在===中是不相等的，而在Object.is中是相等的 2. +0和-0在===中是相等的，而在Object.is中是不相等的实现代码如下:Object.is = function (x,...在项目中，一般在beforeEach这个钩子函数中进行路由跳转的一些信息判断。判断是否登录，是否拿到对应的路由权限等等。为什么需要浏览器缓存？...为什么？...document.body.scrollTop;图示： 代码实现：div class="container"> <img src="loading.gif" data-src="pic.png
= wrap.scrollTop; // 计算当前滚动位置，获取当前开始的起始位置 const currentIndex = Math.floor(scrollTop...; // console.log(startIndex, 'startIndex222', currentIndex); // 根据滚动条获取当前索引与起始索引不相等时...// 设置el-scrollbar__view的高度 scrollView.style.height = `${total * rowHeight}px`; 用一张图还原一下，为什么需要设置scrollView...scrollTop = wrap.scrollTop; // 计算当前滚动位置，获取当前开始的起始位置 const currentIndex = Math.floor(scrollTop /...> div
实现滚动条 按照上面的图，很容易想到我们的dom结构应该是下面这样的： div class="container"> div class="list-wrapper...接下来就是计算容器里面到底渲染多少个item，很简单，Math.ceil(可视区域的高度 / 每个item的高度)。 为什么使用Math.ceil向上取整呢？...此时可视区域内显示的就是item1-item7的模块了，这就是为什么前面我们计算end时要多渲染一个item，不然这里item7就没法显示了。...所以此时的start的值就应该从0更新为1，同理如果scrollTop的值为110，start的值也一样是1。...所以我们得出 offset.value = scrollTop - (scrollTop % itemSize); 为什么这里要减去scrollTop % itemSize呢？
滚动的几种场景 只有window窗体滚动 内滚动布局 窗体滚动+DIV内滚动 这时候，台下观众会问，什么是内滚动布局，什么是window滚动呢？...（具体为什么ios上和android上会使用不同的滚动方式，可以去了解下=。=） 内滚动布局什么时候会使用了？...滚动计算基础知识 由于不同浏览器其窗体滚动条的属性获取方式有所差异，故考虑兼容性，我们假设使用了场景是移动到，并且使用了zepto的库 首先，我们想要更好的操作控制条，需了解两个地方 滚动条属性 滚动条调用方法...//浏览器滚动条偏移值: $(document.body).scrollTop(); //节点offset值 $("#div").offset().top; $("#div").offset().left...; //节点的宽高 $("#div").height(); $("#div").width(); //节点的滚动条偏移值 $("#div").scrollTop(); 现在我们知道如何调用滚动条到指定的位置和获取滚动条偏移值
#3 副作用 最后一步是对上边两个方法对调用，同时注意我们需要通过ReactDOM.render的API将React组件渲染到刚才的创建的节点上。 这里为什么不用传送门？...麻烦的是我们如何确定菜单呈现的位置，如何模拟正常的操作菜单的交互 #1 处理边界情况 这里看着可能会模糊看一下这里，为什么我需要将ref.current的宽高赋值给memoAttr?...原因在于，我们的菜单组件，在display:none的时候是没有宽高的，我们需要在一开始便拿到组件的宽高，以便于在隐藏的时候仍可以做计算。 哈？那为什么不用visibility来控制显隐？...因为我们会发现正常的选择器并不能选择到某一个/段文本（否则也不会需要做文本替换） 这样处理出来的XPath类似于 'id("gatsby-focus-wrapper")/DIV[1]/DIV[1]/DIV...[2]//DIV[2]/DIV[1]/DIV[2]/DIV[2]' 再次使用的时候可以通过document.evalute这个API进行选择 而对于定位自己添加的节点，我们在节点替换时就会有一个带有
因此学习本文，你可以学会: 使用 JavaScript 实现阅读进度功能 使用 CSS 实现阅读进度功能 利用JavaScript实现阅读进度 HTML与CSS html css 部分非常简单，通过嵌套的两个...div 实现，外部的 div 提供底色背景，内部 div 显示阅读进度 div class="read_pro"> div class="read_pro_inner">div> scrollTop 光看上面三个属性的名字有几分难以理解，来看一张示意图 从上图可以看到 scrollTop 就是已经读过被卷起来的文档部分，scrollHeight...= +(scrollTop / (scrollHeight- clientHeight)).toFixed(2)*100 + '%' 复制代码 大家可能会有疑惑，为什么分母是 scrollHeight...当滚动条滚动到底部时，浏览器此时仍显示一屏内容，此时滚动条无法再滚动，scrollTop 无法再增加，因此 scrollTop 的最大值是 scrollHeight- clientHeight ，如果使用
> ) } 这是我做的时候的第一版，确实是实现了两块区域的同步滚动，但是存在两个bug，来看看是哪两个 bug1： 这是一个很致命的bug，先埋个伏笔，先来看效果： ?...同步滚动的效果实现了，但能很明显得看到，当我手动滚动完以后停止了任何操作，但是两个区域仍然在不停的滚动，这是为什么呢？...编辑区和展示区的可视高度是一样的，但一般编辑区的内容经过markdown渲染后，总的滚动高度是会高于编辑区总的滚动高度的，所以我们无法仅凭scrollTop和scrollHeight使得两个区域同步滚动...> ) } 两个bug都已经解决了，同步滚动的功能也算完美实现啦。...但对于同步滚动这个功能，其实有两种概念，一种是两个区域在滚动高度上保持同步滚动；另一种就是右侧的展示区域对应左侧的编辑区的内容进行滚动。
> ) } 这是我做的时候的第一版，确实是实现了两块区域的同步滚动，但是存在两个bug，来看看是哪两个 bug1： 这是一个很致命的bug，先埋个伏笔，先来看效果： 同步滚动的效果实现了，但能很明显得看到...，当我手动滚动完以后停止了任何操作，但是两个区域仍然在不停的滚动，这是为什么呢？...那就是两个区域其实还没完完全全实现同步滚动。...> ) } 两个bug都已经解决了，同步滚动的功能也算完美实现啦。...但对于同步滚动这个功能，其实有两种概念，一种是两个区域在滚动高度上保持同步滚动；另一种就是右侧的展示区域对应左侧的编辑区的内容进行滚动。
既然都存了每个item的高度，那么同样可以使用top、bottom这两个字段去记录每个item在列表中的开始位置和结束位置。注意bottom - top的值肯定等于height的值。...此时应该如何计算最新的start值呢？ 很简单！在positions中存了两个字段分别是top和bottom，分别表示当前item的开始位置和结束位置。...如果当前滚动条的scrollTop刚好在top和bottom之间，也就是scrollTop >= top && scrollTop 的位置呢。...并且由于在positions数组中bottom的值是递增的，那么问题不就变成了查找第一个item的scrollTop 的值为： offset.value = positions.value[start.value].top; 可能有的小伙伴会迷惑，在start的item中的滚动值为什么不算到offset
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
ICP备案
腾讯会议
云直播
对象存储
