
JavaScript
DriveMyLife
纸上得来终觉浅,绝知此事要躬行。
展开
-
JavaScript、TypeScript 的一些基本补充
1、switch,可以使用 { } 包装你的case,用来在不同的case状态中复用变量名称:let key = "aa2"switch (key) { case "aa1": { let a = "111" console.log(a); break; } case "aa2":{ ...原创 2020-03-04 15:07:43 · 336 阅读 · 0 评论 -
JavaScript 闭包
先补充点知识:判断对象里是否存在某个key:let arr = { '1,2,3':12122, 'dfdsf,dsfds,dd':"dfsdf"}if('1,2,3' in arr){ }1、使用闭包来:延续局部变量的寿命:使用img对象进行数据上报时,如下:let report = function(src) { let img ...原创 2020-03-03 16:51:34 · 220 阅读 · 0 评论 -
call和apply
ESAMScript3 给 Funciton的原型定义了两个方法:Function.prototype.callFunction.prototype.apply在实际开发中,特别是一些函数式风格的代码编写中,call和apply方法有为有用。是成为一名真正的js程序员的重要知识。1、call和apply的区别apply接受两个参数,第一个参数指定了函数体内this对象的指向...原创 2020-03-03 15:12:15 · 184 阅读 · 0 评论 -
JavaScript一些操作
1、重写toString方法:Object.prototype.toString = function(){ return JSON.stringify(this);};原创 2020-02-29 17:52:23 · 1111 阅读 · 0 评论 -
Promise 汇总
1、概念Promise表示一个异步操作的最终结果。可以将Promise理解为一个状态机,它存在下面三种状态,并在某一时刻只能有一种状态:Pending :表示还在执行Fulfilled(或resolved):执行成功Rejected:执行失败。一个Promise是对一个操作(通常是一个异步操作)的封装,异步操作有等待完成、成功、失败三种可能结果,对应了Promise三种...原创 2020-02-29 10:24:11 · 248 阅读 · 0 评论 -
js对象浅拷贝问题
let aa = [{'id':111,"name":"aa1"},{'id':222,"name":"aa2"}]let arr = []var obj = { id: "", name:""}aa.forEach((item) => { obj.id = item.id; obj.name = item.name; arr.push(J...原创 2020-02-29 09:53:46 · 225 阅读 · 0 评论 -
javascript书签工具
通过使用有道云笔记的网页剪切板,感觉这个书签工具,挺有趣:界面:书签代码:javascript: (function () { try { var a = document.createElement('SCRIPT'); a.type = 'text/javascript', a.src = '//note.youdao.com/yws/...原创 2019-05-09 16:32:40 · 687 阅读 · 0 评论 -
Navigation Timing获取页面加载各个阶段所需时间
最近接触到了一个性能优化方面为我们提供精准数据的工具,Navigation Timing,本想从网上获取他更详细的信息,但搜索到的内容绝大部分都是国外的文章,遂决定写一遍具体分析的文章。之前测试页面加载的时间都是在相应的位置打Date.now(),通过计算时间差来实现。这样的做法有很多弊端。需要在许多地方添加额外的代码 记录的时间不准确 测试完之后需要找到每一个地方注释or删除,...转载 2019-05-13 11:05:05 · 519 阅读 · 0 评论 -
js对象转json
let obj = { common:{a:1,b:2}, mouse:[], click:[]}obj.mouse.push({a:1,b:2})obj.mouse.push({a:11,b:22})obj.mouse.push({a:12,b:23})obj.mouse.push({a:13,b:24})console.log(JSON.stringi...原创 2019-05-23 23:24:53 · 19890 阅读 · 0 评论 -
javascript函数节流(throttle)与函数去抖(debounce)
一、前言 以下场景往往由于事件频繁被触发,因而频繁执行DOM操作、资源加载等重行为,导致UI停顿甚至浏览器崩溃。 1. window对象的resize、scroll事件 2. 拖拽时的mousemove事件 3. 射击游戏中的mousedown、keydown事件 4. 文字输入、自动完成的keyup...转载 2019-06-24 14:14:22 · 227 阅读 · 0 评论 -
埋点数据统计
京东的做法:<script> var jaq = jaq || []; jaq.push(['account','JA2015_113197']); //必填,站点编号 jaq.push(['domain','.jd.com']); //必填,站点一级域名(如:jd.com/jd.ru/jd.hk/jd.id) jaq.push(['erp_a...转载 2019-06-27 18:13:27 · 828 阅读 · 0 评论 -
行为分析工具开发笔记
1、客户端设备信息:浏览器端: navigator.userAgent.toLowerCase() //获取浏览器及版本,如chrome 64.2121 let ua = navigator.userAgent.toLowerCase(); let re =/(msie|firefox|chrome|opera|version).*?(...原创 2019-06-28 19:13:58 · 341 阅读 · 0 评论 -
cookie字符串转对象
从浏览器copy出来的cookie是一段字符串,转为puppeteer可以识别的对象呢?,比较简单:let cookieStr = `__editor_pc_driver_show__=true; shshshfpa=29e7a6c2-25d6-df76-d181-7986cdd4a5e4-1553562310; shshshfpb=g%207BzK%2FEySratP1DZuDSKRA%...原创 2019-08-12 08:50:16 · 3202 阅读 · 0 评论 -
html代码重用
需求几个页面需要的头部和底部的内容往往是一样的,这就希望可以只写一段代码作为模板,然后再几个页面中都加载这这个模板。另外,如果需要修改,也只要修改模板就好,所有页面都同时都是新的样式了。通过 JavaScript 来实现能实现上面需求的方法还是不少的,这个比较简单一点,几乎不需要学习的额外知识,只通过2句基本的js语句就能实现。一句写页面html,一句加载js文件执行。暂时先用了这个方法。...转载 2019-04-30 15:51:11 · 1569 阅读 · 1 评论 -
JavaScript 模块化开发
转载 2019-05-05 22:34:52 · 103 阅读 · 0 评论 -
javascript监听用户行为分析
1、oninput事件oninput 事件在用户输入时触发。2、onchange事件监听input事件没法满足type为checkbox和radio的监控,所以需要借助onchange事件来监控。...原创 2019-03-12 12:04:05 · 1777 阅读 · 0 评论 -
如何将input的value值的变化更新到innerHTML?
问题描述:input输入内容,查看html结构,value值仍是默认值,未设置默认值的情况也是空。如果我想获取到这个变化,应该如何处理呢?解决办法:(jquery实现)(function ($) { var oldHTML = $.fn.html; $.fn.formhtml = function () { if (arguments.length) ...原创 2019-03-21 23:10:09 · 2338 阅读 · 0 评论 -
如何从点击的DOM元素获取css selector
大家平时很熟悉通过css selector获取dom对象,如果反过来,如何获取元素对象的selector呢?第一步,先看看谷歌浏览器的Command Line API:通过debug工具,可以coyp的值:Command Line API 包含一个用于执行以下常见任务的便捷函数集合:选择和检查 DOM 元素,以可读格式显示数据,停止和启动分析器,以及监控 DOM 事件。注意...原创 2019-03-18 17:05:52 · 3323 阅读 · 2 评论 -
如何阻止a标签跳转及还原默认跳转事件
两件事:一件是阻止跳转,一件是恢复跳转。1、先看下如何阻止跳转的一种方法,绑定click事件: $("a").click(function(e){ e.preventDefault(); })此时,页面中所有a标签,点击事件失效。2、使某个a标签还原默认事件:$("a").attr("href","xx.html");$("a").unbin...原创 2019-03-25 18:03:07 · 1629 阅读 · 0 评论 -
洗牌算法
1、洗牌算法的概念:Fisher-Yates ,最早提出这个洗牌方法的是Ronald A. Fisher 和 Frank Yates,即Fisher–Yates Shuffle,其基本思想就是从原始数组中随机取一个之前没取过的数字到新的数组中,具体如下:1. 初始化原始数组和新数组,原始数组长度为n(已知); 2. 从还没处理的数组(假如还剩k个)...原创 2019-04-03 23:20:30 · 751 阅读 · 0 评论 -
javascript 数组,对象转json基本用法小结
使用基本函数:JSON.stringify( )、JSON.parse( )1、对象转json://对象转json字符串1let arr1 = {};arr1.name = 'mengmeng';arr1.age = 1;console.log(typeof arr1); //objectconsole.log(JSON.stringify(arr1)); //{"name...原创 2019-04-01 17:15:06 · 299 阅读 · 0 评论 -
使用rrweb实现页面录像
rrweb适用场景:用户行为分析; 远程debug; 录制操作; 实时协作;项目github:https://github.com/rrweb-io/rrweb ,觉得有用,记得帮他加个星~官网:https://www.rrweb.io/开搞!第一步:引入rrweb<script src="https://cdn.jsdelivr.net/npm/rrweb@...原创 2019-04-02 15:27:08 · 18248 阅读 · 10 评论 -
kooboo工具
1、kooboo是什么?Kooboo是一个全新的网络开发工具,只要 HTML/CSS 知识就能做前后台结合的动态网站开发,高级开发采用JavaScript。 管理员可以行内编辑整站内容, 点哪里改哪里。kooboo官网:https://www.kooboo.com/github:https://github.com/Kooboo/Kooboo2、工具界面这些...原创 2019-04-02 18:09:37 · 1149 阅读 · 0 评论 -
一个joke
(图片来自网络)方法一://穷举一些质数function zhishu(num){ let arr = []; for (var i = 100; i < num ; i++) { for (var j = 2; j < i; j++) { if (i%j==0) { ...原创 2019-04-11 21:22:46 · 534 阅读 · 2 评论 -
javascript模块化编程思维学习(一)入门
最近读《javascript核心开发技术解密》,文中大篇幅强调了模块化思维的重要性,很受教。下面借用作者的小例子,进行简单描述下这个重要的编程思维://管理全局状态的模块 var module_status = (function(){ var status = { number:0, color:null ...原创 2019-04-15 17:29:24 · 240 阅读 · 0 评论 -
在chrome开发者工具中观察函数调用栈、作用域链与闭包
在前端开发中,有一个非常重要的技能,叫做断点调试。在chrome的开发者工具中,通过断点调试,我们能够非常方便的一步一步的观察JavaScript的执行过程,直观感知函数调用栈,作用域链,变量对象,闭包,this等关键信息的变化。因此,断点调试对于快速定位代码错误,快速了解代码的执行过程有着非常重要的作用,这也是我们前端开发者必不可少的一个高级技能。当然如果你对JavaScript的这些基...转载 2019-04-10 00:54:33 · 425 阅读 · 0 评论 -
cdn方式使用ivew elementUI
<!DOCTYPE html><html><head> <meta charset="utf-8"> <title>iview example</title> <link rel="stylesheet" type="text/css" href="http://unpkg.com/ivie...原创 2019-05-05 19:11:34 · 986 阅读 · 0 评论 -
JavaScript的一些Array 的内置操作函数
序言:根据我个人的一点技术经验,要想代码写的流利,对这门语言的内置函数的熟练程度,往往作用很大。一,Array对象方法:concat() 连接两个或更多的数组,并返回结果。 join() 把数组的所有元素放入一个字符串。元素通过指定的分隔符进行分隔。 pop() 删除并返回数组的最后一个元素 push() 向数组的末尾添加一个或更多元素,并返回新的长度。...原创 2019-03-08 23:04:30 · 217 阅读 · 0 评论