TypeScript 中的 type 和 interface：你真的了解它们的不同吗？
如果你有写过 Vue3 的项目，那么对 TypeScript 肯定不会陌生。不管是公司新项目技术选型还是个人学习开发新的前端项目，Vue3 + TypeScript 已经成为首选技术方案之一
在 TypeScript 这个强大的静态类型系统中，type 和 interface 是两个重要的关键字，用于定义和描述数据类型。然而，这两者之间的区别是什么，在实际开发过程中我们要怎么用呢？废话不说，直接进入正题，就让我们一起深入探讨吧
一、type 和 interface 的定义
type: 可以定义一个集合，可以包含各种类型的属性和值，以用来描述对象、函数、联合类型、交叉类型等
12345type Person = { name: string; age: number; sex: 0 | 1;};
interface：它定义了一个对象的形状，描述了对象应该具有的属性及其类型12345interface Person { name: string; age: number; sex: 0 | 1;}
通过上面的示例，我们可以看到，虽 ...
手摸手，带你实现移动端H5瀑布流布局
移动端瀑布流布局是一种比较流行的网页布局方式，视觉上来看就是一种像瀑布一样垂直落下的排版。每张图片并不是显示的正正方方的，而是有的长有的短，呈现出一种不规则的形状。但是它们的宽度通常都是相同的
因为移动端瀑布流布局主要为竖向瀑布流，因此本文所探讨的是竖向瀑布流
特点竖向瀑布流布局主要有下面几种特点：
一般出现在移动端 H5 页面底部
主要以图片或视频为主
降低页面复杂度，节省空间，可以容纳更多内容
不规则展示，不会那么枯燥，用户体验好
难以或者说不能滚动到页面最底部
不同于传统的分页，瀑布流因为以上这些特点一般被用在这些场景下：
推荐机制下的信息 即根据用户画像推荐或者运营人员推荐的信息
大分类下的信息流 展示的信息有很多，它们的大分类都是相同的，适合用户不明确详细需要获得什么信息或商品的情况下
各个信息或商品之间没有比较强的相关性 和上面一条类似，展示的不是千遍一律的东西，相对独立的信息或商品也许能让用户意外发掘到想要的东西
实现一般来说主要分为 CSS 实现和 JS 实现
CSS 实现主要是用到一些专门的样式属性，实现起来简单，但是往往会有兼容性问题
JS 实现的方法则 ...
这几种方法帮你快速实现回到页面顶部
背景介绍当页面内容很多的时候，用户可能会一直往下滑动页面。但是当他想返回页面顶部进行其他操作时，他可能需要不断滚动鼠标滚轮，这就导致用户体验将很差。鉴于这种情况， “回到顶部”这一功能便出现了。
如今在我们浏览网站的时候，常常能遇见“回到顶部”这个按钮。目前主流的回到页面顶部分表现为两种，一种是直接回到页面的顶部，这种方式简单粗暴；另外一种则是自动滚动间接回到页面顶部，这样一来视觉体验上可能更好，但是用户需要过几秒才能看到顶部内容。
例如掘金，在滚动到一定高度时会出现“回到顶部”按钮，点击后会直接回到页面顶部，就是上文说到的第一种情况。
实现动态显示滚动按钮“回到顶部”并不是一直显示的，而是滚动到一定值才出现的，因此应该在window.onscroll里定义一个判断事件。
123456789101112window.onscroll = function () { var currentHeight = document.documentElement.scrollTop || window.pageYOffset || document.body.scr ...
前端都应该要掌握的防抖和节流
说到防抖和节流相信大家都不陌生，这两个东西大家可能多多少少都有用到过，最少也有听过
古人云，温故而知新。虽然可能已经很熟悉防抖和节流了，但不妨再看一看巩固一下知识
什么？你说你不仅不会手写防抖和节流，也没有听过。那也没事，下文会详细介绍的
防抖和节流有什么用？简单来说，防抖和节流都是用来减少函数执行的频率，以达到优化项目性能或者实现特定功能的效果
防抖定义：事件被触发一定时间后再执行回调。如果在这段时间内又被触发了，则重新开始计算时间
常用场景
输入框远程查询事件
在线文档自动保存
浏览器视口大小改变
例子张三在某平台搜索一本书籍，发现搜索建议并不是瞬间就出现的，而是自己输入词组结束后出现的。那么该平台在此搜索框可能做了什么操作？代码实现
123456789101112131415161718<body> <input type="text" id="searchElement" /></body><script> const searchElement = document.getEleme ...
在网站copy时自带的版权小尾巴以及复制代码，可以怎么实现
前言每天网上的博客各个领域都会涌现新文章，有时候看到感兴趣的知识就想把某段文字 copy下来 摘录下来，等有时间后慢慢品味
在部分网站上，如果只是复制少量文字，并没有什么不同。但是当我们复制的文字多的话会发现多了一个小尾巴
所谓小尾巴是指在复制文本的最后会多一个作者和出处信息，如下：
···（复制的内容）···————————————————版权声明：本文为xxx的原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接及本声明。原文链接：https://www.cnblogs.com/rainy-night/
博客园可能并没有这种情况，但是在很多技术论坛、博客都有这样的处理。当我们复制文章内容的时候，往往会自动加上一段文本信息版权
那么如果我们也想实现这样的效果要怎么做呢？
实现版权小尾巴前提：假定所选择的字符串长度大于等于130时带上版权信息
12345678910111213141516171819202122232425<div id="copy"> <div>示例一：这不是一个 bug，这只是一个未列出来的特性。 ...