- 博客(21)
- 资源 (1)
- 收藏
- 关注
原创 Flex布局
https://zhuanlan.zhihu.com/p/25303493 https://juejin.im/post/58e3a5a0a0bb9f0069fc16bb http://www.ruanyifeng.com/blog/2015/07/flex-examples.html https://juejin.im/post/5ac2329b6fb9a028bf057caf https://...
2019-03-25 22:25:53
428
原创 ES6学习(三)之Set的模拟实现
在实现之前我们可以通过阮一峰的ECMAScript 6 入门了解一下Set的基本信息 1、Set的基本语法 new Set([ iterable ]) 可以传递一个可迭代对象,它的所有元素将被添加到新的 Set中。如果不指定此参数或其值为null,则新的 Set为空。 let s = new Set([ 1, 2, 3 ]) // Set(3) {1, 2, 3} let s2 = new Se...
2019-03-24 18:52:47
401
原创 ES6解构赋值及其原理
1、 ECMAScript 5克隆一个数组: var colors = [ "red", "green", "blue" ]; var clonedColors = colors.concat(); console.log(clonedColors); // "[red,green,blue]" ECMAScript 6克隆一个数组:(浅克隆) let colors = [ "red", "...
2019-03-23 17:40:20
1691
3
原创 ES6学习(一)之var、let、const
1、变量提升 概述:变量可在声明之前使用。 console.log(a);//正常运行,控制台输出 undefined var a = 1; console.log(b);//报错,Uncaught ReferenceError: b is not defined let b = 1; console.log(c);//报错,Uncaught ReferenceError: c is not de...
2019-03-21 21:06:13
151
原创 JS函数节流和函数防抖
1、函数防抖 概念: 在事件被触发n秒后再执行回调,如果在这n秒内又被触发,则重新计时。 生活中的实例: 如果有人进电梯(触发事件),那电梯将在10秒钟后出发(执行事件监听器),这时如果又有人进电梯了(在10秒内再次触发该事件),我们又得等10秒再出发(重新计时)。 function debounce(fn, wait) { var timer = null; return functio...
2019-03-20 09:36:29
173
原创 移动端适配
前言:这周工作碰到了移动端1px的问题。以前一直写样式也没有特别注意着一点。还有就是rem的原理。这些其实就是比较常见的移动端适配问题。 下面我们来看一下具体情况 1、基本概念 在了解具体方案原理前,我们先来看一下一些基本概念: 1.1、物理像素(physical pixel) 物理像素又被称为设备像素,他是显示设备中一个最微小的物理部件。每个像素可以根据操作系统设置自己的颜色和亮度。 1.2...
2019-03-19 17:16:35
140
原创 JavaScript之模块化
1、原始写法 function m1(){ //... } function m2(){ //... } 这种做法的缺点很明显:"污染"了全局变量,无法保证不与其他模块发生变量名冲突,而且模块成员之间看不出直接关系。 2、对象写法 var module1 = new Object({ _count : 0, m1 : function (){ ...
2019-03-19 06:55:00
132
转载 Nginx入门
1、Nginx能做什么 反向代理 负载均衡 HTTP服务器(包含静态分离) 正向代理 这是在不使用第三方模块的情况下 2、反向代理 反向代理应该是Nginx做的最多的一件事了,什么是反向代理呢,以下是百度百科的说法:反向代理(Reverse Proxy)方式是指以代理服务器来接受internet上的连接请求,然后将请求转发给内部网络上的服务器,并将从服务器上得到的结果返回给internet...
2018-10-08 22:04:32
131
转载 react 面试题
1、为什么虚拟dom会提高性能? 虚拟dom相当于在js和真实dom中间加了一个缓存,利用dom diff算法避免了没有必要的dom操作,从而提高性能。 具体实现步骤如下: 用 JavaScript 对象结构表示 DOM 树的结构;然后用这个树构建一个真正的 DOM 树,插到文档当中 当状态变更的时候,重新构造一棵新的对象树。然后用新的树和旧的树进行比较,记录两棵树差异把2所记录的差异应用...
2018-08-18 22:16:43
512
原创 react之setState
1、异步更新机制 我们知道,this.state是只读的,更新状态不能直接修改,而是通过this.setState方法。这是为什么呢?this.state只是一个对象,我们修改它的值是没有意义的。仔细想一想,我们之所以要修改state,无非是为了改变页面的渲染状态;所以React设计setState方法就是为了重新渲染页面。 我们可以在setState之后打印一下this.state的值,会发...
2018-08-18 15:26:16
397
转载 webpack 缓存
webpack 缓存 webpack 中进行持久化缓存的呢,我们需要做到以下两点: - 保证 hash 值的唯一性,即为每个打包后的资源生成一个独一无二的 hash 值,只要打包内容不一致,那么 hash 值就不一致。 - 保证 hash 值的稳定性,我们需要做到修改某个模块的时候,只有受影响的打包后文件 hash 值改变,与该模块无关的打包文件 hash 值不变。 hash 文件名是实现...
2018-08-15 21:30:57
1064
转载 webpack代码分离的三种常用方法
代码分离是 webpack 中最引人注目的特性之一。此特性能够把代码分离到不同的 bundle 中,然后可以按需加载或并行加载这些文件。代码分离可以用于获取更小的 bundle,以及控制资源加载优先级,如果使用合理,会极大影响加载时间。 有三种常用的代码分离方法: 入口起点:使用 entry 配置手动地分离代码。 防止重复:使用 CommonsChunkPlugin 去重和分离 ch...
2018-08-15 21:25:51
4069
1
原创 一台电脑同时使用GitLab和GitHub仓库
一、用Git生成两把钥匙-> ssh-keygen -t rsa -C "1447388624@qq.com"二、配置仓库// 全局配置 git config --global user.name 'personal' git config --global user.email 'personal@company.com'// 本地配置 当前项目 git config --local user.n
2017-07-31 20:43:02
536
2
原创 面试常见的css问题
一、position 值 描述 absolute 生成绝对定位的元素,相对于 static 定位以外的第一个父元素进行定位。元素的位置通过 “left”, “top”, “right” 以及 “bottom” 属性进行规定。 relative 生成相对定位的元素,相对于其正常位置进行定位。因此,”left:20” 会向元素的 LEFT 位置添加 20 像素。 fixed
2017-07-31 20:33:21
308
原创 React生命周期详解
React 摒弃了十分消耗性能的手动DOM操作,通过控制组件state和props的改变 利用 diff算法 改变DOM,当DOM需要变动,都会先在虚拟DOM上发生,将实际发生变动的部分渲染在真实的DOM上,这样能极大的提高性能 React 中的组件本质上可以理解为是一个状态机,将状态和输出一一对应,这样可以比较直观的反应程序在不同状态时,对应什么样的输出. 组件的 生命周期 由3个部分组成:
2017-02-25 16:54:03
804
转载 npm 模块安装机制简介
原文链接npm 模块安装机制简介 本文介绍 npm 模块安装机制的细节,以及如何解决安装速度慢的问题。一、从 npm install 说起npm install 命令用来安装模块到node_modules目录。$ npm install <packageName>安装之前,npm install会先检查,node_modules目录之中是否已经存在指定模块。如果存在,就不再重新安装了,即使远程仓库
2017-02-18 15:34:10
382
原创 export 与export default区别
1、ES6之前的模块化JavaScript最初被设计时并不是用来大型应用的,所以在其设计中也并没有模块化标准。随着其应用越来越广泛,一些开源社区和开发者提出了一些模块标准,如:CommoneJS模块化、异步模块定义(AMD)等。这些规范在提出后得到了广泛关注,并逐步被应用到了一些企业级的大型应用。CommoneJS模块化:该标准最成功的应用是Node.js(Node.js在CommoneJS的基础上
2017-02-18 14:58:10
4330
转载 Javascript设计模式理论与实战:单例模式
本文将从最基础的理论开始,讲述单例模式的基本概念和实现,最后用一个例子来讲述单例模式的应用。理论基础概念单例模式,顾名思义就是只有一个实例存在。通过单例模式可以保证系统中
2016-11-06 22:40:42
247
转载 React-router路由实践
Router,hashHistory,Route 首先下载react-router npm install react-router --save 使用时,路由器Router就是React的一个组件。 import { Router } from 'react-router'; render(, document.getElementById('app')); Router组
2016-08-24 22:55:21
3546
原创 webpack学习之webpack.config.js详解
一、webpack.config.js概览var webpack = require('webpack'); module.exports = { entry: [ 'webpack/hot/only-dev-server', './js/app.js' ], output: { path: './build',
2016-08-24 21:30:36
1708
转载 webpack-react
webpack-react 在github新建一个仓库名为webpack-react,再clone到本地进行开发(当然你也可以不要这步); 第一步、安装全局包$ npm install babel -g $ npm install webpack -g $ npm install webpack-dev-server -g 第二步、创建根目录创建一个根目录,目录名为:webpack-react,
2016-08-23 22:57:05
412
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人