YanHSama的博客

正则表达式摘要

for...in 与for..of

描述统计字符串中每个字符的出现频率，返回一个 Object，key 为统计字符，value 为出现频率不限制 key 的顺序输入的字符串参数不会为空忽略空白字符实现function count(str) { if(str.length>0){ let arr=str.split('')//将字符串转换为数组 console.log(arr) //遍历数组，删除空字符串的数组 for(let index in arr){ // console.log(index) if

描述指定参数名称，返回该参数的值 或者 空字符串不指定参数名称，返回全部的参数对象 或者 {}如果存在多个同名参数，则返回数组示例输入：http://www.nowcoder.com?key=1&key=2&key=3&test=4#hehe key 输出：[1, 2, 3]实现function getUrlParam(sUrl, sKey) { let param=sUrl.split('#')[0].split('?')[1] //指定参数名称

描述如果第二个参数 bUnicode255For1 === true，则所有字符长度为 1 否则如果字符 Unicode 编码 > 255则长度为 2示例输入：‘hello world, 牛客’, false输出：17实现function strLength(s, bUnicode255For1) { if(bUnicode255For1 ===true){ return s.length }else{ let len=s.length for(let i=0;i&

描述f(n)=f(n-1)+f(n-2)分析1,1,2,3,5,8,13,21,34,55…从第3位开始，后面的数是前两个数之和。实现function fibonacci(n) { if(typeof n !=='number' ||n<1){ return n }else if(n<2){ return 1 }else{ return fibonacci(n-1)+fibonacci(n-2) }}console.log(fibonacci(1))

描述输入：[false, true, undefined, null, NaN, 0, 1, {}, {}, ‘a’, ‘a’, NaN]输出：[false, true, undefined, null, NaN, 0, 1, {}, {}, ‘a’]利用indexOf实现indexOf()方法返回在数组中可以找到一个给定元素的第一个索引，如果不存在，则返回-1。Array.prototype.uniq = function () { let newArr=[] let flag=true

描述css 中经常有类似 background-image 这种通过 - 连接的字符，通过 javascript 设置样式的时候需要将这种样式转换成 backgroundImage 驼峰格式，请完成此转换功能以 - 为分隔符，将第二个起的非空单词首字母转为大写-webkit-border-image 转换后的结果为 webkitBorderImagefunction cssStyle2DomStyle(sName) { let pname=sName.split('-') for(let i

项目安装依赖包yarn add moment --save项目中使用import moment from 'moment'使用场景1获取年，月，日console.log('2022-02-13year',moment('2022-02-13').get('year'));console.log('2022-02-13month',moment('2022-02-13').get('month'));console.log('2022-02-13date',moment('2022-02-

SpeechSynthesisUtterance基本属性SpeechSynthesisUtterance.lang //获取并设置话语的语言SpeechSynthesisUtterance.pitch //获取并设置话语的音调(值越大越尖锐,越低越低沉)SpeechSynthesisUtterance.rate //获取并设置说话的速度(值越大语速越快,越小语速越慢)SpeechSynthesisUtterance.text //获取并设置说话时的文本SpeechSynthesisUttera.

CSS object-fit 属性object-fit 属性指定元素的内容应该如何去适应指定容器的高度与宽度。object-fit 一般用于 img 和 video 标签，一般可以对这些元素进行保留原始比例的剪切、缩放或者直接进行拉伸等。语法object-fit: fill|contain|cover|scale-down|none|initial|inherit;fill 。默认，不保证保持原有的比例，内容拉伸填充整个内容容器。contain。 保持原有尺寸比例。内容被缩放。cove.

CSS绘制三角形，伪元素的使用

原生下拉框聚焦状态border会变黄色，其实并不是border，而是边框边缘的外围轮廓（outline）是绘制于元素周围的一条线，位于边框边缘的外围，可起到突出元素的作用。轮廓（outline）属性指定元素轮廓的样式、颜色和宽度。解决方案select { outline: none;}...

img加载中显示loading，加载失败显示默认图片

html2canvas将页面绘制图片使用jspdf导出

头部导航

/ canvas的toDataURL方法将canvas输出为data: URI类型的图片地址，再将该图片地址赋值给元素的src属性即可。// canvas的toDataURL方法将canvas输出为data: URI类型的图片地址，再将该图片地址赋值给元素的src属性即可。// 实现保存图片的目标只需要将canvas转image即可。// 实现保存图片的目标只需要将canvas转image即可。// 实现保存为图片的第一步：html转为canvas。'图片canvas.png'

将页面上图片的 src 属性设置为空字符串，将图片的真实路径保存在一个自定义属性中，当页面滚动的时候，进行判断，如果图片进入页面可视区域内，则从自定义属性中取出真实路径赋值给图片的 src 属性，以此来实现图片的延迟加载。：也叫延迟加载，指的是在长网页中延迟加载图片的时机，当用户需要访问时，再去加载，这样可以提高网站的首屏加载速度，提升用户的体验，并且可以减少服务器的压力。：最常用的方式是使用 js 中的 image 对象，通过为 image 对象来设置 scr 属性，来实现图片的预加载。.........

固定距离 img { border: 1px gray solid; width: 400px; height: 200px; clip-path: polygon(0 20px, 100% 0, 100% 100%, 0 100%); }img { border: 1px gray solid; width: 400px; height: 200px; clip-path: polygon(0 0, 100% 0, 10

transform：scan()失效解决

判断一个dom节点是否在可视化区域内。

background-color设置透明

防抖与节流在实际项目基本都会用到。

react实现视频播放

什么是闭包？当内部函数（子函数）调用了外部函数（父函数）的变量，便产生了闭包。闭包产生条件？条件1：函数嵌套条件2：内部函数引用外部函数的变量

js实现将excel文件转为blob或文件流上传以及下载。

实现剪切复制剪切版的主要实现。虽然目前暂时不推荐使用，但是目前也只有这个实现，便还是继续使用。

img加载中显示loading，加载失败显示自定义内容，加载成功正常展示图片

重要提示：FileReader 仅用于以安全的方式从用户（远程）系统读取文件内容 它不能用于从文件系统中按路径名简单地读取文件。要在 JavaScript 中按路径名读取文件，应使用标准 Ajax 解决方案进行服务器端文件读取，如果读取跨域，则使用 CORS 权限。元素上选择文件后返回的FileList对象，也可以来自拖放操作生成的 DataTransfer对象，还可以是来自在一个。对象允许 Web 应用程序异步读取存储在用户计算机上的文件（或原始数据缓冲区）的内容，使用。对象指定要读取的文件或数据。

使用腾讯云文档预览，需要开通文档预览功能，该功能需要收费的。如果需要图片预览、视频或音频可以使用获取下载链接。使用cos获取预览文档链接。

前端项目中使用字体库

js事件循环、宏任务和微任务理解

js下载纯文本js支持字符串下载至本地js支持将字符串生成URL在浏览器中预览js下载Excel无法打开解决

box-shadow的一些属性应用

富文本支持上传图片

【代码】js实现将文本生成二维码（腾讯云cos）