- 博客(47)
- 收藏
- 关注
RSS订阅原创 nginx 反向代理配置
server { listen 80; server_name localhost; location /a { proxy_set_header Host "promotion.isv-dev.youzan.com"; //代理的接口 proxy_pass https://promotion.isv-dev.youzan.com...
2019-11-25 15:51:16
361
原创 react 16.8更新的新的钩子函数
最新的生命周期删掉了三个will方法，新增了两个get方法：delete:componentWillMount,componentWillReceiveProps,componentWillUpdate,add:static getDerivedStateFromProps,static getDerivedStateFromProps(）这个钩子函数，在挂载，更新时都会...
2019-10-04 14:07:49
1712
原创 前端nginx代理配置
前端nginx代理配置需求是这样的，前端项目跑起来后（127.0.0.1::8888），我想通过其他域名来访问到（www.abc.com）本地ip是 **192.168.1.109 **首先配置host ：192.168.1.109 www.abc.com配置nginx代理服务器：server { listen 80; server_name 192.168.1.10...
2019-09-28 16:11:39
1984
原创 charles代理请求本地文件
假设在：http://nrs-demo.vmcshop.com域名下，访问代理接口：http://nrs-mall.vmcshop.com/user/GetUserProperty1.首先在本地生成个文件内容为：2.打开charles代理：工具->本地映射：配置好后，直接访问这个接口是有数据的：第一步结束，能够访问接口拿到数据！第二部，去项目里运行这...
2019-09-11 17:42:06
3991
转载 new操作符都做了什么
new操作符都做了什么四大步骤：1、创建一个空对象，并且 this 变量引用该对象，// lat target = {};2、继承了函数的原型。// target.proto = func.prototype;3、属性和方法被加入到 this 引用的对象中。并执行了该函数func// func.call(target);4、新创建的对象由 this 所引用，并且最后隐式的返回 this...
2019-07-04 10:45:28
1028
原创 call,apply,bind的实现
// call实现Function.prototype.callFun = function(obj, ...args) { if (!obj) { obj = typeof window === 'undefined' ? global : window } obj.func = this let res = obj.func(...args) delete ob...
2019-06-28 17:09:25
168
原创 解构删除属性
let {_internal, tooBig, ...cleanObject} = {el1: '1', _internal:"secret", tooBig:{}, el2: '2', el3: '3'} console.log(cleanObject); // {el1: '1', el2: '2', el3: '3'}
2019-06-24 17:43:01
1041
原创 数组的对象解构
数组的对象解构数组也可以对象解构，可以方便的获取数组的第n个值 const csvFileLine = '1997,John Doe,US,john@doe.com,New York'; const { 2: country, 4: state } = csvFileLine.split(','); country // US state // N...
2019-06-24 17:38:57
713
转载 数组平铺到指定深度
5.5 将数组平铺到指定深度使用递归，为每个深度级别 depth 递减 1 。 使用 Array.reduce() 和 Array.concat()来合并元素或数组。 基本情况下， depth 等于 1 停止递归。 省略第二个参数， depth 只能平铺到 1 (单层平铺) 的深度。 const flatten = (arr, depth = 1) => dep...
2019-06-24 17:36:03
693
转载 数字补0操作
4.3 数字补0操作感谢网友 @JserWang @vczhan 提供 这个小技巧有时候比如显示时间的时候有时候会需要把一位数字显示成两位，这时候就需要补0操作，可以使用 slice和string的 padStart方法 const addZero1 = (num, len = 2) => (`0${num}`).slice(-len) const addZ...
2019-06-24 14:57:26
990
原创 原型继承
一图搞懂继承：1,Object类是Function类的实例，所以Object.__proto__指向了Function.prototype;2,Function类是不是Function对象创造出来的实例：对于Function.__proto__ === Function.prototype这一现象有 2 种解释，争论点在于 Function 对象是不是由 Function 构造...
2019-05-08 17:06:24
155
转载 js复制功能
/** * 复制字符串到剪贴板的函数 * @param {String} value 需要被复制的字符串 * @returns {Boolean} 操作结果 */ copy = value => { var currentFocus = document.activeElement // 保存当前活动节点 let input = docume...
2019-05-04 09:58:36
195
原创 grid布局
grid布局属性：创建一个grid容器：display:grid;grid-template:grid-template是grid-template-rows，grid-template-columns和grid-template-areas属性的缩写。grid-template: <grid-template-rows> / <grid-template...
2019-03-27 23:27:27
608
原创 三大框架之React
引入react文件跑起页面：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <me...
2019-03-23 23:59:27
218
原创 js的防抖与节流
<button id="debounce">点我防抖！</button> <script> // 1、获取这个按钮，并绑定事件 var myDebounce = document.getElementById("debounce"); myDebounce.addEventLis...
2019-03-15 10:47:43
269
原创 Vue知识点合集
内容有点乱，想到一点写一点吧新建一个.vue文件后生成template模板快捷方式是：scaffold+ tab键Vue插槽使用与参数传递：子组件状态值的传递给父组件插槽使用子组件：<template> <div> <p>我是TODOitem</p> <input type="chec...
2019-03-14 17:52:37
280
原创 变态面试题1
将数组扁平化并去除其中重复数据，最终得到一个升序且不重复的数组 var arr = [ [1, 2, 2], [3, 4, 5, 5], [6, 7, 8, 9, [11, 12, [12, 13, [14] ] ] ], 10];方法1：let res = [...new Set(arr.flat(Infinity))].sort((a,b)=>a-b)；方法2：...
2019-02-21 10:21:44
259
原创 event loop单线程执行顺序
遇到异步会添加一个微任务，等宏任务执行完毕，就会检查是否有微任务，如果有就执行，没有的话就会执行宏任务，以此循环；注意点1：异步会添加到微任务队列，宏任务执行完毕后执行微任务时，Promise的异步要比async的优先，所以优先执行；注意点2：定时器的异步是在下个宏任务的开始，所有最后执行；...
2019-02-20 17:28:00
582
原创 Cookie
function getCookie(key) { var arr1 = document.cookie.split('; '); //这里是分号+空格分隔 for (var i = 0, len = arr1.length; i < len; i++) { var arr2 = arr1[i].split('...
2019-02-15 13:56:40
278
2
原创 多种组合式继承方法
// 寄生组合式继承，最理想的继承方法 function inheritPrototype(sub, super) { //sub是子函数，super是父函数，sub继承super var prototype = Object.create(super.prototype); // 创建对象，父原型的副本 prototype.co...
2019-02-14 10:50:07
304
原创 Chrome的侧边滚动条样式修改
倒是支持-webkit-前缀的浏览器可以说说。例如，对于 Chrome 浏览器：• 整体部分，::-webkit-scrollbar；• 两端按钮，::-webkit-scrollbar-button；• 外层轨道，::-webkit-scrollbar-track；• 内层轨道，::-webkit-scrollbar-track-piece；• 滚动滑块，::-webkit-scro...
2019-02-02 13:48:06
1511
原创 元素的宽高问题
1．元素尺寸的相关概念下面的内容会牵扯到各类包含“尺寸”字样的名词，为了大家在阅读的时候不产生困扰，这里专门把相关概念梳理一下。我们这里的各类“尺寸”命名和对应的盒子类型全部参考自 jQuery 中与尺寸相关 API 的名称。• 元素尺寸：对应 jQuery 中的$().width()和$().height()方法，包括 padding和 border，也就是元素的 border box...
2019-02-01 11:54:54
322
原创 最大高度动画
<style> .a{ max-height:0; background:red; overflow: hidden; transition: all linear 5s; } .b{ height:200px; ...
2019-01-31 09:53:30
250
原创 文字一行居中，多行左对齐demo
<style> .nav { background-color: #cd0000; width:200px; text-align: center; padding:10px; } .nav-a{ backgrou...
2019-01-30 14:44:31
970
原创 异步数据顺序执行问题
<script> let URL = 'https://api.github.com/users/a'; let list_pro = []; // promise_All处理异步函数顺序 for(let i=0;i<10;i++){ let url=...
2019-01-30 11:43:01
667
原创 js的精度运算方法
floatAdd: function(arg1, arg2) { var r1, r2, m; try { r1 = arg1.toString().split(".")[1].length } catch (e) { r1 = 0 } try { r2 = arg2.toString().split(".")[1].l...
2019-01-28 11:16:39
878
转载 bom几个获取位置的api
offset：基本用法：找到对象后，使用offset大致包括offsetTop、offsetLeft、offsetWidth、offsetHeight、offsetParent五个部分，直白的翻译过来分别是上偏移、左偏移、偏移宽度、偏移高度、偏移父级。翻译虽不够恰当，但仍可体现出其大致意义。offsetTop: 元素相对父元素上方的偏移。offsetLeft： 元素相对父元素左边框的...
2019-01-09 13:38:56
523
原创 es6的类class
定义一个类的方法为：class Person{ constructor(name,age){ this.name=name; this.age=age; } showName(){ ...
2019-01-06 23:26:35
149
原创 js 中的this bind ,call , apply
在JavaScript中，call、apply和bind是Function对象自带的三个方法，都是为了改变函数体内部 this 的指向。 apply 、 call 、bind 三者第一个参数都是 this 要指向的对象，也就是想指定的上下文； apply 、 call 、bind 三者都可以利用后续参数传参； ...
2019-01-06 16:27:43
185
原创 html自带的fetch 异步请求 api
最简单的fetchAPI调用如下：fetch('https://api.github.com/users/chriscoyier/repos') .then(response => response.json()) .then(data => { // data就是我们请求的数据 console.log(data) });fetch兼容性问题：可以...
2019-01-05 11:35:12
2823
原创 es6的模块化
html页面里，可以通过script标签引入模块：如下//1.jsexport const a = "我是xxx";console.log("哈哈哈");export let b = "我喜欢yyy";html页面<script type='module'> import {a,b} from './js/1.js'; console....
2019-01-03 22:33:03
180
原创 h5的meta标签使用
<meta name="format-detection" content="telephone=no, email=no">‘format-detection’ 忽略页面对手机号、email的识别 telephone：yes|no email：yes|no<meta name="viewport" content="width=device-width, ini...
2018-12-28 20:00:11
563
原创 git学习之路
首先安装git安装完成后，还需要最后一步设置，在命令行输入：$ git config --global user.name "Your Name"$ git config --global user.email "email@example.com"创建版本库第二步，通过git init命令把这个目录变成Git可以管理的仓库：$ git initInitialized...
2018-12-28 19:44:24
176
转载 交换两个变量的多种方法
首先定义两个变量var a = 123;var b = 456;第一种：var t;t = a;a = b;b = t;第二种：a += b;b = a - b;a -= b;第三种：a ^= b;b ^= a;a ^= b;第四种：a = {a:b,b:a};b = a.b;a = a.a;第五种：a = [a,b];b = a[0]...
2018-12-24 09:30:34
269
原创 文字居中方法
要实现这样的效果，首先你得需要一个属性：text-align-last: justify;代码如下： <style> div.flex { width: 100px; display: inline-block; text-align-last: justify; ...
2018-12-22 09:27:27
2476
原创 实现stick footer布局
代码模型：<div class="container"> <div class="content"> <div class="content-main"></div> </div> <div class="close"&am
2018-12-20 22:27:58
267
原创 一行或多行文字显示不下显示省略号问题
显示一行：overflow: hidden;text-overflow:ellipsis;white-space: nowrap;显示多行： overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp:1; -webkit-box-o...
2018-12-05 11:23:52
1653
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人