javascript
关注
分享
扫一扫
文章平均质量分 67
JavaScript
自夏
这个作者很懒，什么都没留下…
展开
-
Typescript本地浏览器调试
浏览器运行TS原创 2022-08-27 23:18:24 · 817 阅读 · 0 评论 -
H5语音合成播放
speechSynthesis，SpeechSynthesis.paused，SpeechSynthesis.pending，SpeechSynthesis.speaking， speechSynthesis.getVoicesSpeechSynthesisUtterance，SpeechSynthesisUtterance.lang，SpeechSynthesisUtterance.rate，SpeechSynthesisUtterance.pitch，SpeechSynthesisUtterance原创 2022-08-02 17:23:49 · 1852 阅读 · 0 评论 -
setInterval 定时任务注意事项
使用场景 **在 大量setInterval使用或者大量页面轮询或者指定定时任务时，把握不了 setInterval 里面的细微时差就很容易导致 setInterval 导出跳，根本使用 clearInterval 停止不完当前时间setInterva **在前端做定时任务时，有二种方案可以选择第一种是使用原生JS 提供的 setInterval 或者 setTimeout第二种是使用第三方库 cron本文章主要讲的使用 setInterval 来做定时任务封装setInterval函数原创 2022-05-05 09:52:36 · 1393 阅读 · 0 评论 -
Object.defineProperty 以及 Proxy对比和基本语法 实干vue3数据响应
学习目标：Object.defineProperty() 方法会直接在一个对象上定义一个新属性，或者修改一个对象的现有属性，并返回此对象symbol 是一种基本数据类型,Symbol()函数会返回symbol类型的值，该类型具有静态属性和静态方法,每个从Symbol()返回的symbol值都是唯一的。一个symbol值能作为对象属性的标识符 系列文章目录提示：这里可以添加系列文章的所有文章的目录，目录需要自己手动添加例如：第一章 Python 机器学习入门之pandas的使用提示：写完文原创 2021-12-17 09:58:28 · 634 阅读 · 0 评论 -
原生JS批量创建DOM性能对比，以及事件代理绑定绑定事件
<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title> 事件代理 </title> </head> <script type="text/html" id="enment"> <li> {{num}} <button>按钮</button> </li> </script&原创 2021-12-01 23:13:40 · 466 阅读 · 0 评论 -
Promise完美过渡到async/await
async/await被称作为异步最终的写法async function 关键字用来在表达式中定义异步函数。当然，你也可以用 异步函数语句 来定义。async函数是使用async关键字声明的函数。 async函数是AsyncFunction构造函数的实例AsyncFunction 构造函数用来创建新的 异步函数 对象，JavaScript 中每个异步函数都是 AsyncFunction 的对象。async的基本语法async function getdata (params) { ret原创 2021-06-09 23:20:41 · 1072 阅读 · 0 评论 -
深入理解Promise以及最新方法
unhandledrejection 继承自 PromiseRejectionEvent，而 PromiseRejectionEvent 又继承自 Event。因此unhandledrejection 含有 PromiseRejectionEvent 和 Event 的属性和方法。原创 2021-06-03 22:50:35 · 302 阅读 · 0 评论 -
Nodejs前后端数据加密传输二种方案
项目场景：在前后端分离，前端使用Axios 或者是Ajax 来发送数据和接收数据,对应非程序人来说就没有有，应为他们也不懂，对应懂程序地来说 直接F12 查看浏览器地请求（Network）来查看请求数据，和返回数据，对应我们本身开发者来说无疑是在当中众多同行种裸奔问题描述： 为了防止数据传输过程中裸奔 进行数据加密传输技术栈（ES6+语法）NodeJS后端 Typescript Express前端 uni-app加密方法 使用原生JS数据加密（前后端统一方法进行转码解码）TS兼容JS语法原创 2021-05-19 16:43:49 · 1978 阅读 · 5 评论 -
async/await错误捕获
在ES7还没有出来的时候通常使用Promise.then 方法来接收 返回的值,Promise.then 有二个回调，第一个是 获取参数的回调，第二个是错误的回调 来捕获Promise.reject的错误Promise.catch 同样能够捕获Promise.reject 抛出的错误Promisefunction func(data) { return new Promise((resolve, reject) => { data ? resolve(data) : rej.原创 2021-05-18 11:33:48 · 4719 阅读 · 2 评论 -
ES6箭头函数
基本语法 (=>)var func = p=> p// es5var func = function (p) { return p}如果箭头函数不需要参数或需要多个参数，就使用一个圆括号代表参数部分,一个参数只用一个变量来接收不需要花括号。不需要参数var func = ()=>{}//es5var func = function(){return 10*10} 多个参数const func = (num,num1)=> num+num1var fun原创 2021-04-19 16:07:18 · 163 阅读 · 0 评论 -
ES6解构赋值，对象结构，数组结构，函数参数结构
简单对象 和 数组的结构赋值如果解构不成功，变量的值就等于undefined对象var { foo, bar } = { foo: "aaa", bar: "bbb" }; foo // "aaa" bar // "bbb"对象的属性没有次序，变量必须与属性同名，才能取到正确的值。var obj = { p: ['Hello', { y: 'World' } ] };var { p: [x, { y }] } = obj; x // "Hello" y // "World"p原创 2021-04-15 15:22:41 · 517 阅读 · 0 评论 -
不常用的for-of循环
什么是 for-fo 是一个可迭代对象 迭代对象具有 Symbol.iterator 属性 是一种与迭代器相关的对象Symbol.iterator 通过指定的函数可以返回一个早哟用与附属对象的迭代器 在ES6中所有的集合 （Set Map 集合）字符串都是可迭代对象 这些对象都有默认的迭代器 在ES6中的for-of 循环中需要用到迭代对象的一些功能生成器默认都有 Symbol.iterator 属性 因此所有通过生成器创的迭代对像都是可以迭代对象在for-of 循环每一次都会调用可迭代对象..原创 2021-04-07 23:21:04 · 307 阅读 · 0 评论 -
迭代器（Iterator）和生成器 (Generator)
什么是迭代器？迭代器是一种特殊的对象 (迭代器是一个对象)是一些专门为迭代过程设计的的专有接口 所有迭代器都next()方法每一次调用都返回一个结果对象有二个属性值 一般都猜得到有 value 表示返回下一个的对像，另一个是doen 是一个布尔值 当没有数据值返回true迭代器还会返回内部指针，会用来指向集合中的位置，每一次调用next()方法时 都会返回下一个可用的值，如果最后一个值返回在调用next()方法那么返回对象属性done的值为true 属性vauel则包含最终返回的值，这个返回值不原创 2021-04-06 23:12:17 · 243 阅读 · 0 评论 -
Set与WeakSet 和 Map WeakMap
Set 集合是一种无重复的元素的列表，开发者不会像访问数组那样逐一访问每一个原属 通常的做法是，给定某值是否在集合种只要Set 实例引用存在就不会被垃圾回收机制回收 Set 类型可以看成为强引用类型Set 和 WeakSet 其实是跟数据类型，但是跟数组有区别， 使用方法也有区别，作用也有区别/**add: ƒ add() 添加clear: ƒ clear() 删除所有delete: ƒ delete() // 删除某一个entries: ƒ entries()forEach: .原创 2021-04-06 22:46:18 · 201 阅读 · 0 评论 -
什么是迭代器(Iterator)和生成器(generator)
/** * 什么是迭代器？ * * 迭代器是一种特殊的对象 (迭代器是一个对象) * 是一些专门为迭代过程设计的的专有接口 所有迭代器都next()方法 * 每一次调用都返回一个结果对象有二个属性值 一般都猜得到有 value 表示返回下一个的对像，另一个是doen 是一个布尔值 当没有数据值返回true * 迭代器还会返回内部指针，会用来指向集合中的位置，每一次调用next()方法时 都会返回下一个可用的值，如果最后一个值返回在调用next()方法那么返回对象属性done的值为true 属性v原创 2021-08-13 13:34:10 · 258 阅读 · 0 评论 -
JavaScript提取身份证号信息包含，省，市，区，生日，性别，属像，星座，年龄
let getProvinceAndCity = (uuid) => { if (!uuid || uuid.length < 18 || uuid.length > 18) return Error('身份证号错误!'); const provinceNo = uuid.substring(0, 2), //提取前二位区分身份 cityNo = uuid.substring(0, 4) + '00', //提取前四位区分市 countyNo = uuid.sub原创 2021-03-17 13:44:25 · 891 阅读 · 0 评论 -
JavaScript高级进阶之设计模式 抽象工厂模式
// 抽象工厂模式/** * @param {Object} fun 需要抽象的方法体 函数 * @param {Object} funName 抽象方法的函数名称 */let vehicleFactory = function(fun,funName){ // console.log(fun,funName); // console.log(vehicleFactory[funName]); // vehicleFactory.xxx = function（）{} if(ty原创 2021-03-07 22:09:44 · 160 阅读 · 0 评论 -
JavaScript高级进阶之设计模式 简单工厂模式
简单工厂模式也称静态工厂方法 有工厂对象决定创建某个对象得实例（比如我是印刷厂 我要印书，我只要书的内容，就可生产了）下面以验证提示框举例var verify = function (txt){ this.txt =txt}//标题verify.prototype.titlemsg = function(txt){ this.titlemsg = txt console.log(this.titlemsg); return this}//描述verify.prototype.m原创 2021-03-05 23:18:18 · 131 阅读 · 0 评论 -
Function call，apply， bind 使用详解
call() 可以改变函数的this指向,可以调用函数 也可以继承函数apply(),接收多个参数 第一个this，第二个参数为数组bind() 不会执行函数,但会返回调用函后的this指向 也可以传参数function as(){console.log(this);console.log('11');}as.call() //函数调用 //第一次调用指向windowlet obj = {a：1，b:2};as.call(obj) //this指向到 objapply(原创 2021-03-05 11:29:25 · 1101 阅读 · 0 评论 -
JavaScript高级进阶之继承 类式继承 构造函数 组合继承 原型式继承
ES5// 声明父类function superClass(){ this.suerValue = true}superClass.prototype.getsuperVal = function(){ return this.suerValue;}// 声明子类function sonClass(){ this.subVaue = false;}//继承父类sonClass.prototype = new superClass();//为子类添加共有方法so原创 2021-03-04 22:28:56 · 172 阅读 · 4 评论 -
js数据类型判断三种方法各自优缺点
typeof检测方法主要用于检测基本类型.缺点: 无法区分 引用类型 引用类型：object。里面包含的 function、Array、Date。优点 方便快捷 代码量少 区分基本类型正常 基本类型:Number、String、Boolean、Null、undefined、object、symbol、bigInt。typeof(123) //numbertypeof('123')// stringtypeof({})//objecttypeof([])//objec原创 2021-02-23 14:01:56 · 512 阅读 · 0 评论 -
JavaScript 文件下载，二进制下载，文本下载的几种方式
js 文件下载，js 下载二进制数据，js j解析二进制内容，URL.createObjectURL()原创 2020-12-17 10:57:56 · 3856 阅读 · 0 评论 -
js 事件循环 Event loop 微任务以及宏任务，事件循环，js 种的那些方法是微任务和宏任务
js 种的那些方法是微任务和宏任务微任务方法浏览器Node描述（用法）Promise （prototype原型链下方法都是微任务）then catch finally√√解决异步问题async / await (async 函数返回的是Promise.resolve 的数据 ，await 接收Promise.then()的数据 )√√解决异步回调问题MutationObserver√√监视对DOM树所做更改可以 可以监听DO原创 2021-01-25 17:27:34 · 131 阅读 · 0 评论 -
sessionStorage 或 localStorage 数据加密(转码)存储，获取时解码返回存储的明文
知识点，atob，btoa，encodeURIComponent，decodeURIComponent因为直接用atob会导致汉字乱码，btoa它来解码的时候数据不对encodeURIComponent 先把数据转换一次，把汉字转译decodeURIComponent 把转译的数据转回来，就解决了atob 方法汉字乱码问题~~下面是代码~~const Session = { /** * 加密数据 * @param {any} data 转为base64数据原创 2021-01-25 17:16:08 · 4492 阅读 · 3 评论 -
JavaScript 等待 body,frame,frameset,iframe,img,link,script,style加载完成操作
body,frame,frameset,iframe,img,link,script,style 标签有 onload事件 通过监听以上的 onload事件 ，可以达到 对于标签加载完成后在做一些事情// 查看图片的所有属性 以及事件console.dir(document.querySelector('img'))...原创 2020-12-10 21:39:32 · 444 阅读 · 0 评论 -
JavaScript中的location对象(浏览器地址栏URL)
JavaScript高级程序第三版 locatin 对象location 提供当前窗口加载文档有关的信息插入链接与图片链接: MDN Location.在浏览器打赢的 Location 对象如下###下面让我们看看这个属性的一些描述喝应用场景// An highlighted blockvar foo = 'bar';location 的一些属性属性名例子说明host‘#contents’返回url hash (#号后跟的字符====(vue的路由模式.原创 2020-12-09 23:15:35 · 527 阅读 · 0 评论 -
vue 引用本地 iframe 自定义事件刷新iframe页面
主要获取iframe里面的文档对象，就可以任意操作iframe的内容//contentDocument 属性能够以 HTML 对象来返回 iframe 中的文档。可以通过所有标准的 DOM 方法来处理被返回的对象。//querySelector 选择器 当然也可用 id 或者class 等选着器代替document.querySelector('iframe').contentWindow.location.reload();...原创 2020-07-08 16:53:16 · 4219 阅读 · 1 评论 -
JavaScript字符串总结
** * 字体变大 */big: ƒ big()/** * 闪动文本 */blink: ƒ blink()/** * 字体加粗 */bold: ƒ bold()/** * 方法可返回指定位置的字符。第一个字符位置为 0, 第二个字符位置为 1,以此类推. */charAt: ƒ charAt()/** * 方法可返回指定位置的字符的 Unicode 编码。字符串中第一个字符的位置为 0， 第二个字符位置为 1，以此类推 */charCodeAt: ƒ charCod原创 2020-07-08 16:44:18 · 151 阅读 · 0 评论 -
JavaScript 数组方法使用总结包含ES6
参数为 单个值, 多个以逗号分开, 也可是一个数组使用展开运算concat: ƒ concat() //合并数组/** * target 必需。复制到指定目标索引位置。 start 可选。元素复制的起始位置。 end 可选。停止复制的索引位置 (默认为 array.length)。如果为负值，表示倒数。 * */copyWithin: ƒ copyWithin(target, start, end) 赋值数组, /** * 创建一个可迭代对象 entries() 方法返回一个数组的.原创 2020-07-08 16:43:13 · 194 阅读 · 0 评论 -
JavaScript中的循环总结
for () {}效率最高let a = [1, 2, 3, 4, 45, 44, 65, 65, ]for (let i = 0; i < a.length; i++) { console.log(a[i])}forEach() 方法正在操作的数组callback 为数组中每个元素执行的函数， 该函数接收一至三个参数：currentValue 数组中正在处理的当前元素。index 可选 数组中正在处理的当前元素的索引。array 可选thisArg 可选 可选参数。 当执原创 2020-07-08 16:39:40 · 198 阅读 · 0 评论 -
JavaScript 立即执行函数 不让他立即执行里面的方法
// 立即执行函数的好处，减少了全局变量的污染 jq里面大量使用，保证变量不必污染(function (){ function obj(){ console.log('我是obj') } //此处把obj函数放入到window全局里面，在后面使用的时候 就可以直接使用obj方法 window.obj=obj; })()obj();...原创 2020-05-25 14:12:48 · 764 阅读 · 0 评论 -
ES5默认参数和ES6默认参数以及对象和数组结构
===========默认参数ES5 var a = a || 9 //当a是null 或者是 undefined a的值就为9>>>函数中function a(a , b ) { >>>ES5 var a1 = a || 0; var a2 = b || 1 return a1+a2;} ES6function b( a =...原创 2020-05-08 11:01:25 · 433 阅读 · 0 评论 -
JavaScript 页面元素插入方法总结（欢迎补充）
JavaScript 页面元素插入innerHTML,appendChild,insertBefore,insertAdjacentHTML总结1.通过某一个id直接 innerHTML 或者 innertext这种方式是最原始的html替换，也是空标签替换内容场景 使用JavaScript开发动态网页或者是绑定数据时常用document.getElementById('xx').inn...原创 2020-05-06 11:34:12 · 1910 阅读 · 0 评论 -
vue使用h5puls做APP自动更新
首先我们先来理清思路在来一步步的做 确保当前有h5puls的第三方库 或者使用HBuilder X 或者HBuilder 来打包webapp APK中就自动集成了h5puls（或者可以写道其他事件里面触发检查更新下载版本）这里APP自动更新全部都在App.vue 页面完成h5puls官方文档先检查安装的apk的版本号，文档链接Runtime使用 plus.runtime.getPro...原创 2020-04-30 11:47:07 · 3431 阅读 · 1 评论 -
JavaScript ES6对象简写
ES5 写法function obj(q,w,e,r,t,y){ //es5 let obj = { q:q, w:w, e:e, r:r, t:t, y:y, ho:function(){ console.log('我是ho方法') ...原创 2020-04-30 10:26:45 · 1618 阅读 · 1 评论 -
js阻止动态插入HTML(防止动态DOM插入广告)
主要使用用了js的MutationObserver的API接口提供了监视对DOM树来实现页面DOM的监听MutationObserver文档: MutationObserver.废话不多说上代码```javascript// 阻止后续DOM加载class StopLoadingDOM { stop(DOM = 'body', stop_time = 60000) { //使用了E...原创 2020-04-30 10:14:42 · 1176 阅读 · 0 评论 -
JavaScript使用Promise封装Ajax
111111111原创 2020-04-27 13:22:30 · 235 阅读 · 0 评论