随笔分类 - js
es6数组方法find()、findIndex()与filter()的总结
摘要：find() 该方法主要应用于查找第一个符合条件的数组元素。它的参数是一个回调函数。在回调函数中可以写你要查找元素的条件，当条件成立为true时，返回该元素。如果没有符合条件的元素，返回值为undefined。 以下代码在myArr数组中查找元素值大于4的元素，找到后立即返回。返回的结果为查找到的元
阅读全文
es6之扩展运算符 三个点（...）
摘要：es6之扩展运算符 三个点（...）es6之扩展运算符 三个点（...）对象的扩展运算符数组的扩展运算符总结es6之扩展运算符 三个点（…）对象的扩展运算符理解对象的扩展运算符其实很简单，只要记住一句话就可以： 对象中的扩展运算符(...)用于取出参数对象中的所有可遍历属性，拷贝到当前对象之中 le
阅读全文
抖音特效在 Web 端的实现
摘要：当下最火的短视频应用莫过于抖音了，凭借着丰富的视频特效，抖音吸引了很多年轻用户的青睐，今天我们来看一下，抖音特效如何在 Web 端实现。 核心原理 实现原理比较简单，总结起来有如下三个步骤： 1、使用预渲染 canvas 绘制 video 的每一帧画面。 2、将预渲染 canvas 作为纹理传到显存
阅读全文
前端滤镜
摘要：Filter 函数 注意: 滤镜通常使用百分比 (如：75%), 当然也可以使用小数来表示 (如：0.75)。 none 默认值，没有效果。 blur(px) 给图像设置高斯模糊。"radius"一值设定高斯函数的标准差，或者是屏幕上以多少像素融在一起， 所以值越大越模糊；如果没有设定值，则默认是0
阅读全文
文件下载重命名（可跨域）
摘要：一、正常情况下，我们都如此下载文件并修改文件名，在a标签上面添加download属性 var link = document.createElement('a'); link.href = file.url; link.download = file.name; link.target="_blan
阅读全文
标签下载文件重命名失败，download 无效
摘要：最近用到<a>标签实现文件下载并对文件进行重新命名，遇到了一些问题，文件重命名一直失败，所幸最终还是解决了，在此记录一下，避免后来者踩坑。 HTML <a> 元素可以创建一个到其他网页、文件、同一页面内的位置、电子邮件地址或任何其他URL的超链接，其中href和download是我们下载文件所需要的
阅读全文
JS中的递归
摘要：递归基础 递归的概念 在程序中函数直接或间接调用自己 直接调用自己 间接调用自己 跳出结构,有了跳出才有结果 递归的思想 递归的调用,最终还是要转换为自己这个函数 如果有个函数foo,如果他是递归函数,到最后问题还是转换为函数foo的形式 递归的思想就是将一个未知问题转换为一个已解决的问题来实现 f
阅读全文
substr与substring的区别
摘要：语法：substr(start [，length]) 第一个字符的索引是0，start必选 length可选 substring(start [, end]) 第一个字符的索引是0，start必选 end可选 相同点：当有一个参数时，两者的功能是一样的，返回从start指定的位置直到字符串结束的子串
阅读全文
函数式注释、文件头部注释
摘要：代码注释的魅力所在 标准函数式注释 /*方法说明 *@method 方法名 *@for 所属类名 *@param{参数类型}参数名 参数说明 *@return {返回值类型} 返回值说明 */ 文件头部注释 /* * @Description: In User Settings Edit * @Au
阅读全文
slice（）与splice（）的区别
摘要：一、slice(start，end) 从start开始截取到end但是不包括end返回值为截取出来的元素的集合原始的数组不会发生变化 //例子 var arr1 = [1,23,44,55,66,77,888,"fff"]; var arr2 = arr1.slice(2,4) //从index为2
阅读全文
纯前端跨域下载pdf链接文件解决方案
摘要：一,介绍与需求 1.1,介绍 XMLHttpRequest 用于在后台与服务器交换数据。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新。 问题:Chrome 会自动调用内置的 pdf 阅读器打开 1.2,需求 在谷歌(Chrome)浏览器中,使用a标签属性download下载pdf
阅读全文
点击a标签下载当前链接的图片&&js 通过 blob 类文件对象下载图片，修改图片保存的名字（兼容式写法）
摘要：若想点击a标签就下载当前链接的图片，首先必须文件是同源的，在a标签上增加download属性，才能触发点击下载的效果，若不同源的话则变成在当前页面打开该图片了。 若想要下载不同源的文件，有一种思路是将图片转为base64再赋值给a标签，这样点击后应该就能够下载了 问题：通过a标签下载图片，只有谷歌浏
阅读全文
javascript 自动触发 按键盘操作 trigger
摘要：回车键 keyCode 13 HTMLElement.prototype.pressKey = function(code) { var evt = document.createEvent("UIEvents"); evt.keyCode = code; evt.initEvent("keydow
阅读全文
利用Javascript检测开发者工具Devtools是否打开
摘要：function checkDevTools(options) { const isFF = ~navigator.userAgent.indexOf("Firefox"); let toTest = ''; if (isFF) { toTest = /./; toTest.toString = f
阅读全文
爬虫笔记之JS检测浏览器开发者工具是否打开
摘要：在某些情况下我们需要检测当前用户是否打开了浏览器开发者工具，比如前端爬虫检测，如果检测到用户打开了控制台就认为是潜在的爬虫用户，再通过其它策略对其进行处理。本篇文章主要讲述几种前端JS检测开发者工具是否打开的方法。 一、重写toString() 对于一些浏览器，比如Chrome、FireFox，如果
阅读全文
indexOf与includes的区别
摘要：自从ES6部署includes方法，好像indexOf就失去了它的用武之地了，到底indexOf有什么不足，这篇文章就要来介绍这两个方法之间的区别。 看一个函数，先看他们的返回值，一个是返回数值型的，一个是返回布尔型的，所以在if条件判断的时候includes要简单得多，而indexOf 需要多写一
阅读全文
ES6数组的解构赋值详解
摘要：数组的解构赋值 基本用法 ES6允许按照一定的模式，从数组和对象中提取值，对变量进行赋值，这被称之为解构(Destructuring) // 以前为变量赋值，只能直接指定值 var a = 1; var b = 2; var c = 3; // ES6允许写成这样 var [a,b,c] = [1,
阅读全文
require('./expample.js).default详解
摘要：最近总碰到类似于 var a = require('./expample.js).default 这样的代码，感觉很奇葩，总结一波。 为什么会出现这个问题? import 是静态编译的，而 require 可以动态加载，也就是说你可以通过判断条件来决定什么时候去 require ，而 import
阅读全文
extends和implements区别
摘要：extends和implements区别 extends与implements的不同 1、在类的声明中，通过关键字extends来创建一个类的子类。 一个类通过关键字implements声明自己使用一个或者多个接口。 extends 是继承某个类, 继承之后可以使用父类的方法, 也可以重写父类的方法
阅读全文
JS 统计一个字符串中出现次数最多字母
摘要：一个感觉很平凡的，常常在面试中出现的题目，拥有各种实现形式也就显示出 JS 水平的不同。 首先，简单的来一个基本思路的计算方式： function maxNumLetter( str ){ var lettersObj = {}, len = str.length, letter, letterNu
阅读全文
