Allan_L的博客

原创 防抖和节流

/* 节流和防抖的区别是什么？ 节流：频繁输入/点击，只在达到规定的时间后才发送接口请求（懒加载：滚动条监听，按钮点击） 防抖：频繁输入/点击，每次都会重新计时，直到用户停止的时间达到限制的时间。（输入框，按钮点击，）*/window.onload = function() { // 1、获取按钮，绑定点击事件 var myThrottle = docu...

原创 js字符串的方法集合

var str = 'liu_Allan9'; //1. slince() 第一个参数为开始截取的下标，第二个参数为结束的下标（截取的字符不会包括此下标） console.log(str.slice(0,2)) //2. substr() 从起始（第一个参数）字符处，截取指定数目（第二个参数）的字符 console.log(str.substr(...

原创 day4(2019-2-22 周日) JavaScript中的Generator函数 和 iterator函数

/* auth: Allan_Liu date: 2019-2-24 mail: [email protected] info: Generator函数的简介： 1. *代表是生成器函数（Generator） 2. yield关键字是ES6的新特性，通过它来指定调用next()方法时的 返回值 及 返回顺序(比如Example1) ...

原创 day3(2019-2-13 周3) Promise专栏

Promise.all()方法问题：什么是promise.all（）方法？promise.all()方法用于将多个 Promise 实例，包装成一个新的 Promise 实例。promise.all()方法接受一个参数， 这个参数可以一般是一个数组（或者其他具有iterator迭代属性的参数），而且必须是每个成员都是promise实例。注意：所有的参数必须都是resolve状态，prom...

原创 day2（ 2019-2-12 周2)this指向，es6/es7新规 iterator迭代器

7. this指向确认this指向是在执行代码的时候，而不是定义代码的时候。因为this是执行上下文的一部分。Example1：var a = { name: 'A', fn: function () { console.log(this.name) } } a.fn() // this === a a.fn.call({name: 'B'}) // this === {name: '...

原创 day1(2019-2-11)

1. 变量（全局 和 局部） 关于--变量提升：var声明的变量有变量提升，会提升到全局或者当前函数体的顶端Es6的提出块级作用域的概念，let和const存在TDZ临时死区概念，不存在变量提升Example：function test() {//TDZ临时死区开始console.log(a) // a is not defined!//TDZ临时死区结束l...

原创 亲测好用系列：webpack.config.js常见配置介绍

在webpack.config.js文件中：现在的webpack版本需要指定当前的构建环境，mode: devlopment代码书写错误，配置 devtool: ‘source-map’ 可定位到源码，如果没有配置此项，只能定位到打包以后的bundle.js文件。...

原创 亲测好用系列：package.json中常用的webpack插件以及作用

cross-env： 忽略跨平台，兼容windows和mac系统 NODE_ENV:  是用户一个自定义的环境变量 NODE_ENV的用法：在webpack.config.js中通过 process.env.NODE_ENV 判断生产环境或开发环境的依据的process ：node.API  全局变量 process.env:  读取项目运行环境的配置webpack-dev-serv...

原创 亲测好用系列：命令行中输入 npm run *** 一次执行两条命令

亲测好用系列：1.在当前项目中，执行以下依赖：npm install concurrently --save //concurrently：同时2. 在package.json文件的script标签，嵌入一下代码："start": "concurrently \"npm run dev\" \"node app.js\"",此时，在命令行中，输入n

原创 webpack常见插件

 html-webpack-plugin我们可以看到，webpack 生成 print.bundle.js和 app.bundle.js文件，这也和我们在 index.html文件中指定的文件名称相对应。如果你在浏览器中打开 index.html，就可以看到在点击按钮时会发生什么。但是，如果我们更改了我们的一个入口起点的名称，甚至添加了一个新的名称，会发生什么？生成的包将被重...

原创 js中比较两个数组中是否含有相同的元素，可去重，可删除合并为新数组

//做比较的两个数组var array1 = ['a','b','c','d','e'];//数组1 （所有人）var array2 = ['d','f','e','a','p'];//数组2 （需要删除的人）//临时数组存放var tempArray1 = [];//临时数组1var tempArray2 = [];//临时数组2for(var i=0;i<arra...

原创 网页Request Headers请求头和Response Headers响应头

 Request HeadersAccept:告诉服务器，客户机支持的数据类型Accept-Encoding:告诉服务器，客户机支持的数据压缩格式Cache-Control：缓存控制，服务器通过控制浏览器要不要缓存数据Connection:处理完这次请求，是断开连接还是保持连接Cookie:客户机通过这个可以向服务器带数据Host:访问的主机名Upgrade-I...

原创 git stash 的各项命令用法

今天在看一个bug，之前一个分支的版本是正常的，在新的分支上上加了很多日志没找到原因，希望回溯到之前的版本，确定下从哪个提交引入的问题，但是还不想把现在的修改提交，也不希望在Git上看到当前修改的版本（带有大量日志和调试信息）。因此呢，查查Git有没有提供类似功能，就找到了git stash的命令。综合下网上的介绍和资料，git stash（git储藏）可用于以下情形：发现有一个类是多余的...

原创 git rebase 和git merge区别

使用下面的关系区别这两个操作：git pull = git fetch + git mergegit pull --rebase = git fetch + git rebase现在来看看git merge和git rebase的区别。假设有3次提交A,B,C。在远程分支origin的基础上创建一个名为"mywork"的分支并提交了，同时有其他人在"origin"上做了一些修改...

原创 打印中奖名单表格流程（wps表格）

1. 将fate项目中的add.txt文件中的中奖人名单，复制粘贴到企微中并做好记录（第几次中奖的人数）。2. 启动windows的wps表格，选中第一个单元格（A1），从企微中赋值、粘贴名单。粘贴完以后，直接去“数据”--》“分列”--》“分隔符号”--》逗号和英文冒号（作为依据）--》 然后点击下一步和完成3. 全部选中并复制， 选中下面一行的空白单元格（A列），然后点击 “开始” -...

原创 本地代码与远程Git建立连接（Mac）

1. 确定本地是否已有公钥密钥？在终端输入：cd ~/.ssh 2. 查看自己的公钥？输入： ls 展示所有文件会有3个文件：id_rsa id_rsa.pub known_hosts (如果没有，则需要创建公钥密钥： $ssh-keygen -t rsa -C "你的git账号" ) 输入： cat id_rsa.pub （之后展示的就是所有的公钥了） 3. ...

原创 Mac笔记本windows虚拟机安装教程

没有太多的介绍，不需要去看太多的文字，只要按照视频里的教成做就好了，避免走弯路（迅雷），视频里都介绍到了，我是按照第一种做的：以下是原文链接http://www.zealer.com/post/862 有一点需要说的：不知道有的人会不会像我一样，parallers DeskTop会卡死，就像下面这样：解决办法是：选中pd ---》 菜单栏“文件”-------》点击“删除”（会弹出...

原创 Css画画系列-----三角、对勾等

画对勾：.container { width: 8px; height: 16px; border-color: rgba(117,200,43,1); border-style: solid; border-width: 0 2px 2px 0; transform: rotate(45deg); }三角：.contai...

原创 前端面试--js代码片段（基础中的基础，持续更新中）

代码片段1： var arr1 = [1,2,3,4,5] var arr2 = [] for(var i = 0; i < arr1.length; i ++) { arr2.push(function(){ //循环完给arr2push的，所以都是5 alert(i) }) } arr2[0]() 此代码...

原创 单页应用（SPA） 和 多页应用（MPA) 的对比

原创 封装进度条（react + 无状态组件，补充antd.desgin进度条 ）

//无状态组件 Liu 2018.11.13import React from ‘react’;import ‘./order_proBar.less’const OrderProgress = (props) => {let isShow = { display: ‘none’ } //是否显示文字的3...

原创 react-Redux 的简单介绍（简单、易懂系列！）

先安装redux： npm install redux 1. redux的作用：redux是一门数据层框架，解决数据传递的问题。由当时的层层传递数据，改变为数据共享（可跨层获取数据）2. 熟悉redux流程：（口语化简述redux流程）借书的人（React Components）说一句话 ------>“要借xx书”（这句话是一个action对象，store....

原创 利用二次赋值变量，实现不同点击显隐——wepy框架

 点击当前A标题，发送请求展示下拉框，再次点击A隐藏下拉框点击B标题发送请求展示下拉框，再次点击A隐藏下拉框特殊要求：当A展开时，点击B，要求：A的下拉框隐藏，B的下拉框展示遇到的困难：点击B时，A不会自动隐藏。或者点击A时，A无法手动隐藏 解决思路：根据A和B的唯一id，设置变量activityId接收，又将activityId 赋值给 aaa在d...

原创 wepy框架 —— 在微信小程序中的运用 —— 踩坑集锦（持续更新中）

之前遇到一个问题，在页面中，写了一个二层嵌套的三目运算，这样很影响性能, 如下图:就是上图这样，也不直观，也耗费性能：于是优化后：这里有一点需要注意： 就是绿框中的方法属于自定义方法，按照wepy框架的规定，需要在methods外面定义...大家切记这一点就好了。...

原创 button组件、 onShareAppMessage 方法实现 —— 自定义传参 —— 微信小程序

有时候自定义分享按钮——需要传参，可是小程序的button组件，并不支持传参，这个时候，我们可以在button上，自定义传参，格式如下：data-属性名 = " {{ 参数 }} " 然后在onShareAppMessage方法中，可以接收到参数，并打印出来： 这样就可以实现小程序的button组件自定义传参了。。  ...

原创 微信小程序之——自定义分享按钮（完整版）

1.声明 onShareAppMessage 函数  onShareAppMessage() {         return {       title: '弹出分享时显示的分享标题'        desc: '分享页面的内容',        path: '/page/user?id=123' // 路径，传递参数到指定页面。     }      }, ...

原创 小白都能看懂的闭包（closure）

前言：闭包（closure）是Javascript语言的一个难点，也是它的特色，很多高级应用都要依靠闭包实现。要理解闭包，首先必须理解Javascript特殊的变量作用域。变量的作用域无非就是两种：全局变量和局部变量。Javascript语言的特殊之处，就在于函数内部可以直接读取全局变量。 1. 关于全局变量 和 局部变量的 理解：函数外面： var a = 20； 此...

原创 vue 的 $emit 的用法（父子组件传值）

vue 父子组件传值的方式，父组件 --> 子组件  或者  子组件 ----> 父组件下面，简洁的说一下vue中这两者传值的方式：子组件：在methods方法中，触发this.$emit('reload',  param）；  父组件：父组件中监听reload方法，并触发init方法。...

原创 新手小白入坑必看——JSON对象 和 JSON字符串

有时候，不少同学遇到，js可以获取到对象，但是取不出值来，你遇到过吗？下面倾听我一一道来：JSON对象是可以通过js来取值的，比如：JSON字符串是前后端用来进行数据传递的，比如：JSON字符串转JSON对象的几种方法：var obj = eval('(' + str + ')');    //eval函数是js自带var obj = str.parseJSON(); //由JSON字符串转换为J...

原创 让你马上明白isPointInPath 属性—— canvas的 isPointInPath 属性测试案例

<!DOCTYPE html><html><head> <meta charset="utf-8"> <title>canvas事件</title></head><body><canvas id="myCanvas" wi

原创 新手小白包教包会的 —— canvas画时钟

本次画时钟的几个步骤： 1. 布置静态表盘。 2. 布置数字 3.设置时分秒的指针转动速度技术点： canvas 和 javaScript 思路： 利用canvas画圆 和 利用 js获取时间戳，动态绘制表盘，实现时钟指针的走动。关于canvas的简单介绍： canvas标签上要绑定宽，高； canvas的默认中心点为左上角，默认的水平方向为x轴；这3点在之后的时钟制作中都需要知道。下面是思路详解...

原创 关于filter 和 forEach 的实际用法

有一个输入框，包含下拉选项。把后台返回的数据，以列表的形式展现在下拉框的下拉选项中。返回的数据中，会有一个么默认参数，含有默认参数的选项，需要在页面加载的时候，展示额外在输入框中。在computed计算属性中，写一个isLAtestData方法。isLatest === 1 时，该条数据为需要展示在输入框的默认数据。2. 当点击下拉框中的选项时，需要在输入框中展示出来。在绑定的点击事件上，接收页面...

原创 今天发现两个css样式的小问题

No.1 cacl (CSS3计算属性)calc是英文单词calculate(计算)的缩写，是css3的一个新增的功能，你可以使用calc()给元素的border、margin、pading、font-size和width等属性设置动态值。以前我们可以使用box-sizing:border-box;来设置盒子的属性为不加上边距。现在我们又多了一个选择了。但要注意，两者只能使用一个哦，否则就会造成冲...

原创 关于：代码加载时，页面会短暂显示v-if的所有判断结果；最后才能显示正确的结果。 解决办法：

设置开关变量，接收到返回数据后，if 根据返回数据判断，开关变量的状态。

原创 H5页面，遇到css样式不兼容部分ios机型，解决办法（No .1）

问题： App有一个底部栏（要求：永远bottom：0），但是在部分页面，底部栏超出了屏幕的高度，所以，看上去好像是消失不见了一样。。思路：页面挂载的时候，判断一下offsetTop，如果大于当前屏幕的高度，就让其上移：translateY（上移动数值为：当前底部栏的offset - 页面的高度）...