- 博客(62)
- 收藏
- 关注
RSS订阅原创 前端post下载实现
```javascriptexportService(url,params){ url = this.budService.getBaseUrl()+url; return this.http.post(url,params,{responseType:'arraybuffer',observe:'response'}).toPromise().then(res=>{ ...
2020-02-19 10:16:18
433
原创 angular 如何实现ng-model
最近在用angular5写项目，刚接触angular，他对于我还是陌生的朋友，最近写了一个组件 用到了ng-model的实现，所以这里简单记录下比如要创建一个组件叫my-input1首先在@Component配置中添加encapsulation的配置，它有三个值分别是ViewEncapsulation.None:没有Shadow Dom,样式没有封装，全局可以使用。ViewE...
2019-12-18 16:50:37
444
原创 Vue v-model语法糖理解及解析
v-model可以实现数据的双向绑定，但是到底是如何实现的，为什么是v-model而不是别的k-value 或者 m-value或者其他对于这块的理解一直懵懵懂懂。那么官网是怎么写的呢一个组件上的v-model 默认会利用名为value的prop和名为input的事件就是说v-model就是value和input事件的语法糖:以下都默认props:{value:##}<...
2019-12-18 15:58:52
1085
转载 web性能提升
js优化1 访问全局变量总是比访问局部变量要慢 所以减少全局变量的创建以及访问2 减少eval,with语句的使用，3原生方法更快,尽量使用原生方法4switch语句较快，如果有很多的if-else判断尽量使用switch5JS代码中的语句数量也会影响所执行的操作的速度// 避免var i = 1;var j = "hello";var arr = [1,2,3...
2019-05-07 21:08:05
171
原创 发布-订阅模式
发布-订阅模式在很多前端流行框架中被使用，比如backbone，vue.所以很有必要花时间和精力来了解一下。发布-订阅模式又叫观察者模式。它定义对象间的一种一对多的关系。当一个对象的状态发生改变时，所有依赖它的对象都将得到通知。在JavaScript开发中，我们一般用事件模型来替代传统的发布-订阅模式。如何一步步实现发布-订阅模式1 首先要指定好谁充当发布者。（比如售楼处）2 ...
2019-05-05 10:17:32
178
转载 关于Vue面试会问到的问题
对于MVVM的理解MVVM是Model-View-ViewModel的缩写Model代表数据模型，也可以在Model中定义数据的修改和操作的业务逻辑。View代表UI组件，它负责将数据模型转化成UI展现出来。ViewModel监听模型数据（Model）的改变和控制视图行为，处理用户交互，简单理解就是一个同步View 和Model的对象。连接Model和View的桥梁。在MV...
2019-05-01 23:27:46
301
原创 代理模式
代理模式：为一个对象提供一个占位符或者代用品，以便控制对他的访问。代理模式非常的有意义，在生活中有很多代理模式的例子。比如明星都有经纪人作为他的代理，如果想请明星演出，要先跟他经纪人沟通，经纪人把细节报酬都谈好后在请明星签合同。虚拟代理就是把一些开销很大的对象，延迟到需要他的时候再去创建。虚拟代理实现图片加载图片加载，当网络不好或者图片太大的情况下会出现很长时间的空白，我们可以考虑...
2019-05-01 16:47:43
96
原创 策略模式
啥时策略模式？举个例子，假如你从北京到杭州，可以选择坐飞机去，还可以坐汽车去，还可以自驾去。每个方法都可以去。策略模式就是实现一个任务有多个方法，这些方法都可以相互替换。把这些方法封装起来就是策略模式。再举个例子，年终奖发放，绩效s的年终奖是工资的4倍。绩效A的年终奖是工资的3倍。绩效B的年终奖是工资的2倍。js实现var strategies={ S: func...
2019-04-30 16:29:09
103
原创 JavaScript的单例模式没有那么简单
想必大家都知道单例模式就是不管调用多少次new命令，始终只能创建一个实例对象。写个方法来看看javaScript的单例长什么样。下面这个例子是负责在页面中创建唯一的div节点。代码如下var CreateDiv = (function(){ var instance; var CreateDiv = function(html){ if(instance){ ...
2019-04-29 21:48:59
124
原创 webpack使用知识点
主要是看了阮一峰老师的wepack-demos做一下笔记，原链接：https://github.com/ruanyf/webpack-demos什么是webpack?webpack是为浏览器构建js模块脚本的前端工具webpack需要一个配置文件，名叫：webpack.config.js1 入口文件webpack会读取入口文件，并构建成bundle.js文件// cent...
2019-04-29 11:12:43
242
原创 js在执行new操作的时候都做了哪些事情
// 构造函数 function Car (logo) { this.logo = logo || 'unknown name' } Car.prototype={ start(){}, run(){}, stop(){} } //创建对象 let landRover = new Car('landrover')执行new操作时1 ...
2019-04-25 15:07:38
1010
原创 js对象的继承有哪些实现方式归总
实现对象obj继承prot1 简单粗暴 直接指定原型对象的值const obj={ _proto_:prot, foo:13}2 Object.create创建一个新对象，使用现有的对象来提供新创建的对象的__proto__const obj=Object.create(prot)obj.foo=1233 Object.assign,核心还是crea...
2019-04-24 23:56:56
273
原创 扩展运算符解构赋值对象注意点
1解构赋值的拷贝是浅拷贝，即如果一个键的值是复合类型的值（数组、对象、函数）、那么解构赋值拷贝的是这个值的引用，而不是这个值的副本。let obj={a:{b:2}}let {...x} = objobj.a.b=3console.log(x.a.b) //32扩展运算符的解构赋值，不能复制继承自原型对象的属性。***let o1={a:1}let o2={b:2}o2...
2019-04-23 14:48:09
1330
原创 ES6数组新增方法
//find findIndex数组实例的find方法，用于找出第一个符合条件的数组成员。它的参数是一个回调函数，所有数组成员依次执行该回调函数，直到找出第一个返回值为true的成员，然后返回该成员。如果没有符合条件的成员，则返回undefined。find的回调函数也可以接受三个参数item,index,arrconsole.log([1,2,3,4,5,6,-9].find...
2019-04-23 12:42:57
157
原创 如何让滚动条不占宽度
div定义的宽度 = 内容宽度+滚动条宽度出现滚动条会导致内容偏移，想让滚动条不占宽度 不影响内容的排版,百度到的方法都不能解决问题原来滚动条是可以设置宽度为0的这样滚动条不出现，内容也可以滚动 selector::-webkit-scrollbar{width:0;}...
2018-10-10 18:32:23
27134
4
原创 this.$emit 子组件向父组件传递事件并携带参数
子组件：向父组件传递事件toDetail 并 传递参数 ‘lalalalalala’this.$emit('toDetail', ‘lalalalalala’); 父组件监听事件 并输出参数<total-start-sites @toDetail="toDetails"></total-start-sites>注意：监听的时候 触发的方法只写方法名 ...
2018-09-26 15:00:51
3144
2
原创 小程序的坑
1 不能用overflow:hidden (后患无穷)2 日期格式最好是yyyy/MM/dd hh:mm:ss 因为yyyy-MM-dd hh:mm:ss在个别版本的手机上有问题3 xml 代码里不能写js代码 但是可以比较大小 可以使用三目运算但是浮点数进行比较时会有精度问题 甚至是大小比较错误比如我目前遇到的0.9091<0.9282 在小程序里就总是错误 打印0.9091*1000...
2018-05-25 14:16:39
333
原创 let在for循环中的特点
var a = [] for (let i =0; i<10; i++) { a[i] = function () { console.log(i) } } a[6]() // 6变量i是let声明的 当前i只在本轮循环有效，所以每一次循环的i其实都是一个新的变量。你可能会问：如果每一轮循环的变量都是重新声明的 那它怎么知道上一轮循环的值，从而计算出...
2018-03-23 16:26:56
2737
原创 去掉小数后面多余的零 如1.2000除以1 等于1.2 及原理
去掉小数后面多余的零需求有时候需要我们保留几位小数，如果用toFixed()方法 小数不够会零来凑 但是如果需求要求不能有多余无用的零那怎么处理呢方法1 可以用全局方法parseFloat()parseFloat(1.23000) ==>1.23原理：parseFloat的参数是string (1.23000).toString ==>1.23 所以最后结果是1.23方法而 1.2...
2018-03-08 16:43:31
989
原创 微信小程序wx.navigateTo无法跳转
原因是如果在app.json中设置了tabBar 并且wx.navigateTo要跳转的路径在tabBar已经存在就不能跳转使用 wx.switchTab() 跳转到 tabBar 页面，并关闭其他所有非 tabBar 页面...
2018-02-26 17:55:11
1718
原创 js 设计模式（一）原型模式
首先学习的第一个设计模式是--原型模式原型模式实现的关键是js语言提供了克隆方法 ES5的Object.create()var Plan = function () { this.blood = 100 this.attackLevel = 1 this.defenseLevel = 1}var plan = new Plan()plan.blood = 500plan.att...
2018-02-23 14:06:39
148
原创 关于this指向的小例子
let obj = { fn: function () { console.log(this) let a = function () { console.log(this) } let b = ()=>{ console.log(this) } a() b() }
2018-02-06 16:20:09
204
原创 vue this.$router.push()传参
1 params 传参注意⚠️：patams传参 ，路径不能使用path 只能使用name,不然获取不到传的数据this.$router.push({name: 'dispatch', params: {paicheNo: obj.paicheNo}})取数据：this.$route.params.paicheNothis.$route.params...
2018-01-30 19:34:57
102592
10
原创 Vue修改数组/对象 记录坑
Vue修改数组里的数据,由于js的限制，vue检测不到以下数据的变化当你利用索引直接设置一个项时，例如：vm.items[indexOfItem] = newValue当你修改数组的长度时，例如：vm.items.length = newLength这是常见的问题，有时候使用this.$nexttick也并不会更新数据，为了解决第一类问题，以下两种方式都可以实现和
2018-01-29 11:27:06
5476
2
原创 头部底部固定的另一种实现方式
需求：点击按钮 页面左侧或右侧滑出一个小窗口，头部，底部固定，中间内容区域可以滑动滚动条查看数据，这种窗口 我一般的做法是窗口fixed定位，头部底部也fixed定位或者绝对定位都可以实现，今天看到一种新的实现方式，自信研究了一下，写了一个demo记录一下，也不知这样写好不好，刷新了自己的固有想法，所以记录一下。也劳烦大神评价指教这种写法的优缺点。 这里是标题 这里是标题
2017-11-22 15:23:45
652
转载 vue-devtools chrome调试工具
1.github下载地址：https://github.com/vuejs/vue-devtools有Git的同学直接 git clone https://github.com/vuejs/vue-devtools2.下载安成之后打开cmd进入vue-devtools文件夹把依赖装好npm install 之后再进行npm run build最好装一个cnpm3.然
2017-10-31 13:10:25
350
原创 函数声明与函数表达式的区别
一：函数声明中的函数名是必须的 ，函数表达式中函数名是可选的function add(a,b) { return a+b } let sum=function(a,b){ return a+b }二：函数声明的函数可以在函数声明前就被调用，而函数表达式定义的函数只能在声明之后调用因为两种方式定义的函数的解析方式不同，解析器会事先读取函数声明，即函数声
2017-09-11 17:42:03
185
原创 css实现三角形的两种方法
1.triangle1{ position: absolute; left:500px; top:300px; width:0; height:0; border-top:5px solid red; border-left:5px solid transparent; border-right:5px solid transp...
2017-09-11 10:57:55
343
原创 圆周运动与勾股定理
原来js还可以和数学公式勾股定理结合，而且他们结合后并没有变得枯燥无味，反而可以制作出更好的动画。这面将一个js动态画圆的demo,在这之前需要普及一下数学知识，虽然这些知识初中就学过，估计也都还给老师了。哈哈勾股定理 直角三角形的两个直角边的平方和等于第三边的平方和，a^2+b^2=c^2sin30=1/2 cos60=1/2 (因为根号不会打 所以sin60 cos30就不普及
2017-08-17 22:13:53
520
原创 js 算法面试题
1 给你一组数据 找出规律 写一个方法 传入位置n输出第n个位置的数据，n从1开始算.输入8输出211,1,2，3，5,8,13,21,34,55思路：观察数据规律可以知道每一项都是前两项的数据之和 方法1 递归 f(n)=f(n-1)+f(n-2) function f(n) { if(n<=2)return 1 return f(n-1)+f(n-2
2017-08-17 12:59:32
875
原创 js面试题（二）
1 数组去重方法1 思路：将数组先排序 相同的元素排在一起，然后找一个对比项，从头开始对比 相同的则删除 不同则将不同的作为对比项继续对比var arr=[2,6,9,1,3,4,8,1,2,6,6,3,8,5] function test(arr) { arr=arr.sort();//[1,1,2,2,3,3,4,,5,6,6,6,,8,8,9]
2017-08-17 10:49:33
277
原创 vue那点事儿
1 vue-cli vue脚手架脚手架做什么的？1生成目录结构 2 完成本地开发调试 3 在编写完代码后对代码进行压缩和部署 4 利用热加载特性来提高编程效率 5使用它的单元测试来测试代码功能如果用？首先 要确保 计算机安装了 node npm vue然后 安装vue-cli npm install -g vue-cli (全局安装vue-cli)安装
2017-08-16 17:31:13
294
原创 js面试题(一)
记录几个比较典型的js面试题1 将类似 border-bottom-color的字符串转成驼峰形式的字符串方法1 思路：将字符串以‘-’为分割点 分割成数组，利用字符串的charAt(0)定位到首字母，利用字符串的toUpperCase()转成大写，字符串的substring(1)获取到字符串除了第一位剩余的字符，最后大写的首字母与剩余字符链接即可 function test(...
2017-08-16 09:37:25
411
原创 多列布局
两列 一列定宽 另一列自适应（或 一列不定宽 一列自适应） 方法一： .left{float:left;width:100px;} .right{margin-left:100px;}方法二： .left{float:left;width:100px;} .right{overflow: hidden}方法三： .parent{d
2017-08-09 17:12:04
257
原创 js for循环注意事项
今天写了一个递归方法 递归遍历一个树结构的数据 根据id找到对应的text,递归代码简单 却出现了无限递归 导致每次打开网页都会导致浏览器崩溃 研究了一中午 最后在循坏语句中for(i=0;i<array.length;i++)中加了var就好了；原来是i作用域的问题导致的，我们都知道声明变量时 用var声明 它就是局部变量 不用var声明 它就是全局变量 ；一般写循环，我都习惯不写var 一
2017-07-31 14:25:34
479
原创 手机上拉刷新 angular
最近需要做一个手机端的列表页 有上拉刷新功能 分次请求数据 ，因为就一个页面 所以所有的js都是script标签引入的 这里用的是ng-infinite-scroll.min.js首先引入所需要的jsscript type="text/javascript" src="jgk/js/jquery-1.11.1.min.js">script>script type="text/java
2017-07-25 15:57:32
513
1
原创 blur事件与click事件冲突怎么解决
今天遇到一个问题 一个文本框输入内容的时候会显示一个列表 失去焦点时列表消失 列表中的数据点击时 内容显示到文本框中 但是点击列表数据的click事件与input的blur事件冲突 没有执行 后来把列表的click事件改成mousedown就可以了 但是mousedown为什么跟blur不冲突 而click就冲突呢？先留个疑问吧 以后遇到问题可以换种方法就可以解决 至于原理 以后深究
2017-07-20 17:54:56
738
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人