JavaScript
印第安米饭
这个作者很懒,什么都没留下…
展开
-
vue原理之Watcher:vue的watch和$watch的原理,以及其背后new Watcher的流程
两个参数:第一个参数两种可能:传入被观察对象表达式(字符串),比如'a,b,c' , '$route'如果表达式无法表示需要观察的内容,可以通过函数返回,比如:this.a + this.b第一个参数干什么用的?通过vue源码可得,new Watcher的流程:第一步:拿到第一个参数,如果是函数,直接拿到函数,如果不是函数,转换为函数(parsePath),这个作为getter,先不调用,只备用 // parse expression for getter if (typeo原创 2020-07-14 22:36:13 · 1298 阅读 · 0 评论 -
为什么操作DOM会影响性能?
其实DOM并不慢。添加和删除DOM节点仅需进行内存中 几次指针交换,只不过是在JS对象上设置属性而已。但是,布局缓慢。当你以任何方式操作DOM 时,你会在整个树上设置一个标记,以告诉浏览器它需要操作哪里。当JS将控制权交还给浏览器时,它会调用其布局算法(或更确切地说,会调用其CSS recalc算法,然后进行布局,然后重新绘制,然后重新合成)以重新绘制屏幕。...原创 2020-02-01 20:36:09 · 541 阅读 · 0 评论 -
x-www-form-urlencoded到底是什么?
概述:x-www-form-urlencoded纸面翻译即所谓url格式的编码,是post的默认Content-Type一、位置:请求头內的Content-Type字段里,二、写法:Content-Type:application/x-www-form-urlencoded三、用处:get请求的请求体格式是什么?get请求是拼接在url后面请求的,一般如此username=to...原创 2019-12-11 23:14:30 · 36701 阅读 · 0 评论 -
微信小程序如何返回上一页并传参
itemClick: function(e) { let pages = getCurrentPages(); let prevPage = pages[pages.length - 2]; prevPage.setData({ message: e.currentTarget.dataset.ms...转载 2019-11-03 00:22:23 · 1191 阅读 · 1 评论 -
JSON.stringify常用用法、可转换类型、灵活用法
能处理的(安全JSON):字符串、数字、布尔值和null的JSON.stringify()转换以后,结果都是字符串('aa','33','null','true')不能处理的(不安全JSON):undefined,function,symbol,循环引用的对象(自己里面引用了自己)2、JSON.stringify在转换之前,如果传入对象中的有.toJSON()方法,会先调用toJSON()...原创 2019-07-16 01:19:57 · 1038 阅读 · 0 评论 -
20个js方法原理的实现
1. 实现一个call函数// 思路:将要改变this指向的方法挂到目标this上执行并返回Function.prototype.mycall = function (context) {if (typeof this !== ‘function’) {throw new TypeError(‘not funciton’)}context = context || windowcon...转载 2019-07-30 14:19:35 · 163 阅读 · 0 评论 -
babel从入门到进阶只需搞定这几个包
安装babel:babel目前需要安装 @bable/core 和 @babel/preset-env ,在webpack上还需要安装babel-laoder@bable/core :这个比较好理解,就是babel的核心文件@babel/preset-env:babel预置器,这个预置器大概有一下几种版本:es2015es2016es2017 env //包括上...原创 2019-08-04 22:59:15 · 576 阅读 · 0 评论 -
npm包@babel/core、@babel/preset-env中的@是什么意思
看下官方文档:这个@babel是私有包的表示方法(私有又分公开私有和私密私有,私密私有是要收费的)翻译过来就是 @后面接的是个scope 一个作用区域,也可以是说这个包的归属者,防止包名称被提前占用,比如防止以前 babel-core 这个包名可能被人提前占用了,而babel官方还想使用那就可以把包放在自己的作用区域下,@组织名(babel)/属于该组织的包名(core)...原创 2019-08-04 23:23:34 · 2701 阅读 · 0 评论 -
javascript:parseInt用法,特殊用法,进制转换
parseInt( string,radix )功能:将 [ 指定进制的 ] 字符串转换为十进制整数型 参数:1、string: 要解析的字符串,类型:String2、radix: 以什么进制解析该字符串,不传和传0结果一样,类型:Number 返回值:1、第二个参数传0和不传一样:2、返回NaN的几种情况:3、特殊字符串转换:以0x开头的字符串,p...原创 2019-07-23 01:28:43 · 796 阅读 · 0 评论 -
webpack4之splitChunks和runtimeChunk
为什么要用splitChunkswebpack4之前使用CommonsChunkPlugin提取公共代码,但是CommonsChunkPlugin存在以下三个问题:1:产出的chunk在引入的时候,会包含重复的代码;2: 无法优化异步chunk;3:高优的chunk产出需要的minchunks配置比较复杂。为了解决这些问题,webpack4中用splitchunks替代了CommonsC...转载 2019-08-09 15:43:40 · 4993 阅读 · 0 评论 -
工作总结
1、如何查找表格:URL:/getReportTable/report_dws_wdtb_citygrid_od_msk_d.do?typechart=1&fieldNameEN=requestType1,requestType2,dts&fieldVal=1,dws_wdtb_citygrid_od_msk_d,20190320-20190320针对于当前接口:repor...原创 2019-08-23 18:47:01 · 118 阅读 · 0 评论 -
echarts之map常用属性
option = { color: ['#B0EEF4', 'yellow', '#d8e050'], tooltip: { trigger: 'item', // 数据项图形触发方式,主要在散点图,饼图等无类目轴的图表中使用。 formatter: format //函数,提供参数params,返回的是tip上的h...原创 2019-02-14 15:29:26 · 13703 阅读 · 2 评论 -
JS判断是否是移动端
let isMobile = /Android|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent);原创 2019-02-12 17:29:50 · 2117 阅读 · 0 评论 -
JavaScript原生ajax(XMLHttpRequest对象)用法
传统方法的缺点:传统的web交互是用户触发一个http请求服务器,然后服务器收到之后,在做出响应到用户,并且返回一个新的页面,每当服务器处理客户端提交的请求时,客户都只能空闲等待,并且哪怕只是一次很小的交互、只需从服务器端得到很简单的一个数据,都要返回一个完整的HTML页,而用户每次都要浪费时间和带宽去重新读取整个页面。这个做法浪费了许多带宽,由于每次应用的交互都需要向服务器发送请求,应用的响应...转载 2018-10-18 13:12:09 · 667 阅读 · 0 评论 -
HTML5 的Audio对象操作
一个audio对象就是普通的dom对象 比其他的dom对象多出一些自己独有的属性方法和事件,下面介绍一下他常用的属性、方法和事件自己初步接触html5的新属性audio对象,做的一个简易的音乐播放器,大家有兴趣可以查看,一起讨论学习,有些功能尚未完善。。。敬请谅解!模拟音乐播放器//Audio的代码格式<audio id="audio"> <s...转载 2018-10-18 21:24:26 · 3149 阅读 · 1 评论 -
获取元素到页面最左侧的距离(滑块)
主要用到offsetParent function getElementLeft(element){ var actualLeft = element.offsetLeft; var current = element.offsetParent; while (current !== null){ actualLeft += current.offsetL...原创 2018-10-19 18:27:40 · 6072 阅读 · 0 评论 -
JavaScript线程问题需要注意的情况:
1、避免编写计算密集的前端代码。2、使用异步Ajax。3、避免编写一个需要较长时间来执行的JS代码,比如生成一个大型的表。遇到这种情况,可以分批执行,比如用setInterval来每秒生成20行,或是用户向下拖动滚动条时候再继续产生新的行。4、在页面初始化时候不要执行很多的初始化代码,否则会影响页面渲染变慢。一些不需要立即执行的代码可以在页面渲染完成之后再执行,比如绑定事件,生成菜单之类的控...转载 2018-10-17 11:30:57 · 163 阅读 · 0 评论 -
Javscript笔记之Date对象
new Date( year, month-1, date ) month从0开始,比实际月份少1例如:new Date( 2018, 3, 5 ) =&amp;amp;gt; 2018年4月5日new Date参数越界自动进位退位getFullYear() / getMonth() / getDate()getMonth得到的是实际月份减一的结果getDay() :获取当前日期的星期...原创 2018-10-22 15:52:54 · 328 阅读 · 0 评论 -
ES6的for...of循环常用
for(let index of [‘a’,‘b’,‘c’].keys()) //遍历数组的元素索引for(let value of [‘a’,‘b’,‘c’].values()) //遍历数组的元素值 需polyfill兼容for(let [index,value] of [‘a’,‘b’,‘c’].entries()) //遍历数组的index和value...原创 2018-10-22 16:36:24 · 617 阅读 · 0 评论 -
JavaScript-事件之addEventListener()参数具体意义
很久以前,addEventListener() 的参数约定是这样的:addEventListener(type, listener, useCapture)后来,最后一个参数,也就是控制监听器是在捕获阶段执行还是在冒泡阶段执行的 useCapture 参数,变成了可选参数(传 true 的情况太少了),成了:addEventListener(type, listener[, useCaptu...转载 2018-10-24 20:23:11 · 8875 阅读 · 0 评论 -
Web动画优化之requestAnimationFrame的使用(翻译)
本文翻译自:https://css-tricks.com/using-requestanimationframe/ ,如有侵权,请联系我!我先来一句话概括一下:这个方法就是让动画按照屏幕刷新频率执行,这样就可以显得很流畅。引入以前JavaScript只有一种时间间隔循环的方式:setInterval()。如果你需要以特别快的速度(不是像for循环那样极致快)重复一些内容,你可以使用set...翻译 2018-11-25 21:14:07 · 370 阅读 · 0 评论 -
前端常用正则表达式
// 常用的正则规则// eslint-disable-next-lineexport const regExpConfig = { IDcard: /^[1-9]\d{7}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}$|^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}([...原创 2018-11-27 18:37:37 · 177 阅读 · 0 评论 -
JS和CSS变量共享、主题颜色设置
JS 和 CSS 变量共享。关于 JS 和 Sass/Less 变量共享,我们摸索出了自己的解法:// src/styles/variables.jsmodule.exports = { // 主颜色 'primary-color': '#0C4CFF', // 出错颜色 'error-color': '#F15533', // 成功颜色 'success-color'...转载 2019-02-12 14:54:52 · 1122 阅读 · 0 评论 -
《你不知道的JavaScript》读书笔记(一):变量的声明和变量提升
铺垫:我们要知道编译器是在代码执行前进行编译的,编译相当于JS在 拿到“考卷(也就是代码)”之后先进行的审题,而且是审完整张卷子;审完题也就是编译器编译完成之后需要 由JS引擎来做题(执行);所以 编译器负责审题(编译代码),JS引擎负责做题(执行代码)名词解释:当前作用域:作用域分为全局和局部,局部作用域一般指函数内我们再来说说变量声明在js编译器和引擎眼里的原创 2017-04-23 20:30:33 · 164 阅读 · 0 评论